teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

1

内容修正とサンプル追記

2017/09/06 06:20

投稿

aro10
aro10

スコア4106

answer CHANGED
@@ -1,2 +1,48 @@
1
+ index.htmlからspchk.jsをワーカーとして呼び出し、さらにspchk.jsからworker2.jsをワーカーで呼び出している状態で、worker2.jsからspchk.jsへデータを受け渡し、spchk.jsからindex.htmlへデータを受け渡す。サンプルプログラムを以下に作成してみたので参考にしてください。
2
+
3
+ 参考
4
+ [Web Worker を使用する](https://developer.mozilla.org/ja/docs/Web/API/Web_Workers_API/Using_web_workers)
5
+ [ワーカーについて(Web Workers)](http://hakuhin.jp/js/web_worker.html)
6
+
7
+ Workerで値を受け渡す方法
8
+ index.html
9
+ ```
10
+ <!doctype html>
11
+ <html lang="en">
12
+ <head>
13
+ <meta charset="UTF-8">
14
+ <meta name="viewport"
15
+ content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
16
+ <meta http-equiv="X-UA-Compatible" content="ie=edge">
17
+ <title>Document</title>
18
+ </head>
19
+ <body>
20
+ <p>test</p>
21
+ <script>
1
- 一例としてsochk.jsがworkerとしてインスタンス化されているので、
22
+ const worker = new Worker('spchk.js');
23
+ worker.addEventListener("message" , function (e){
24
+ console.log("spchk.jsより",e.data);
25
+ });
26
+ </script>
27
+ </body>
28
+ </html>
29
+ ```
30
+ spchk.js
31
+ ```
32
+ //受取用データ
33
+ var result = "";
34
+
35
+ this.self.addEventListener("message" , function (e){
36
+ result = e.data
37
+ this.self.postMessage(result);
38
+ });
39
+ self.importScripts('worker2.js');
40
+ ```
41
+
42
+ worker2.js
43
+ ```
44
+ //なんらかのイベント発生
45
+ setTimeout(function(){
2
- websocket.onmessageの中で、worker.xxxx(result)と値を設定するメソッドを呼び出せば値を受け渡せるかと思います。値を設定用のメソッドをworker(sochk.js)に作成してください。
46
+ this.self.postMessage({"test":"test data"});
47
+ },1000);
48
+ ```