Front-End-Implementierung der GBK- und GB2312-Kodierung und Dekodierung von Zeichenfolgen (Zusammenfassung)

Front-End-Implementierung der GBK- und GB2312-Kodierung und Dekodierung von Zeichenfolgen (Zusammenfassung)

Vorwort

Bei der Entwicklung eines Projekts stieß ich auf ein ziemlich kniffliges Problem. Das Produkt erfordert, dass der Suchbegriff in der Adressleiste des Browsers vom Browser abgerufen wird, um beurteilt werden zu können. Wir verwenden normalerweise das UTF-8-Kodierungsformat, aber Baidu und Google verwenden beide die GBK-Kodierung, wenn Suchbegriffe kodiert werden. Dies führt zu Dekodierungsfehlern. Also suchte ich online nach einer Lösung und fand schließlich eine Methode, die von einem Vorgesetzten geklärt wurde. Das Problem wurde durch iframe gelöst, daher möchte ich es hier für meine eigene zukünftige Verwendung zusammenfassen. Ich hoffe auch, dass es mehr Leuten helfen kann. Abschließend werde ich einen Link zum Front-End-Artikel einfügen.

1. Kodierung (unterstützt GBK und GB2312)

Um Probleme zu vermeiden, können wir die Anforderungsseite des Formulars als aktuelle Seite festlegen und die Rückruffunktion an den Anfang des Seiten-JS setzen. Auf diese Weise kann der Rückruf direkt ausgeführt und das Fenster geschlossen werden, wenn diese Seite eine übergeordnete Seite hat und __encode__iframe__callback__ definiert ist:

if (parent.__encode__iframe__callback__) { // Bestimme, ob die aktuelle Seite ein untergeordnetes Fenster ist parent.__encode__iframe__callback__(location.search.split('=')[1]);
    //Das aktuelle Unterfenster direkt schließen window.close();
}
Funktion GBKEncode(str, Zeichensatz, Rückruf) {
    //Erstellen Sie ein Formular und kodieren Sie es mit accept-charset
    var form = document.createElement('form');
    form.method = "erhalten";
    form.style.display = "keine";
    form.acceptCharset = Zeichensatz;
    wenn (Dokument.alle) {
        //Wenn es IE ist, rufen Sie die Methode document.charset auf. window.oldCharset = document.charset;
        document.charset = Zeichensatz;
    }
    var Eingabe = Dokument.createElement('Eingabe');
    Eingabetyp = "versteckt";
    Eingabename = "str";
    Eingabewert = str;
    form.appendChild(Eingabe);
    form.target = '__encode__iframe__'; //Geben Sie das Iframe des übermittelten Ziels an
    Dokument.Body.AppendChild(Formular);
    //Verstecke das Iframe, um den übermittelten String abzufangen, if (!window['__encode__iframe__']) {
        var iframe;
        iframe = Dokument.createElement('iframe');
        iframe.setAttribute('name', '__encode__iframe__');
        iframe.style.display = "keine";
        iframe.Breite = "0";
        iframe.Höhe = "0";
        iframe.scrolling = "nein";
        iframe.allowtransparency = "wahr";
        iframe.frameborder = "0";
        iframe.src = 'about:blank'; // Auf leer setzen document.body.appendChild(iframe);
    }
    //
    window.__encode__iframe__callback__ = Funktion (str) {
        Rückruf(str);
        wenn (Dokument.alle) {
            Dokument.Zeichensatz = Fenster.altesZeichensatz;
        }
    }
    //Adresse der Rückrufcodierungsseite festlegen. Hier muss der Benutzer form.action = window.location.href ändern.
    form.submit();
    setzeTimeout(Funktion () {
        form.parentNode.removeChild(formular);
        iframe.parentNode.removeChild(iframe);
    }, 1000) // Entferne den Knoten nach 0,5 Sekunden }
GBKEncode('zu kodierende Zeichen', 'gb2312', Rückruf); // Test // Versprechen-Kapselung var encode = function encode(str) {
    var charset = arguments.length > 1 und arguments[1] !== undefiniert ? arguments[1] : "gbk";
    returniere neues Promise(Funktion (auflösen, ablehnen) {
        versuchen {
            _encode(str, Zeichensatz, Funktion (Daten) {
                auflösen (Daten);
            });
        } fangen (e) {
            resolve('Fehler bei der Zeichenkodierung.', e.toString());
        }
    });
};

2. Dekodierung (unterstützt GBK, GB2312, Base64)

Funktion randomId() {
    var text = "";
    var möglich = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

    für (var i = 0; i < 5; i++) {
        text += möglich.charAt(Math.floor(Math.random() * möglich.length));
    }Text zurückgeben;
}

Funktion _decode(str, Zeichensatz, Rückruf) {
    var Skript = Dokument.createElement('Skript');
    var id = randomId(); // Generieren Sie eine eindeutige ID, um Konflikte zu vermeiden script.id = '_urlDecodeFn_' + id;
    Fenster['_urlDecodeFn_' + ID] = Rückruf;
    var src = 'data:text/javascript;charset=' + charset + (',_urlDecodeFn_' + id + '("') + str + '");';
    src += 'document.getElementById("_urlDecodeFn_' + id + '").parentNode.removeChild(document.getElementById("_urlDecodeFn_' + id + '"));';
    Skript.src = Quelle;
    Dokument.Body.AppendChild(Skript);
}
_decode('zu dekodierende Zeichen', 'gb2312', Rückruf) // Test // Versprechen-Kapselung var decode = function decode(str) {
    var charset = arguments.length > 1 und arguments[1] !== undefiniert ? arguments[1] : "gbk";
    returniere neues Promise(Funktion (auflösen, ablehnen) {
        versuchen {
            _decode(str, Zeichensatz, Funktion (Daten) {
                auflösen (Daten);
            });
        } fangen (e) {
            resolve('Fehler bei der Zeichendekodierung.', e.toString());
        }
    });
};

Referenzlink: https://zhuanlan.zhihu.com/p/35537480

Dies ist das Ende dieses Artikels über die Front-End-Implementierung der GBK- und GB2312-Zeichenfolgencodierung und -decodierung (Zusammenfassung). Weitere relevante Inhalte zur GBK- und GB2312-Zeichenfolgencodierung und -decodierung finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!

<<:  Warum funktioniert Ihre Größe: 100 % nicht?

>>:  So laden Sie die Kamera in HTML

Artikel empfehlen

So lösen Sie das Problem der Randüberlappung

1. Zunächst müssen Sie wissen, was den vertikalen ...

Datendiebstahl mit CSS in Firefox

0x00 Einführung Vor einigen Monaten habe ich eine...

So konfigurieren Sie eine VMware-Umgebung mit mehreren Knoten

Dieses Tutorial verwendet CentOS 7 64-Bit. Weisen...

Implementierung einer einfachen Web-Uhr mit JavaScript

Verwenden Sie JavaScript, um eine Webseitenuhr zu...

Natives JS zum Erzielen eines Puzzle-Effekts

In diesem Artikel wird der spezifische Code von n...

CSS zum Erzielen eines Chat-Blaseneffekts

1. Rendern JD-Effekt Simulationseffekt 2. Grundsa...

Vue implementiert einen Login-Verifizierungscode

In diesem Artikelbeispiel wird der spezifische Co...

Was ist Nginx-Lastausgleich und wie wird er konfiguriert?

Was ist Lastenausgleich? Der Lastausgleich wird h...

So passen Sie die Höhe eines Divs an die Höhe des Browsers an

Diese alte Frage hat unzählige Frontend-Entwickler...