UTF-8 인코딩을 처리하는 동안 JavaScript에서 Base64 문자열을 디코딩하는 방법은 무엇입니까?-JS 튜토리얼-php.cn

UTF-8 인코딩을 처리하는 동안 JavaScript에서 Base64 문자열을 디코딩하는 방법은 무엇입니까?

Barbara Streisand

풀어 주다： 2024-11-01 13:10:02

원래의

575명이 탐색했습니다.

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로 인코딩된 문자가 생성될 수 있습니다.

도전 과제: 유니코드 문제 이해

Base64는 이진 데이터를 입력으로 예상합니다. , JavaScript는 1바이트를 차지하는 문자가 포함된 문자열을 이진 데이터로 간주합니다. 그러나 UTF-8로 인코딩된 문자열에서 1바이트 이상을 차지하는 문자는 인코딩 중에 예외를 트리거합니다.

해결책 1: 바이너리 상호 운용성

권장되는 수정 방법은 바이너리 문자열을 인코딩하고 디코딩하는 것입니다.

UTF-8을 바이너리로 인코딩

function toBinary(string) {
  const codeUnits = new Uint16Array(string.length);
  for (let i = 0; i < codeUnits.length; i++) {
    codeUnits[i] = string.charCodeAt(i);
  }
  return btoa(String.fromCharCode(...new Uint8Array(codeUnits.buffer)));
}

로그인 후 복사

바이너리를 UTF-8로 디코딩

function fromBinary(encoded) {
  const binary = atob(encoded);
  const bytes = new Uint8Array(binary.length);
  for (let i = 0; i < bytes.length; i++) {
    bytes[i] = binary.charCodeAt(i);
  }
  return String.fromCharCode(...new Uint16Array(bytes.buffer));
}

로그인 후 복사

이 솔루션은 다음을 변환합니다. 원본 UTF-8 문자열을 이진 표현으로 변환하고 JavaScript의 기본 표현인 UTF-16 인코딩을 유지합니다.

해결책 2: ASCII Base64 상호 운용성

UTF-8 상호 운용성에 초점을 맞춘 대체 솔루션 일반 텍스트 base64 문자열을 유지하는 것입니다:

UTF-8을 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 )));
}

로그인 후 복사

이 접근 방식은 여전히 작동하지만 이제 최신 브라우저에서는 더 이상 사용되지 않습니다.

위 내용은 UTF-8 인코딩을 처리하는 동안 JavaScript에서 Base64 문자열을 디코딩하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!