序文
プロジェクトの開発中に遭遇したやや厄介な問題は、製品がブラウザのアドレス バーの検索語をブラウザから取得して判断する必要があることです。通常、エンコード形式は UTF-8 を使用しますが、Baidu と Google では検索語をエンコードする際に、 GBKエンコーディングが使用されます。結果的にデコードに失敗したので、ネットで解決策を探し、最終的に先輩がまとめてくれた方法を見つけ、iframe経由で問題を解決できたので、今後自分の便宜のためにまとめておきたいと思います、より多くの人に役立つことを願っています。最後にフロントエンドの記事へのリンクを貼ります。
1. エンコーディング (GBK および GB2312 をサポート)
トラブルを避けるために、フォームのリクエスト ページを現在のページに設定し、ページ JS の先頭にコールバック関数を置くことができます。このように、このページに親ページがあり、__encode__iframe__callback__ が定義されている場合、コールバックが呼び出されます。直接実行してウィンドウを閉じることができます。
if (parent.__encode__iframe__callback__) { // 現在のページが子ウィンドウであるかどうかを判断しますparent.__encode__iframe__callback__(location.search.split('=')[1]);
// 現在の子ウィンドウを直接閉じます window.close();
}
関数 GBKEncode(str, charset, callback) {
//フォームを作成し、accept-charset を通じてエンコードする
var form = document.createElement('form');
フォーム.メソッド = 'get';
form.style.display = 'なし';
form.acceptCharset = 文字セット;
if (document.all) {
//IE の場合は、 document.charset メソッドを呼び出します window.oldCharset = document.charset;
document.charset = 文字セット;
}
var input = document.createElement('input');
input.type = '非表示';
input.name = 'str';
入力値 = 文字列;
form.appendChild(入力);
form.target = '__encode__iframe__' // 送信されたターゲットの iframe を指定します。
document.body.appendChild(フォーム);
//送信された文字列をインターセプトした iframe を非表示 if (!window['__encode__iframe__']) {
var iframe;
iframe = document.createElement('iframe');
iframe.setAttribute('name', '__encode__iframe__');
iframe.style.display = 'なし';
iframe.width = "0";
iframe.height = "0";
iframe.scrolling = "いいえ";
iframe.allowtransparency = "true";
iframe.frameborder = "0";
iframe.src = 'about:blank' // 空白に設定します document.body.appendChild(iframe);
}
//
window.__encode__iframe__callback__ = 関数 (str) {
コールバック(文字列);
if (document.all) {
document.charset = window.oldCharset;
}
}
//コールバック エンコード ページのアドレスを設定します。これには、ユーザーが form.action = window.location.href を変更する必要があります。
form.submit();
setTimeout(関数() {
form.parentNode.removeChild(form);
iframe.parentNode.removeChild(iframe);
}, 1000) //0.5秒後にノードを削除}
GBKEncode('エンコードする必要がある文字', 'gb2312', callback);//テスト//プロミスのカプセル化 var encode = function encode(str) {
var charset = argument.length > 1 && 引数[1] !== 未定義の引数[1] : 'gbk';
return new Promise(function (解決、拒否) {
試す {
_encode(str, charset, function (data) {
解決(データ);
});
} キャッチ (e) {
solve('文字エンコードエラー。', e.toString());
}
});
};2. デコード（GBK、GB2312、Base64をサポート）
関数ランダムId() {
var text = "";
可能な変数 = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
for (var i = 0; i < 5; i++) {
text += possible.charAt(Math.floor(Math.random() * possible.length));
}テキストを返します。
}
関数 _decode(str, charset, callback) {
var script = document.createElement('script');
var id = randomId(); // 競合を防ぐために一意の ID を生成します script.id = '_urlDecodeFn_' + id;
window['_urlDecodeFn_' + id] = コールバック;
var src = 'data:text/javascript;charset=' + charset + (',_urlDecodeFn_' + id + '("') + str + '");';
src += 'document.getElementById("_urlDecodeFn_' + id + '").parentNode.removeChild(document.getElementById("_urlDecodeFn_' + id + '"));';
スクリプト.src = ソース;
document.body.appendChild(スクリプト);
}
_decode('デコードする文字', 'gb2312', callback) // テスト // プロミスのカプセル化 var decode = function decode(str) {
var charset = argument.length > 1 && 引数[1] !== 未定義の引数[1] : 'gbk';
return new Promise(function (解決、拒否) {
試す {
_decode(str, charset, 関数 (データ) {
解決(データ);
});
} キャッチ (e) {
solve('文字デコードエラー。', e.toString());
}
});
};参考リンク：https://zhuanlan.zhihu.com/p/35537480
文字列 GBK および GB2312 のエンコードとデコードのフロントエンド実装に関するこの記事はこれで終わりです (概要)。さらに関連する文字列 GBK および GB2312 のエンコードとデコードの内容については、downcodes.com で以前の記事を検索するか、以下の関連記事を参照してください。今後とも downcodes.com をさらにサポートしていただければ幸いです。