回答編集履歴

3

セキュリティ上の考慮事項を追記

2020/05/04 11:13

投稿

Yasumichi
Yasumichi

スコア1773

test CHANGED
@@ -47,3 +47,19 @@
47
47
 
48
48
 
49
49
  ```
50
+
51
+
52
+
53
+ なお、今回は、とりあえず動作させるために
54
+
55
+
56
+
57
+ ```
58
+
59
+ Access-Control-Allow-Origin: *
60
+
61
+ ```
62
+
63
+
64
+
65
+ としましたが、セキュリティを考慮するとドメインを指定した方が良いです。

2

クロスオリジン要求をがブロックされていたので修正案を提示

2020/05/04 11:13

投稿

Yasumichi
Yasumichi

スコア1773

test CHANGED
@@ -3,3 +3,47 @@
3
3
 
4
4
 
5
5
  ![イメージ説明](227fcbbf8c749031bd126c48a1557d81.png)
6
+
7
+
8
+
9
+ その後、開発者ツールでコンソールを除くと以下のようなエラーが出ていました。
10
+
11
+
12
+
13
+ ```
14
+
15
+ クロスオリジン要求をブロックしました: 同一生成元ポリシーにより、http://localhost:8080/ にあるリモートリソースの読み込みは拒否されます (理由: CORS ヘッダー ‘Access-Control-Allow-Origin’ が足りない)。
16
+
17
+ ```
18
+
19
+
20
+
21
+ サーバー側で Access-Control-Allow-Origin を出力するようにしてみたところ、動作しました。
22
+
23
+
24
+
25
+ ```javascript
26
+
27
+ var http = require('http');
28
+
29
+ var server = http.createServer();
30
+
31
+
32
+
33
+ server.on('request', function(req, res) {
34
+
35
+ res.statusCode = 200
36
+
37
+ res.setHeader('Content-Type', 'text/plain');
38
+
39
+ res.setHeader('Access-Control-Allow-Origin', '*');
40
+
41
+ res.end('Hello!');
42
+
43
+ });
44
+
45
+ server.listen(8080);
46
+
47
+
48
+
49
+ ```

1

スクリーンショットを追加。

2020/05/04 11:05

投稿

Yasumichi
Yasumichi

スコア1773

test CHANGED
@@ -1 +1,5 @@
1
1
  とりあえず、Firefox の開発者ツールのネットワークのタブで見ると通信はできてて応答は返ってきてます。
2
+
3
+
4
+
5
+ ![イメージ説明](227fcbbf8c749031bd126c48a1557d81.png)