javascript - 如何在GM_xmlhttpRequest中正确处理EUC-JP编码以显示日文?

Question

一个编码EUC-JP的网站使用GM_xmlhttpRequest请求后，使用encoding.min.js转码后结果不能正常显示

直接请求结果显示乱码，请求结果转码为EUC-JP显示乱码，请求二进制结果，转化为EUC-JP编码，以及再转化为UTF8均显示乱码，如何将结果正常显示日文文字

⚠️#NSFW#

function convertBufferToEucJp(buffer) {
        // Convert buffer to Uint8Array
        const uint8Array = new Uint8Array(buffer);

        // Convert Uint8Array to string with UTF-8 encoding (assuming the buffer is UTF-8)
        const utf8String = new TextDecoder("utf-8").decode(uint8Array);

        // Convert UTF-8 string to EUC-JP
        const eucJpString = Encoding.convert(utf8String, {
            to: 'EUCJP',
            from: 'UTF8'
        });

        return eucJpString;
    }

    GM_xmlhttpRequest({
        method: "GET",
        url: "https://seesaawiki.jp/av_video/d/%c6%e1%b2%ec%ba%ea%a4%e6%a4%ad%a4%cd",
        responseType: "arraybuffer", // Get response as ArrayBuffer
        onload: function(response) {
            if (response.status >= 200 && response.status < 300) {
                // Convert ArrayBuffer to EUC-JP string
                const eucJpString = convertBufferToEucJp(response.response);

                // Do something with the EUC-JP string
                console.log(eucJpString);
            } else {
                console.error("Error fetching data:", response.status);
            }
        },
        onerror: function(error) {
            console.error("Request error:", error);
        },
    });

Answer 1

试了一下，把解码函数换成这个就可以了

const ab2str = (arrayBuf, encodeType) =>{
    var decoder = new TextDecoder(encodeType)
    var u8arr = new Uint8Array(arrayBuf)
    return decoder.decode(u8arr)
}

ab2str(response.response, 'EUC-JP')

参考来源：

• JS如何从ArrayBuffer中解码字符串 | Jack Huang's Blog

Answer 2

在你的代码中，问题主要出在假设服务器返回的响应已经是UTF-8编码，但实际上它是EUC-JP编码。当你尝试将EUC-JP编码的二进制数据当作UTF-8来解码时，会导致乱码。因此，你应该直接处理EUC-JP编码的二进制数据，而不是先尝试将其解码为UTF-8字符串。

以下是一个修改后的版本，它直接处理EUC-JP编码的ArrayBuffer，并将其转换为UTF-8字符串（如果你需要的话），以便在控制台或网页上正常显示日文：

// 假设你已经引入了Encoding.js库来处理编码转换

function arrayBufferToEucJpString(buffer) {
    // 这里的buffer已经是EUC-JP编码的二进制数据，不需要额外转换
    // 但由于我们通常需要文本处理，我们可以选择将其转换为UTF-8
    const eucJpString = Encoding.convert(buffer, 'EUCJP', 'UTF8');
    return eucJpString;
}

GM_xmlhttpRequest({
    method: "GET",
    url: "https://seesaawiki.jp/av_video/d/%c6%e1%b2%ec%ba%ea%a4%e6%a4%ad%a4%cd",
    responseType: "arraybuffer", // 直接获取二进制响应
    onload: function(response) {
        if (response.status >= 200 && response.status < 300) {
            // 直接将ArrayBuffer转换为EUC-JP字符串（如果需要UTF-8则如上转换）
            const eucJpString = arrayBufferToEucJpString(response.response);

            // 现在eucJpString是UTF-8编码的字符串，可以直接在控制台或网页上显示
            console.log(eucJpString);
        } else {
            console.error("Error fetching data:", response.status);
        }
    },
    onerror: function(error) {
        console.error("Request error:", error);
    }
});

注意：

1. 我移除了将ArrayBuffer转换为UTF-8字符串的步骤，直接将其视为EUC-JP编码的二进制数据，并使用Encoding.convert方法将其转换为UTF-8字符串。
2. 确保你的网页或控制台支持UTF-8编码，以便正确显示日文。
3. 如果你的目标环境（如某些浏览器扩展）默认不支持EUC-JP编码，确保你使用的库（如Encoding.js）能够正确处理这种编码转换。

另外，如果网页的响应头明确指出了字符编码（Content-Type），则通常不需要手动进行编码转换，除非响应头错误或缺失。在你的情况下，由于你直接通过URL编码访问了资源，且知道其编码为EUC-JP，因此上述方法是适用的。