18

Webワーカーについていくつか質問があります

  • ワーカーはストレージにアクセスできますか?たとえば、indexedDB / webSQLと、ワーカーが開始されたファイルのローカルストレージ?

  • ワーカーにファイルを含めるにはどうすればよいですか?私はfunctions.jsアプリ関連のクイック機能をたくさん持っていますが、ファイルの内容をワーカーにコピーアンドペーストして、2つの異なる場所で関数を更新するだけでは意味がありません。

  • ワーカー内にDOMを含めることはできますか?一時オーディオタグにオーディオファイルをロードして、その継続時間を読み取り、再生可能かどうかを確認するようなものです。親ページのdomにはアクセスしませんが、ワーカー自体にDOMがあります。

  • 質問のいずれかに対する答えが否定的である場合、それを手動で行うにはどうすればよいですか?

これはChromeアプリ用なので、最新のChrome APIにアクセスでき、下位互換性について気にする必要はありません。

4

2 に答える 2

9

Webワーカーからのいかなる種類のDOMアクセスもありません-期間。すべてのDOM操作は、メインのJSスレッドから実行する必要があります。Webワーカーは、メッセージングを介してのみメインスレッドと通信できます。

この前のSOの質問は、Webワーカーがローカルストレージにアクセスできないことを示しています。これは、Google検索で簡単に見つかりました。

その同じスレッドには、Webワーカーがアクセスできるもののリストがあります。

「ワーカーにファイルを含める」とはどういう意味かは不明です。スクリプトをインポートできます。他に何を求めているのかわかりません。オーディオファイルに役立つ場合は、ajax呼び出しを使用してデータをフェッチできます。

これは、Webワーカーでできることとできないことについていくつかの基礎研究を行う必要があるように思えます(Web上にそれについて書かれたTONがあるため)、それを組み込んだより具体的な質問に戻ってきます知識。

あなたができるはずのこと以上のことをあなたにさせるウェブワーカーのためのハックはありません。

実行する作業が多く、メインUIの応答性を可能な限り維持したい場合は、メインのJSスレッドで作業を行い、setTimeoutを使用して小さなチャンクで作業を行うことができます。これは非常に古いデザインパターンであり、スレッドが利用可能になるか使いやすい前の時代にまでさかのぼります。これには、永続的なオブジェクトに状態が格納された状態で小さな断片で実行できるように作業を設計することが含まれます。その後、少量の作業を繰り返し実行してから戻って、次のタイマーティックで次の作業を取得するだけです。 。

于 2011-09-21T06:17:22.330 に答える
3

javascriptライブラリをロードできます。この例を参照してください。

<body>
    <button>Start</button>
    <div id="output"></div>
    <script id="worker_1" type="text/js-worker">
        importScripts(base_url + '/worker_lib2.js');

        function run(event) {
            var msg = event.data;
            this.postMessage({ answer: hello(event.data.name)});
        }

        this.addEventListener('message', run, false);
    </script>

    <script>
        var base_url = window.location.href.replace(/\\/g,'/').replace(/\/[^\/]*$/, '');
        var array = ['var base_url = "' + base_url + '";' + $('#worker_1').html()];
        var blob = new Blob(array, {type: "text/javascript"});

        $('button').click(function() {
            var url = window.URL.createObjectURL(blob);
            console.log(url);
            var worker = new Worker(url);
            worker.addEventListener('message', function(event) {
                $('#output').html(event.data.answer);
            }, false);
            worker.postMessage({
                name: 'Steve'
            });
        });
    </script>
</body>

hello関数を含むライブラリworker_lib2.jsを使用します。

function hello(msg) {
    return 'Hello... ' + msg;
}
于 2013-08-28T14:09:13.260 に答える