code javascript base64 tronqué

Récemment, de nombreux sites Web ont rencontré des problèmes de code tronqué lors de l'utilisation de Javascript pour encoder des images et du texte en Base64. Cette situation est généralement causée par des erreurs dans la méthode ou le processus de codage. Afin de résoudre ces problèmes, nous devons avoir une compréhension approfondie du codage Base64 en Javascript et comment l'utiliser correctement.

Qu'est-ce que Base64 ?

Base64 est une méthode de codage de données binaires en caractères ASCII. Il convertit 3 octets de 8 bits en 4 octets de 6 bits et complète le résultat dans une chaîne ASCII en utilisant l'un des 64 caractères du jeu de caractères spécifié. Lors de la transmission de données, Base64 est généralement utilisé pour convertir les données binaires en caractères ASCII afin qu'elles ne soient pas traitées incorrectement lors de la transmission. Il est fréquemment utilisé pour le courrier électronique et le transfert de données.

Utilisez l'implémentation de Base64 en Javascript

Il existe déjà une implémentation de Base64 en Javascript, il n'est donc pas nécessaire d'écrire l'algorithme vous-même. Nous pouvons utiliser la méthode window.btoa() pour encoder en Base64 la chaîne et la méthode window.atob() pour la décoder de manière inversée. Ces méthodes fonctionnent uniquement avec les caractères ASCII et ne sont pas prises en charge dans les navigateurs inférieurs à IE9.

Par exemple :

var str = "Hello World";
var encodedString = window.btoa(str); // 编码
var decodedString = window.atob(encodedString); // 解码
console.log(encodedString); // SGVsbG8gV29ybGQ=
console.log(decodedString); // Hello World

Lors de l'encodage d'images ou d'autres données binaires, nous devons les transmettre sous forme de vues de données binaires à la méthode window.btoa(), par exemple :

var byteArray = new Uint8Array([73, 69, 78, 68, 255, 216, 255]);
var encodedString = window.btoa(String.fromCharCode.apply(null, byteArray)); // 编码
console.log(encodedString); // SU5ET1+J/g==

Ici, nous utilisons String.fromCharCode.apply(null , byteArray) convertit la vue de données binaires en une chaîne normale, puis l'encode.

Comment résoudre le problème de l'encodage en Base64 des caractères tronqués

L'encodage en Base64 des caractères tronqués est généralement dû aux raisons suivantes :

1. Pour les caractères non-ASCII, la méthode window.btoa() provoquera des erreurs d'encodage. De plus, certains caractères tels que les caractères +, /, = peuvent provoquer des erreurs d'encodage.
2. Dans certains cas, le navigateur peut ajouter automatiquement des
   sauts de ligne après l'encodage Base64, ce qui entraînera des erreurs d'encodage.
3. Lors de l'encodage de données binaires, vous devez utiliser la bonne méthode pour les convertir en chaîne.

Les façons de résoudre ces problèmes sont les suivantes :

1. Pour résoudre les erreurs d'encodage des caractères non-ASCII : vous pouvez utiliser des bibliothèques tierces, telles que js-base64 ou CryptoJS, qui prennent en charge les données binaires codées en UTF-8. . Par exemple :

var str = "你好世界";
var encodedString = window.btoa(unescape(encodeURIComponent(str))); // 使用第三方库
console.log(encodedString); //5L2g5aW977yM5LiW55WM

Ici, unescape(encodeURIComponent(str)) est utilisé pour convertir la chaîne codée UTF-8 en chaîne ASCII, puis window.btoa() est utilisé pour l'encoder.

2. Évitez l'ajout automatique et les
   sauts de ligne : lors de l'encodage d'images ou de données binaires, vous pouvez utiliser un tampon de tableau ou un objet Blob pour transmettre des données binaires, par exemple :

var byteArray = new Uint8Array([73, 69, 78, 68, 255, 216, 255]);
var blob = new Blob([byteArray], {type: 'image/jpeg'});
var reader = new FileReader();
reader.onloadend = function() {
  console.log(reader.result);
};
reader.readAsDataURL(blob); // 编码，避免自动添加和
换行符

Ici, utilisez l'objet Blob pour transmettre des données binaires, utilisez FileReader l'objet auquel il est converti en URL de données. Les URL de données ne contiennent pas les caractères de nouvelle ligne et
.

3. Encoder correctement les données binaires : lors de la conversion d'un tableau de données binaires en chaîne, vous devez utiliser la méthode d'encodage correcte, généralement en utilisant l'API TextDecoder ou l'API TextEncoder. Par exemple :

var byteArray = new Uint8Array([73, 69, 78, 68, 255, 216, 255]);
var decoder = new TextDecoder('utf-8');
var str = decoder.decode(byteArray); // 将二进制数据数组转换为字符串
var encodedString = window.btoa(str); // 编码
console.log(encodedString);

Ici, nous utilisons l'API TextDecoder pour convertir le tableau de données binaires en chaîne codée en UTF-8, puis l'encoder à l'aide de la méthode window.btoa().

Conclusion

En Javascript, l'utilisation de Base64 pour l'encodage et le décodage est un moyen efficace, mais dans les applications réelles, vous devez faire attention aux détails de son implémentation et aux précautions pour éviter les erreurs d'encodage et les caractères tronqués. L'utilisation de méthodes d'encodage correctes et de bibliothèques tierces pour l'encodage et le décodage, ainsi que l'utilisation de tampons de tableau ou d'objets Blob lors de l'encodage de données binaires peuvent nous aider à résoudre le problème tronqué de Base64.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!