web-dev-qa-db-ja.com

ブラウザがWebAssemblyをサポートしているかどうかを確認するにはどうすればよいですか?

WebAssemblyのサポートがすべての新しい主要ブラウザーに導入されたので、私のWebサイトにアクセスしている現在のブラウザーがそれをサポートしているかどうかを確認するにはどうすればよいですか?

22
Ayush Gupta

WebAssemblyの存在を検出する方法はいくつかあります。基本的な方法は、グローバルスコープで"object"型のWebAssemblyであるかどうかを確認することですが、「グローバルスコープ」は異なるJavaScript環境(メインブラウザースレッド、ワーカー、ノード.js)。

また、WebAssemblyをサポートすることはできますが、実際にはコンパイルまたはインスタンス化できないため、これを行うことは技術的に十分ではありません [〜#〜] csp [〜#〜] まだ標準化され、進行中の作業 ここ )。

保守的なチェックは次のようになります。

const supported = (() => {
    try {
        if (typeof WebAssembly === "object"
            && typeof WebAssembly.instantiate === "function") {
            const module = new WebAssembly.Module(Uint8Array.of(0x0, 0x61, 0x73, 0x6d, 0x01, 0x00, 0x00, 0x00));
            if (module instanceof WebAssembly.Module)
                return new WebAssembly.Instance(module) instanceof WebAssembly.Instance;
        }
    } catch (e) {
    }
    return false;
})();

console.log(supported ? "WebAssembly is supported" : "WebAssembly is not supported");

次のことを行います。

  • WebAssemblyが現在のスコープでアクセス可能かどうかを確認します。グローバルでない場合、私たちはあまり気にしません!
  • .instantiate関数があるかどうかを確認します。ここでは実際には使用しませんが、非同期であり、メインスレッドまたはオフで大きなモジュールを処理できるため、実際にインスタンス化するときに使用します。
  • 可能な限り最小のモジュール(マジックナンバー'\0', 'a', 's', 'm'に続いてuint32としてエンコードされたバージョン番号1)を同期コンパイルし、WebAssembly.Moduleが得られるかどうかを確認してください。
  • 最後に、そのモジュールを同期的にインスタンス化して、それがWebAssembly.Instanceであることを確認してください。

これは少し多くなりますが、以下に関係なく動作するはずです。

  • コードが実行されている場所(メインスレッド、ワーカー、node.js)。
  • CSPが最終的に標準化される方法。
36
JF Bastien