Yararlı Base64 kodu, girişin gerçekte ne olduğuna karar vermekle başlar. JavaScript dizesinin bir karakter kodlamasına ihtiyacı vardır; bir dosyanın zaten baytları var; JSON değerinin öncelikle serileştirilmesi gerekir. Bu adımları görünür tutmak hata ayıklamayı kolaylaştırır ve yanlışlıkla çift kodlamayı önler.
Küçük bir JSON değerini kodlayın
Değeri tam olarak bir kez serileştirin, bu dizeyi UTF-8 olarak kodlayın, ardından baytları Base64 olarak kodlayın. Bu örnek, yalnızca İngilizce ile çalışan uygulamaları yakalamak için ASCII olmayan bir alan içerir. Küçük yükler için tasarlanmıştır; geçici bayt dizesi bellek kullanımını artırır.
const value = { message: '你好', count: 3 };
const text = JSON.stringify(value);
let binary = '';
for (const byte of new TextEncoder().encode(text)) {
binary += String.fromCharCode(byte);
}
const encoded = btoa(binary);
const bytes = Uint8Array.from(atob(encoded), c => c.charCodeAt(0));
const json = new TextDecoder('utf-8', { fatal: true }).decode(bytes);
console.log(JSON.parse(json).message); // 你好Başarılı bir Base64 kod çözme, geçerli JSON garanti etmez. UTF-8 kod çözme işlemini gerçekleştirin ve JSON.parse ayrı başarısızlık noktaları olarak. Kodu çözülmüş içerik zaten JSON içeren bir dize olduğunda, onu yeniden serileştirmek tırnak işaretleri ve kaçış işaretleri ekler; bu yükü değiştirir.
Seçilen bir dosyayı bayt olarak oku
Bir tarayıcı için File, kullan arrayBuffer() temel baytlara ihtiyacınız olduğunda. kullanmayın file.text() bir resim, arşiv veya şifrelenmiş dosya için: geçersiz karakter dizileri yedek karakterler haline gelebilir. Hedefiniz için bir Veri URI gerekiyorsa, FileReader.readAsDataURL() sarmalayıcının yanı sıra Base64 verilerini de sağlar.
// file is a File selected by the user.
const bytes = new Uint8Array(await file.arrayBuffer());
console.log(bytes.byteLength); // original file size in bytes
// Pass bytes to a byte-oriented encoder, not TextEncoder.Gerçek hataları yakalayan gidiş-dönüş kontrolleri
Kodu çözülmüş baytları orijinal bayt dizisiyle karşılaştırın. Ekran görüntülerinin veya dosya adlarının karşılaştırılması, değiştirilen baytı tespit edemez. Boş girişi, 0 ile 255 arasındaki tüm bayt değerlerini, Çince metni, emojiyi ve uzunluğu bir veya iki baytı son grupta bırakan bir veri yükünü ekleyin. Bir dosya kümesi için, her dosyanın adını, boyutunu ve sonucunu bağımsız olarak koruyun; böylece bir hata, başka bir başarılı çıktının üzerine yazılamaz.
İş akışınız kasıtlı olarak bir API çağırmadığı sürece dönüşümleri yerel tutun. Kodlanmış çıktıyı içeren bir ağ isteği, temeldeki verileri yine de geri döndürülebilir biçimde gönderir. Bayt dizisi davranışı ve tarayıcı işlevinin Unicode sınırlaması için bkz. MDN: btoa().