Base64缂栬В佸畬鍏ㄦ寚鍗楋細浠庡鐞嗗埌搴旂敤的勫叏鏂逛綅瑙ｆ | 胖袋鼠锟?/title> <meta name="description" content="璇︾粏浠粛Base64缂栬В佺殑宸ヤ綔鍘熺悊銆佺佽繃绋�佸父瑙佸簲ㄥ満鏅�佸伐鍏蜂娇ㄦ妧宸э紝姪�鍙戣�叏闈㈡帉鎻ase64鎶�鏈?> <meta name="keywords" content="Base64,Base64缂栬В锟�?Base64鍘熺,Base64搴旂,Base64宸ュ,鍓嶇�锟?鍚庣�锟?鏁版嵁浼犺緭"> <link rel="canonical" href="https://zhihuinews.com/articles/base64-complete-guide.html">  <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Article", "headline": "Base64缂栬В佸畬鍏ㄦ寚鍗楋細浠庡鐞嗗埌搴旂敤的勫叏鏂逛綅瑙ｆ", "description": "璇︾粏浠粛Base64缂栬В佺殑宸ヤ綔鍘熺悊銆佺佽繃绋�佸父瑙佸簲ㄥ満鏅�佸伐鍏蜂娇ㄦ妧宸э紝姪�鍙戣�叏闈㈡帉鎻ase64鎶�鏈?, "datePublished": "2026-04-26", "dateModified": "2026-04-26", "url": "https://zhihuinews.com/articles/base64-complete-guide.html", "author": { "@type": "Organization", "name": "胖袋鼠锟? }, "publisher": { "@type": "Organization", "name": "胖袋鼠锟? } } </script>  <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [ { "@type": "ListItem", "position": 1, "name": "棣栭", "item": "https://zhihuinews.com/index.html" }, { "@type": "ListItem", "position": 2, "name": "鏂囨", "item": "https://zhihuinews.com/articles/index.html" }, { "@type": "ListItem", "position": 3, "name": "Base64缂栬В佸畬鍏ㄦ寚鍗楋細浠庡鐞嗗埌搴旂敤的勫叏鏂逛綅瑙ｆ", "item": "https://zhihuinews.com/articles/base64-complete-guide.html" } ] } </script> <style> * { margin: 0; padding: 0; box-sizing: border-box; } :root { --bg-color: #ffffff; --text-color: #1f2937; --link-color: #2563eb; --border-color: #e5e7eb; --code-bg: #f6f8fa; --quote-bg: #fafbfc; --quote-border: #e2e8f0; --card-bg: #f9fafb; } @media (prefers-color-scheme: dark) { :root { --bg-color: #111827; --text-color: #f3f4f6; --link-color: #60a5fa; --border-color: #374151; --code-bg: #1e1e1e; --quote-bg: #2d2d2d; --quote-border: #4b5563; --card-bg: #1f2937; } } body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; background-color: var(--bg-color); color: var(--text-color); line-height: 1.4; min-height: 100vh; } .container { max-width: 1000px; margin: 0 auto; padding: 0 20px; } @media (max-width: 768px) { .container { padding: 0 15px; } } .back-link { display: inline-block; margin: 20px 0; color: var(--link-color); text-decoration: none; font-size: 14px; } .back-link:hover { text-decoration: underline; } .article { background-color: var(--bg-color); border-radius: 8px; padding: 40px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); } @media (max-width: 768px) { .article { padding: 24px; } } h1 { font-size: 32px; line-height: 1.3; font-weight: 600; margin-bottom: 16px; } @media (max-width: 768px) { h1 { font-size: 28px; } } h2 { font-size: 24px; line-height: 1.3; font-weight: 600; margin-top: 48px; margin-bottom: 12px; } @media (max-width: 768px) { h2 { font-size: 22px; } } h3 { font-size: 20px; line-height: 1.4; font-weight: 600; margin-top: 32px; margin-bottom: 8px; } @media (max-width: 768px) { h3 { font-size: 18px; } } h4 { font-size: 18px; line-height: 1.4; font-weight: 500; margin-top: 24px; margin-bottom: 8px; } @media (max-width: 768px) { h4 { font-size: 16px; } } p { margin-bottom: 14px; font-size: 16px; } @media (max-width: 768px) { p { font-size: 15px; } } a { color: var(--link-color); text-decoration: none; } a:hover { text-decoration: underline; } ul, ol { padding-left: 24px; margin-bottom: 20px; } li { margin-bottom: 8px; font-size: 16px; } @media (max-width: 768px) { li { font-size: 15px; } } .code-block { background-color: var(--code-bg); font-family: 'Courier New', Consolas, monospace; font-size: 14px; padding: 16px; border-radius: 8px; overflow-x: auto; margin: 16px 0; } blockquote { border-left: 4px solid var(--quote-border); background-color: var(--quote-bg); padding: 12px 16px; font-style: italic; font-size: 15px; margin: 16px 0; } img { display: block; max-width: 100%; margin: 20px auto; border-radius: 8px; } figcaption { text-align: center; font-size: 14px; color: #6c757d; margin-top: 8px; margin-bottom: 20px; } .metadata { display: flex; gap: 16px; font-size: 14px; color: #6c757d; margin-bottom: 32px; flex-wrap: wrap; } .metadata span { display: flex; align-items: center; gap: 4px; } .related-tools { margin-top: 64px; margin-bottom: 48px; } .related-tools h3 { font-size: 20px; font-weight: 600; margin-bottom: 24px; } .tool-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 24px; } @media (max-width: 768px) { .tool-grid { grid-template-columns: repeat(2, 1fr); } } .tool-card { background-color: var(--card-bg); border-radius: 8px; padding: 12px; border: 1px solid var(--border-color); } .tool-card h4 { margin-top: 0; margin-bottom: 4px; font-size: 16px; line-height: 1.2; } .tool-card p { margin-bottom: 8px; font-size: 14px; line-height: 1.3; color: #6c757d; } .tool-card a { font-size: 14px; } .more-tools { margin-top: 16px; font-size: 14px; } .related-docs { margin-top: 48px; margin-bottom: 48px; } .related-docs h3 { font-size: 20px; font-weight: 600; margin-bottom: 24px; } .doc-list { list-style: none; padding: 0; } .doc-list li { margin-bottom: 16px; background-color: var(--card-bg); border-radius: 8px; padding: 12px; border: 1px solid var(--border-color); } .doc-list h4 { margin-top: 0; margin-bottom: 4px; font-size: 16px; } .doc-list p { margin-bottom: 0; font-size: 14px; color: #6c757d; } .all-docs { margin-top: 24px; font-size: 14px; background-color: var(--card-bg); border-radius: 8px; padding: 12px; border: 1px solid var(--border-color); display: flex; align-items: center; min-height: 60px; } .footer { margin-top: 44px; padding-top: 18px; border-top: 1px solid var(--border-color); } /* ========== 鎺ㄨ崘鏉潡鏍峰紡 - 涓ユ牸鎸夌収宸ュ叿�鍙戣鑼冨疄锟?========== */ /* 鎺ㄨ崘鏉潡瑰 */ .recommendations-section { margin-top: 28px; padding-top: 28px; border-top: 1px solid rgba(148, 163, 184, 0.18); } /* 鏉垮潡鏍鏍峰紡 */ .section-title { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; font-size: 18px; font-weight: 600; color: var(--text-color); margin-bottom: 16px; padding-left: 12px; border-left: 3px solid #2563eb; line-height: 1.4; text-align: left; } /* 宸ュ叿鍗＄缃戞牸冨眬 - 4锟�?*/ .tools-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 16px; } /* 宸ュ叿鍗＄鏍峰紡 */ .tool-card-mini { display: block; padding: 14px; background: var(--bg-color); border: 1px solid var(--border-color); border-radius: 8px; text-decoration: none; transition: all 0.2s ease; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; text-align: left; } .tool-card-mini:hover { border-color: #2563eb; box-shadow: 0 4px 12px rgba(37, 99, 235, 0.1); transform: translateY(-2px); } .tool-card-mini-header { margin-bottom: 6px; } .tool-name { font-size: 15px; font-weight: 600; color: #2563eb; line-height: 1.3; } .tool-desc { font-size: 13px; color: #6c757d; margin: 0; line-height: 1.4; } /* 鏂囨。鍗＄鍒楄 */ .docs-list { display: flex; flex-direction: column; gap: 12px; } /* 鏂囨。鍗＄鏍峰紡 */ .doc-card { display: flex; gap: 12px; padding: 14px; background: var(--bg-color); border: 1px solid var(--border-color); border-radius: 8px; text-decoration: none; transition: all 0.2s ease; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; } .doc-card:hover { border-color: #2563eb; box-shadow: 0 4px 12px rgba(37, 99, 235, 0.1); transform: translateY(-2px); } .doc-icon { display: inline-flex; margin-right: 6px; } .doc-icon svg { width: 16px; height: 16px; color: #2563eb; stroke-width: 1.5; } .doc-info { flex: 1; min-width: 0; } .doc-title { display: block; font-size: 15px; font-weight: 600; line-height: 1.4; margin-bottom: 4px; text-decoration: none; } .doc-desc { font-size: 12px; color: #64748b; margin: 0; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; } /* 搴曢儴閾帴鏍峰紡 */ .more-link { display: block; text-align: center; margin-top: 16px; font-size: 14px; font-weight: 600; text-decoration: none; padding: 12px 24px; background: var(--bg-color); border: 1px solid var(--border-color); border-radius: 8px; transition: all 0.2s ease; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; } .more-link:hover { border-color: #2563eb; box-shadow: 0 4px 12px rgba(37, 99, 235, 0.1); transform: translateY(-2px); } /* 鍝嶅簲忓灞 */ @media (max-width: 900px) { .tools-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 600px) { .tools-grid { grid-template-columns: 1fr; } } </style> <script src="../assets/baidu-analytics.js"></script> </head> <body> <div class="container"> <div class="header-bar"> <a href="../index.html" class="back-link">← 返回首页</a> <a href="../index.html" class="tool-brand-link"><span class="brand-icon"></span>胖鼠<span class="brand-domain" style="font-weight:700;font-size:0.9rem;color:#333;opacity:0.8;margin-left:0.12rem;letter-spacing:0.8px;font-family:'Helvetica Neue','Arial Narrow',Arial,sans-serif;font-stretch:condensed;">pangdaishu.com</span></a> </div><div class="article"> <h1>Base64缂栬В佸畬鍏ㄦ寚鍗楋細浠庡鐞嗗埌搴旂敤的勫叏鏂逛綅瑙ｆ</h1> <div class="metadata"> <span>胖袋鼠锟?/span> <span>2026-04-26</span> </div> <p>鍦ㄧ幇浠ｈ蒋浠跺紑鍙戜腑锛孊ase64缂栬В佹槸涓�椤瑰�浣嗚嚦鍏抽噸瑕佺殑鎶�鏈�傛棤璁烘槸鍦ㄥ墠绔紑鍙戜腑的浘鐗囧祵鍏ャ�佸悗绔疉PI的勬暟鎹紶杈擄紝杩樻槸鍦ㄧ數愰偖浠堕浠剁殑澶悊涓紝Base64藉彂鎸ョ潃涓嶅彲鏇夸的勪綔鐢ㄣ�傜劧鑰岋紝堝�鍙戣�Base64的勭悊瑙ｄ粎鍋滅鍦ㄨ〃闈紝瑰叾ヤ綔鍘熺悊鍜屾渶浣冲疄璺电煡涔敋灏?/p> <p>鏈枃灏嗗甫浣犳繁鍏ヤ簡瑙ase64的勫伐浣滃師鐞嗐�佺佽В鐮佽繃绋�佸父瑙佸簲ㄥ満鏅紝浠ュ強濡備綍樻晥浣跨敤Base64缂栬В佸伐鍏枫�傞�氳繃鏈枃的勫涔狅紝浣犲皢鍏ㄩ潰鎺屾彙Base64鎶�鏈紝鍦ㄥ疄闄呭紑鍙戜腑鏇村姞績搴墜锟?/p> <h2>涓�銆丅ase64的勫鏈锟?/h2> <h3>1. 浠�涔堟槸Base64锟�?/h3> <p>Base64鏄竴绉嶅熀锟�?4涓彲鎵撳嵃瀛鏉ヨ〃绀轰簩杩涘埗鏁版嵁的勭佹柟忋�傚畠灏嗕簩杩涘埗鏁版嵁杞崲涓篈SCII瀛涓叉牸忥紝浠ヤ究鍦ㄤ笉寔浜岃繘鍒舵暟鎹紶杈撶殑鍦烘櫙涓娇鐢?/p> <p>Base64缂栫爜的牳蹇冩�濇兂鏄</p> <ul> <li>锟�?涓瓧鑺傦紙24浣嶏級的簩杩涘埗鏁版嵁鍒掑垎锟�?锟�?浣嶇殑锟?/li> <li>姣忎6浣嶇粍瑰簲涓�涓狟ase64瀛</li> <li>濡傛灉鏈�鍚庝缁笉锟?涓瓧鑺傦紝鍒欑=濉</li> </ul> <h3>2. Base64瀛锟�?/h3> <p>Base64浣跨敤浠ヤ笅64涓瓧绗︼細</p> <div class="code-block"> ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/ </div> <p>姝ゅ锛屽綋鏁版嵁闀害涓嶆槸3的勫�嶆暟鏃讹紝浣跨=浣滀负濉厖瀛锟�?/p> <h2>浜屻�丅ase64缂栫爜鍘熺悊</h2> <h3>1. 缂栫爜杩囩▼璇﹁В</h3> <p>Base64缂栫爜的叿浣撴楠ゅ涓嬶細</p> <ol> <li><strong>鍒嗙粍锟?/strong>灏嗚鍏ョ殑浜岃繘鍒舵暟鎹瘡3涓瓧鑺傦紙24浣嶏級鍒嗕负涓�锟�?/li> <li><strong>鎷嗗垎锟?/strong>灏嗘瘡锟?4浣嶆媶鍒嗕负4锟�?浣嶇殑愮</li> <li><strong>鏄犲皠锟?/strong>灏嗘瘡锟?浣嶅瓙缁浆鎹负瑰簲的凚ase64瀛</li> <li><strong>濉厖锟?/strong>濡傛灉鏈�鍚庝缁笉锟?涓瓧鑺傦紝锟�?濉厖锛屽苟鍦ㄨ鍑烘椂娣诲=浣滀负鏍</li> </ol> <h4>缂栫爜绀轰緥锛氱佸瓧绗︿ "Man"</h4> <p>姝ラ1锛氬 "Man" 杞崲涓篈SCII锟�?/p> <div class="code-block"> M: 77 (01001101) A: 65 (01000001) N: 78 (01001110) </div> <p>姝ラ2锛氬悎骞朵簩杩涘埗锟?/p> <div class="code-block"> 01001101 01000001 01001110 </div> <p>姝ラ3锛氭媶鍒嗕负4锟�?浣嶇</p> <div class="code-block"> 010011 010100 000101 001110 </div> <p>姝ラ4锛氳浆鎹负Base64瀛</p> <div class="code-block"> 010011 = 19 锟�?T 010100 = 20 锟�?U 000101 = 5 锟�?F 001110 = 14 锟�?O </div> <p>鏈�缁堢粨鏋滐細"Man" 锟�?"TUFN"</p> <h3>2. 濉厖鏈哄埗</h3> <p>褰撹鍏ユ暟鎹暱搴︿笉锟�?的勫�嶆暟鏃讹紝Base64浣跨敤濉厖鏈哄埗锟?/p> <ul> <li>濡傛灉鍓1涓瓧鑺傦紙8浣嶏級锛屽垯濉2锟�?瀛妭锛岃锟�?涓狟ase64瀛锛屾渶锟?涓瓧绗︾敤==濉</li> <li>濡傛灉鍓2涓瓧鑺傦紙16浣嶏級锛屽垯濉1锟�?瀛妭锛岃锟�?涓狟ase64瀛锛屾渶锟?涓瓧绗︾敤=濉</li> </ul> <h4>濉厖绀轰緥锛氱佸瓧绗︿ "Ma"</h4> <p>姝ラ1锛氬 "Ma" 杞崲涓篈SCII锟�?/p> <div class="code-block"> M: 77 (01001101) A: 65 (01000001) </div> <p>姝ラ2锛氬悎骞朵簩杩涘埗浣嶅苟濉</p> <div class="code-block"> 01001101 01000001 00000000 </div> <p>姝ラ3锛氭媶鍒嗕负4锟�?浣嶇</p> <div class="code-block"> 010011 010100 000100 000000 </div> <p>姝ラ4锛氳浆鎹负Base64瀛</p> <div class="code-block"> 010011 = 19 锟�?T 010100 = 20 锟�?U 000100 = 4 锟�?E 000000 = 0 锟�?A </div> <p>姝ラ5锛氭坊鍔犲～锟�?/p> <div class="code-block"> TUEA 锟�?TUE= </div> <h2>涓�丅ase64瑙ｇ爜鍘熺悊</h2> <h3>1. 瑙ｇ爜杩囩▼璇﹁В</h3> <p>Base64瑙ｇ爜鏄紪佺殑嗚繃绋細</p> <ol> <li><strong>鍘櫎濉厖锟?/strong>绉櫎鏈锟�?濉厖</li> <li><strong>鏄犲皠锟?/strong>灏嗘瘡涓狟ase64瀛杞崲涓哄搴旂6浣嶄簩杩涘埗锟�?/li> <li><strong>鍚堝苟锟?/strong>锟�?锟�?浣嶇粍鍚堝苟锟�?锟�?浣嶇</li> <li><strong>绉櫎濉厖浣嶏細</strong>濡傛灉鏈夊～鍏咃紝绉婚櫎鏈的勫～鍏</li> </ol> <h4>瑙ｇ爜绀轰緥锛氳В锟�?"TUFN"</h4> <p>姝ラ1锛氬Base64瀛杞崲锟?浣嶄簩杩涘埗</p> <div class="code-block"> T: 19 锟�?010011 U: 20 锟�?010100 F: 5 锟�?000101 N: 14 锟�?001110 </div> <p>姝ラ2锛氬悎骞朵负24浣嶄簩杩涘埗</p> <div class="code-block"> 010011010100000101001110 </div> <p>姝ラ3锛氭媶鍒嗕负3锟�?浣嶇</p> <div class="code-block"> 01001101 01000001 01001110 </div> <p>姝ラ4锛氳浆鎹负ASCII瀛</p> <div class="code-block"> 01001101 = 77 锟�?M 01000001 = 65 锟�?A 01001110 = 78 锟�?N </div> <p>鏈�缁堢粨鏋滐細"TUFN" 锟�?"Man"</p> <h2>鍥涖�丅ase64的勫簲鐢ㄥ満锟�?/h2> <h3>1. 鍓嶇�鍙戜腑的勫簲锟?/h3> <h4>鍥剧墖宓屽叆</h4> <p>灏嗗浘鐗浆鎹负Base64缂栫爜锛屽彲浠ョ洿鎺ュ祵鍏ュ埌HTML鎴朇SS涓紝鍑忓皯HTTP璇锋眰锟?/p> <div class="code-block">  <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNkYPhfDwAChwGA60e6kgAAAABJRU5ErkJggg==" alt="Small red dot" />  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNkYPhfDwAChwGA60e6kgAAAABJRU5ErkJggg=='); </div> <h4>瀛椾綋鍥</h4> <p>灏嗗瓧浣撴枃浠惰浆鎹负Base64缂栫爜锛屽祵鍏ュ埌CSS涓</p> <div class="code-block"> @font-face { font-family: 'MyFont'; src: url('data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAA...') format('woff'); font-weight: normal; font-style: normal; } </div> <h3>2. 鍚庣�鍙戜腑的勫簲锟?/h3> <h4>API鏁版嵁浼犺緭</h4> <p>鍦ˋPI涓紶杈撲簩杩涘埗鏁版嵁锛屽鍥剧銆佹枃浠剁瓑锟?/p> <div class="code-block"> // 鍓嶇鍙戦�丅ase64缂栫爜的浘锟? const imageFile = document.querySelector('input[type="file"]').files[0]; const reader = new FileReader(); reader.onloadend = function() { const base64Image = reader.result; fetch('/api/upload', { method: 'POST', body: JSON.stringify({ image: base64Image }), headers: { 'Content-Type': 'application/json' } }); }; reader.readAsDataURL(imageFile); // 鍚庣鎺ユ敹骞跺锟�? app.post('/api/upload', (req, res) => { const base64Image = req.body.image.split(';base64,').pop(); const buffer = Buffer.from(base64Image, 'base64'); // 澶勭悊鍥剧... res.send('Image uploaded'); }); </div> <h4>鏁版嵁搴撳瓨锟�?/h4> <p>灏嗗鏂囦欢樺偍涓築ase64缂栫爜的瓧绗︿锟?/p> <div class="code-block"> -- 鍒涘缓锟? CREATE TABLE user_avatars ( id INT PRIMARY KEY AUTO_INCREMENT, user_id INT, avatar_base64 TEXT, created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ); -- 鎻掑叆鏁版嵁 INSERT INTO user_avatars (user_id, avatar_base64) VALUES (1, 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNkYPhfDwAChwGA60e6kgAAAABJRU5ErkJggg=='); </div> <h3>3. 鍏朵搴旂敤鍦烘櫙</h3> <ul> <li><strong>鐢靛瓙閭闄欢锟?/strong>鍦∕IME鍗忚涓紝闄勪欢閫父浣跨敤Base64缂栫</li> <li><strong>XML鍜孞SON锟�?/strong>鍦ㄤ笉鏀寔浜岃繘鍒舵暟鎹殑鏍煎紡涓紶杈撲簩杩涘埗鏁版嵁</li> <li><strong>Cookie鍜RL锟�?/strong>瀛樺偍浜岃繘鍒舵暟鎹紝浣嗛渶瑕佹敞鎰廢RL瀹叏的凚ase64鍙樹</li> <li><strong>璇佷功鍜屽瘑閽ワ</strong>鍦≒EM鏍煎紡涓紝璇佷功鍜屽瘑閽ラ�氬父浣跨敤Base64缂栫</li> </ul> <h2>浜斻�丅ase64的勫彉锟?/h2> <h3>1. Base64URL</h3> <p>涓轰簡鍦║RL涓畨鍏ㄤ娇鐢˙ase64锛孊ase64URL瀵爣鍑咮ase64杩涜浜嗕慨癸細</p> <ul> <li>锟�?鏇挎崲锟?</li> <li>锟�?鏇挎崲涓</li> <li>绉櫎=濉厖</li> </ul> <h4>Base64URL轰緥锟�?/h4> <div class="code-block"> 标准噯Base64: TUFN Base64URL: TUFN 标准噯Base64: TUE= Base64URL: TUE 标准噯Base64: TU0= Base64URL: TU0 </div> <h3>2. Base32鍜孊ase16</h3> <ul> <li><strong>Base32锟�?/strong>浣跨32涓瓧绗︼紝鏇撮�傚悎浜虹闃呰锛屽父ㄤ簬涓�娆℃�у瘑侊紙OTP锟�?/li> <li><strong>Base16锟�?/strong>浣跨16涓瓧绗︼紙0-9, A-F锛紝瀹為涓婂氨鏄崄鍏繘鍒剁紪锟�?/li> </ul> <h2>鍏�丅ase64缂栬В佸伐鍏殑浣跨</h2> <h3>1. 在线ュ</h3> <p>浣跨敤在线Base64缂栬В佸伐鍏峰彲浠ュ揩熻繘琛岀佸拰瑙ｇ爜鎿嶄綔锟�?/p> <p style="font-size: 18px;"><strong>🦘憠绔嵆浣跨敤锟�?/strong><a href="../tools/base64.html" style="font-weight: bold;">Base64 缂栬В锟�?/a></p> <h3>2. 缂栫▼璇█涓殑Base64</h3> <h4>JavaScript</h4> <div class="code-block"> // 缂栫 const text = 'Hello, World!'; const encoded = btoa(text); console.log(encoded); // "SGVsbG8sIFdvcmxkIQ==" // 瑙ｇ const decoded = atob(encoded); console.log(decoded); // "Hello, World!" // Base64URL缂栫 function base64urlEncode(str) { return btoa(str) .replace(/\+/g, '-') .replace(/\//g, '_') .replace(/=+$/, ''); } // Base64URL瑙ｇ function base64urlDecode(str) { str = str.replace(/-/g, '+').replace(/_/g, '/'); while (str.length % 4) { str += '='; } return atob(str); } </div> <h4>Python</h4> <div class="code-block"> import base64 # 缂栫 text = 'Hello, World!' encoded = base64.b64encode(text.encode('utf-8')).decode('utf-8') print(encoded) # "SGVsbG8sIFdvcmxkIQ==" # 瑙ｇ decoded = base64.b64decode(encoded).decode('utf-8') print(decoded) # "Hello, World!" # Base64URL缂栫 import base64 import urllib.parse def base64url_encode(data): return base64.urlsafe_b64encode(data).rstrip(b'=').decode('utf-8') def base64url_decode(data): padding = '=' * (4 - (len(data) % 4)) return base64.urlsafe_b64decode(data + padding) </div> <h4>Java</h4> <div class="code-block"> import java.util.Base64; // 缂栫 String text = "Hello, World!"; String encoded = Base64.getEncoder().encodeToString(text.getBytes()); System.out.println(encoded); // "SGVsbG8sIFdvcmxkIQ==" // 瑙ｇ byte[] decodedBytes = Base64.getDecoder().decode(encoded); String decoded = new String(decodedBytes); System.out.println(decoded); // "Hello, World!" // Base64URL缂栫 String base64UrlEncoded = Base64.getUrlEncoder().encodeToString(text.getBytes()); System.out.println(base64UrlEncoded); // "SGVsbG8sIFdvcmxkIQ" </div> <h3>3. 鍛戒护琛屽伐锟�?/h3> <h4>Linux/macOS</h4> <div class="code-block"> # 缂栫 echo -n "Hello, World!" | base64 # 杈撳: SGVsbG8sIFdvcmxkIQ== # 瑙ｇ echo "SGVsbG8sIFdvcmxkIQ==" | base64 -d # 杈撳: Hello, World! </div> <h4>Windows (PowerShell)</h4> <div class="code-block"> # 缂栫 [Convert]::ToBase64String([System.Text.Encoding]::UTF8.GetBytes("Hello, World!")) # 杈撳: SGVsbG8sIFdvcmxkIQ== # 瑙ｇ [System.Text.Encoding]::UTF8.GetString([Convert]::FromBase64String("SGVsbG8sIFdvcmxkIQ==")) # 杈撳: Hello, World! </div> <h2>涓冦�丅ase64的勪缂虹</h2> <h3>1. 浼偣</h3> <ul> <li><strong>氱敤э</strong>鍑犱鎵�鏈紪绋瑷�閮藉師鐢熸鎸丅ase64</li> <li><strong>瀹叏э</strong>灏嗕簩杩涘埗鏁版嵁杞崲涓哄彲鎵撳嵃瀛锛岄伩鍏嶄紶杈撻敊锟?/li> <li><strong>渚挎嵎鎬э</strong>鍙互鐩存帴宓屽叆鍒版枃鏈牸忎腑</li> <li><strong>标准鍖栵</strong>鏈纭殑RFC标准锛圧FC 4648锟�?/li> </ul> <h3>2. 缂虹</h3> <ul> <li><strong>鏁版嵁鑶ㄨ儉锟�?/strong>Base64缂栫爜鍚庣殑鏁版嵁澶у浼氬鍔犵33%</li> <li><strong>ц兘�閿�锟?/strong>缂栫爜鍜岃В鐮佽繃绋渶瑕澶殑璁＄畻</li> <li><strong>涓嶉�傚悎澶ф枃浠讹細</strong>瀵簬澶ф枃浠紝Base64浼氬鑷村唴瀛樺崰鐢ㄨ繃锟�?/li> <li><strong>涓嶆槸鍔犲瘑锟�?/strong>Base64鏄侊紝涓嶆槸鍔犲瘑锛屼笉鑳界敤浜庢暟鎹繚锟�?/li> </ul> <h2>鍏�丅ase64浣跨敤鏈�浣冲疄锟�?/h2> <h3>1. 浣曟椂浣跨敤Base64</h3> <ul> <li>浼犺灏忓昂哥殑浜岃繘鍒舵暟锟?/li> <li>宓屽叆鍥剧銆佸瓧浣撶瓑璧鍒癏TML/CSS</li> <li>鍦ㄤ笉鏀寔浜岃繘鍒舵暟鎹殑鍗忚涓紶杈撴暟锟�?/li> <li>瀛樺偍灏忔枃浠跺埌鏁版嵁锟�?/li> </ul> <h3>2. 浣曟椂涓嶄娇鐢˙ase64</h3> <ul> <li>澶ф枃浠朵紶杈擄紙浣跨敤鏂囦涓婁紶锟�?/li> <li>鏁版嵁鍔犲瘑锛堜娇鐢ㄧ湡姝ｇ殑鍔犲瘑绠硶锟�?/li> <li>ц兘鏁忔劅的勫锟�?/li> <li>闇�瑕佸帇缂╃殑鏁版</li> </ul> <h3>3. ц兘浼樺</h3> <ul> <li><strong>鎵归噺澶悊锟?/strong>瀵簬澶ч噺鏁版嵁锛屼娇ㄦ閲忕紪锟�?瑙ｇ</li> <li><strong>娴佸紡澶悊锟?/strong>瀵簬澶ф枃浠紝浣跨敤娴佸紡缂栫/瑙ｇ</li> <li><strong>缂撳瓨锟?/strong>缂撳瓨缂爜缁撴灉锛岄伩鍏嶉噸澶嶇锟�?/li> <li><strong>夋鍚堥�傜殑搴擄</strong>浣跨敤樻�ц兘的凚ase64锟�?/li> </ul> <h2>涔濄�佸父瑙棶棰樹笌瑙ｅ喅鏂规</h2> <h3>1. Base64缂栫爜鍚庢暟鎹彉澶ф�庝箞鍔烇紵</h3> <p>杩欐槸ｅ父鐜拌薄锛孊ase64缂栫爜浼鍔犵33%的勬暟鎹ぇ灏忋�傚浜庡ぇ鏂囦锛岃�檻浣跨敤鏂囦欢涓婁紶鑰屼笉鏄疊ase64缂栫爜锟?/p> <h3>2. Base64缂栫爜的浘鐗囧杞芥參庝箞鍔烇</h3> <p>瀵簬杈冨ぇ的浘鐗囷紝寤鸿浣跨敤鍗曠的勫浘鐗囨枃浠紝鑰屼笉鏄疊ase64缂栫爜銆傚彧鏈皬鍥炬爣鍜屽皬鍥剧墖閫傚悎浣跨Base64缂栫爜宓屽叆锟�?/p> <h3>3. 濡備綍澶悊Base64URL缂栫爜锟?/h3> <p>浣跨敤涓撻棬的凚ase64URL缂栫/瑙ｇ爜鍑芥暟锛屾垨鎵姩鏇挎崲瀛骞跺鐞嗗～鍏咃?/p> <h3>4. Base64缂栫爜的畨鍏ㄦ�у浣</h3> <p>Base64鏄侊紝涓嶆槸鍔犲瘑銆備笉瑕佷娇鐢˙ase64鏉ヤ繚鎶ゆ晱鎰熸暟鎹紝搴旇浣跨敤熸的勫姞嗙畻娉?/p> <h3>5. 濡備綍岃瘉Base64缂栫爜的湁鏁堟�э</h3> <p>鍙互浣跨敤姝ｅ琛ㄨ忛獙璇丅ase64鏍煎紡锛屾垨灏濊瑙ｇ爜骞舵鏌ユ槸鍚︽垚鍔燂?/p> <h2>鍗併�佺粨锟?/h2> <p>Base64缂栬В佹槸涓�椤瑰�浣嗗己澶х殑鎶�鏈紝鍦ㄧ幇浠ｈ蒋浠跺紑鍙戜腑鏈夌潃骞挎硾的簲鐢ㄣ�傞�氳繃鏈枃的涔狅紝浣犲簲璇ュ凡缁忔帉鎻′簡Base64的勫伐浣滃師鐞嗐�佺佽В鐮佽繃绋�佸父瑙佸簲ㄥ満鏅互鍙婃渶浣冲疄璺碉拷?/p> <p>鍦ㄥ疄闄紑鍙戜腑锛屽悎鐞嗕娇鐢˙ase64鍙互瑙ｅ喅寰堝鏁版嵁浼犺鍜屽瓨鍌ㄧ殑闂锛屼絾涔熻娉ㄦ剰鍏跺闄愭�э紝厤鍦ㄤ笉傚悎的勫鏅腑浣跨敤锟�?/p> <p>屾湜鏈枃鑳藉姪浣犳洿濂藉湴鐞嗚В鍜屽簲鐢˙ase64鎶�鏈紝鍦ㄥ紑鍙戜腑鏇村績搴墜銆傚鏋滀綘闇�瑕佸揩熻繘琛孊ase64缂栬В佹搷浣滐紝鍙互浣跨敤鎴戜滑的勫绾垮伐鍏凤紝瀹冪畝鍗曟鐢紝寔鎵归噺澶悊鍜屽悇绉岯ase64鍙樹綋锟?/p> <p style="font-size: 18px;"><strong>🦘憠绔嵆浣跨敤锟�?/strong><a href="../tools/base64.html" style="font-weight: bold;">Base64 缂栬В锟�?/a></p>  <div class="recommendations-section" id="recommendations">  <h2 class="section-title">鐩叧宸ュ叿鎺ㄨ崘</h2> <div class="tools-grid">  <a href="../tools/base64.html" class="tool-card-mini"> <div class="tool-card-mini-header"> <span class="tool-name" style="color: #2563eb;">Base64 缂栬В锟�?/span> </div> <p class="tool-desc">UTF-8鏂囨湰Base64杞</p> </a>  <a href="../tools/url-encode.html" class="tool-card-mini"> <div class="tool-card-mini-header"> <span class="tool-name">URL缂栬В锟�?/span> </div> <p class="tool-desc">URL鐗畩瀛缂栫爜杞崲</p> </a>  <a href="../tools/json.html" class="tool-card-mini"> <div class="tool-card-mini-header"> <span class="tool-name">JSON鏍煎紡锟?/span> </div> <p class="tool-desc">JSON鏍￠獙鏍煎紡鍖栧帇锟?/p> </a>  <a href="../tools/md5.html" class="tool-card-mini"> <div class="tool-card-mini-header"> <span class="tool-name">MD5鍔犲</span> </div> <p class="tool-desc">璁＄畻涓睲D5鍝堝笇锟?/p> </a>  <a href="../tools/uuid-generator.html" class="tool-card-mini"> <div class="tool-card-mini-header"> <span class="tool-name">UUID鐢熸垚锟?/span> </div> <p class="tool-desc">鎵归噺鐢熸垚鍞竴鏍瘑锟?/p> </a>  <a href="../tools/timestamp.html" class="tool-card-mini"> <div class="tool-card-mini-header"> <span class="tool-name">鏃堕棿鎴宠浆锟�?/span> </div> <p class="tool-desc">Unix鏃堕棿鎴棩鏈熶簰锟�?/p> </a>  <a href="../tools/length-converter.html" class="tool-card-mini"> <div class="tool-card-mini-header"> <span class="tool-name">害鍗曚綅鎹㈢畻锟?/span> </div> <p class="tool-desc">鍘背宠叕閲屾崲锟?/p> </a>  <a href="../tools/coordinate-converter.html" class="tool-card-mini"> <div class="tool-card-mini-header"> <span class="tool-name">鍦扮悊鍧爣绯昏浆锟�?/span> </div> <p class="tool-desc">WGS84 GCJ02 BD09浜掕</p> </a> </div> <a href="../tools.html" class="more-link" style="color: #2563eb;">鏇村ュ锟�?/a>  <h2 class="section-title" style="margin-top: 28px;">鐩叧鏂囨。鎺ㄨ崘</h2> <div class="docs-list">  <a href="json-formatting-guide.html" class="doc-card"> <span class="doc-icon"> <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"> <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/> <polyline points="14 2 14 8 20 8"/> <line x1="16" y1="13" x2="8" y2="13"/> <line x1="16" y1="17" x2="8" y2="17"/> <polyline points="10 9 9 9 8 9"/> </svg> </span> <div class="doc-info"> <span class="doc-title" style="color: #2563eb;">�鍙戣�澶囷細JSON鏍煎紡鍖栧畬鍏ㄦ寚鍗椻�斺�斾粠娣蜂贡鍒版鏅殑鐬棿杞</span> <p class="doc-desc">璇︾粏浠粛JSON鏍煎紡鍖殑閲嶈с�佸父瑙棶棰樸�佸伐鍏蜂娇鐢ㄦ妧宸с�佽皟璇曠粡岋紝甯姪�鍙戣�粠娣蜂贡的凧SON鏁版嵁涓揩熺悊鍑哄ご缁拷?/p> </div> </a>  <a href="timestamp-converter-guide.html" class="doc-card"> <span class="doc-icon"> <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"> <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/> <polyline points="14 2 14 8 20 8"/> <line x1="16" y1="13" x2="8" y2="13"/> <line x1="16" y1="17" x2="8" y2="17"/> <polyline points="10 9 9 9 8 9"/> </svg> </span> <div class="doc-info"> <span class="doc-title" style="color: #2563eb;">鏃堕棿鎴宠浆鎹㈠鍏ㄦ寚鍗楋細浠嶶nix鏃堕棿鎴冲埌浜虹鍙鏃ユ湡</span> <p class="doc-desc">鍏ㄩ潰瑙ｆUnix鏃堕棿鎴崇殑姒傚康銆佺敤斻�佽浆鎹㈡柟娉紝甯姪�鍙戣�拰鏅�氱敤鎴峰揩熺悊瑙ｅ拰浣跨敤鏃堕棿鎴宠浆鎹㈠姛鑳斤拷?/p> </div> </a>  <a href="url-guide.html" class="doc-card"> <span class="doc-icon"> <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"> <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/> <polyline points="14 2 14 8 20 8"/> <line x1="16" y1="13" x2="8" y2="13"/> <line x1="16" y1="17" x2="8" y2="17"/> <polyline points="10 9 9 9 8 9"/> </svg> </span> <div class="doc-info"> <span class="doc-title" style="color: #2563eb;">URL缂栫爜瑙ｇ爜瀹屽叏鎸囧崡锛氫负浠�涔圲RL闇�瑕佺侊紵</span> <p class="doc-desc">璇︾粏浠粛URL缂栫爜的鐞嗐�佸簲鐢ㄥ満鏅�佸父瑙棶棰樺拰瑙ｅ喅鏂规锛屽府鍔╁紑鍙戣�呮纭鐞哢RL缂栫爜闂锟?/p> </div> </a>  <a href="ip-privacy-guide.html" class="doc-card"> <span class="doc-icon"> <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"> <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/> <polyline points="14 2 14 8 20 8"/> <line x1="16" y1="13" x2="8" y2="13"/> <line x1="16" y1="17" x2="8" y2="17"/> <polyline points="10 9 9 9 8 9"/> </svg> </span> <div class="doc-info"> <span class="doc-title" style="color: #2563eb;">涓轰粈涔堜綘锟�?IP 浼氭毚闇綅缃紵鍏綉IP涓庡綊灞炲湴鏌ヨ屾暣鎸囧崡</span> <p class="doc-desc">免费在线 IP 鍦板潃鏌鎸囧崡锛屽府浣犱簡瑙ｅ叕缃慖P銆佸綊灞炲湴銆佽繍钀ュ晢淇℃伅鑳芥煡鍒粈涔堬紝閫傚悎缃戠粶鎺掓煡銆佽澶瘑鍒拰鍩虹闅璁ょ煡锟�?/p> </div> </a>  <a href="coordinate-converter-guide.html" class="doc-card"> <span class="doc-icon"> <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"> <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/> <polyline points="14 2 14 8 20 8"/> <line x1="16" y1="13" x2="8" y2="13"/> <line x1="16" y1="17" x2="8" y2="17"/> <polyline points="10 9 9 9 8 9"/> </svg> </span> <div class="doc-info"> <span class="doc-title" style="color: #2563eb;">WGS84銆丟CJ02銆丅D09鍧愭爣绯诲埌搴曟湁浠�涔堝尯鍒紵涓�鏂囨悶鎳傚湴鍥惧潗鏍囪浆鎹</span> <p class="doc-desc">娣卞叆鍓栨WGS84銆丟CJ02銆丅D09涓鍧愭爣绯荤殑鍖哄埆锛屽府鍔╁紑鍙戣�悊瑙ｅ湴鍥惧潗鏍浆鎹㈢殑鍘熺悊鍜屽疄璺垫柟娉?/p> </div> </a> </div> <a href="../articles/index.html" class="more-link" style="color: #2563eb;">鏌ョ湅鍏ㄩ儴鏂囨锟�?/a>  <a href="../index.html" class="more-link" style="color: #2563eb; margin-top: 8px;">锟�?杩斿洖棣</a> </div> <div class="footer"> <a href="../index.html" class="back-link">杩斿洖棣</a> </div> </div> </div> </body> </html>