「労働者が自分の仕事をうまくやりたいなら、まず自分の道具を研ぎ澄まさなければなりません。」 - 孔子、「論語。陸霊公」
表紙 > プログラミング > UTF-8 エンコーディングを処理しながら JavaScript で Base64 文字列をデコードするにはどうすればよいですか?

UTF-8 エンコーディングを処理しながら JavaScript で Base64 文字列をデコードするにはどうすればよいですか?

2024 年 11 月 9 日に公開
ブラウズ:518

How to Decode Base64 Strings in JavaScript While Handling UTF-8 Encoding?

JavaScript atob 関数を使用した Base64 のデコード: UTF-8 の処理

JavaScript の atob() 関数は、base64 でエンコードされた文字列をデコードするように設計されています。ユーザーは、UTF-8 でエンコードされた文字列をデコードするときに問題が発生し、適切な UTF-8 表現ではなく ASCII でエンコードされた文字が生成される場合があります。

課題: Unicode の問題を理解する

Base64 は入力としてバイナリ データを必要とします、JavaScript は 1 バイトを占める文字を含む文字列をバイナリ データとみなします。ただし、UTF-8 でエンコードされた文字列で複数のバイトを占める文字は、エンコード中に例外をトリガーします。

解決策 1: バイナリの相互運用性

推奨される修正は、バイナリ文字列にエンコードしてデコードすることです。

UTF-8 をバイナリにエンコード

function toBinary(string) {
  const codeUnits = new Uint16Array(string.length);
  for (let i = 0; i 

バイナリを UTF-8 にデコードする

function fromBinary(encoded) {
  const binary = atob(encoded);
  const bytes = new Uint8Array(binary.length);
  for (let i = 0; i 

このソリューションは、JavaScript のネイティブ表現である UTF-16 エンコーディングを維持しながら、元の UTF-8 文字列をバイナリ表現に変換します。

解決策 2: ASCII Base64 の相互運用性

UTF-8 の相互運用性に焦点を当てた代替ソリューションは、平文の Base64 文字列を維持することです。

Encoding UTF-8 to Base64

function b64EncodeUnicode(str) {    
  return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g,
    function toSolidBytes(match, p1) {
      return String.fromCharCode('0x'   p1);
  }));
}

Base64 を UTF-8 にデコードする

function b64DecodeUnicode(str) {
  return decodeURIComponent(atob(str).split('').map(function(c) {
    return '%'   ('00'   c.charCodeAt(0).toString(16)).slice(-2);
  }).join(''));
}

このソリューションは、表現を変更せずに UTF-8 でエンコードされた文字列を効率的に処理します。

TypeScript サポート

// Encoding UTF-8 ⇢ base64

function b64EncodeUnicode(str) {
    return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function(match, p1) {
        return String.fromCharCode(parseInt(p1, 16))
    }))
}

// Decoding base64 ⇢ UTF-8

function b64DecodeUnicode(str) {
    return decodeURIComponent(Array.prototype.map.call(atob(str), function(c) {
        return '%'   ('00'   c.charCodeAt(0).toString(16)).slice(-2)
    }).join(''))
}

過去の解決策 (非推奨)

function utf8_to_b64( str ) {
  return window.btoa(unescape(encodeURIComponent( str )));
}

function b64_to_utf8( str ) {
  return decodeURIComponent(escape(window.atob( str )));
}

このアプローチはまだ機能しますが、最新のブラウザでは非推奨になりました。

最新のチュートリアル もっと>

免責事項: 提供されるすべてのリソースの一部はインターネットからのものです。お客様の著作権またはその他の権利および利益の侵害がある場合は、詳細な理由を説明し、著作権または権利および利益の証拠を提出して、電子メール [email protected] に送信してください。 できるだけ早く対応させていただきます。

Copyright© 2022 湘ICP备2022001581号-3