Muatkan brotli dimampatkan WASM-Golang-php.cn

Muatkan brotli dimampatkan WASM

WBOY

Lepaskan： 2024-02-13 16:21:08

ke hadapan

598 orang telah melayarinya

加载 brotli 压缩的 WASM

Dalam beberapa tahun kebelakangan ini, perkembangan teknologi bahagian hadapan telah berubah setiap hari, dan kami sentiasa berinovasi. Antaranya, "Memuatkan WASM termampat brotli" adalah topik yang telah menarik perhatian ramai. Ia boleh membantu pembangun web memuatkan dan menghuraikan data yang dimampatkan dengan lebih cekap, meningkatkan prestasi halaman web dan pengalaman pengguna. Dalam artikel ini, editor PHP Zimo akan memperkenalkan prinsip dan penggunaan teknologi ini untuk membantu anda menguasai teknologi hadapan ini dengan lebih baik. Mari kita meneroka bidang yang menarik ini bersama-sama!

Kandungan soalan

Saya ada fail WASM termampat brotli main.wasm.br. Saya telah memampatkannya secara manual melalui CLI.

Pada masa ini dalam fail HTML saya, saya mempunyai yang berikut -

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <title>Go WASM</title>
    <script src="wasm_exec.js"></script>
    <script>
        const go = new Go();
        WebAssembly.instantiateStreaming(fetch("main.wasm"), go.importObject).then((result) => {
            go.run(result.instance);
        });
    </script>
</head>

<body></body>

</html>

Salin selepas log masuk

Ini akan memuatkan fail WASM yang tidak dimampatkan. Jika saya menukarnya kepada WebAssembly.instantiateStreaming(fetch("main.wasm.br"), go.importObject) saya mendapat ralat berikut -

<code>
Uncaught (in promise) TypeError: Failed to execute 'compile' on 'WebAssembly': Incorrect response MIME type. Expected 'application/wasm'.
</code>

Salin selepas log masuk

Bagaimana untuk memuatkannya ke dalam HTML?

Penyelesaian

Terima kasih kepada semua yang memberi komen dan membimbing saya kepada penyelesaian.

Jadi ia hanya perlu memahami asas permintaan/tindak balas HTTP -

Content-Type Mengawal jenis data sebenar kandungan respons.

Content-Encoding Kawal pengekodan/logik pemampatan yang kami gunakan untuk mengekod kandungan respons.

Dalam kes saya, saya memampatkan fail wasm secara manual menggunakan gzip dan mengkonfigurasi NginX seperti berikut -

location ~ \.wasm {
    default_type 'application/wasm';
    add_header 'Content-Encoding' 'gzip';
    add_header 'Access-Control-Allow-Origin' '*';
    add_header 'Access-Control-Allow-Credentials' 'true';
    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
}

Salin selepas log masuk

Anda boleh mengkonfigurasi fail make atau membina skrip anda untuk memampatkan wasm setiap kali anda membina projek anda.

Atas ialah kandungan terperinci Muatkan brotli dimampatkan WASM. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!