teratail
回答率
85.30%
teratail header banner
teratail header banner
質問するログイン新規登録
トップに関する質問CORS でクッキーが保存できない

編集履歴

質問編集履歴

7

誤字

2019/10/15 13:18

投稿

nico25
nico25

スコア830

title CHANGED
File without changes
body CHANGED
@@ -107,7 +107,7 @@
107
107
 
108
108
  @app.route("/")
109
109
  def index():
110
- resp = Response("This is sample page.")
110
+ resp = Response("Hello, world!")
111
111
  resp.headers['Access-Control-Allow-Origin'] = 'https://127.0.0.1:5001'
112
112
  resp.headers['Access-Control-Allow-Method'] = 'GET, POST, PUT, PATCH, DELETE, HEAD, OPTIONS'
113
113
  resp.headers['Access-Control-Allow-Headers'] = 'Content-type,Accept,X-Custom-Header'
@@ -125,7 +125,7 @@
125
125
 
126
126
  @client.route('/')
127
127
  def index():
128
- return ''
128
+ return "This is a sample page."
129
129
  ```
130
130
 
131
131
  #### ◯ SSL 秘密鍵と証明書

6

誤字

2019/10/15 13:17

投稿

nico25
nico25

スコア830

title CHANGED
File without changes
body CHANGED
@@ -126,14 +126,6 @@
126
126
  @client.route('/')
127
127
  def index():
128
128
  return ''
129
- (venv) iMac:cors sho$ cat client.py
130
- from flask import Flask
131
-
132
- client = Flask(__name__)
133
-
134
- @client.route('/')
135
- def index():
136
- return ''
137
129
  ```
138
130
 
139
131
  #### ◯ SSL 秘密鍵と証明書

5

誤字

2019/10/15 13:16

投稿

nico25
nico25

スコア830

title CHANGED
File without changes
body CHANGED
@@ -35,6 +35,16 @@
35
35
  ```
36
36
 
37
37
  #### ◯ クライアント
38
+ "This is a sample page." とだけ表示されるページを作成しました。
39
+
40
+ ### 試したこと
41
+ #### ◯ その１ 成功 - ブラウザから直接
42
+ https://127.0.0.1:5000/ にブラウザから直接アクセス
43
+ -> 問題なくクッキーが保存されました。
44
+
45
+ #### ◯ その２ 成功 - CORS ではない fetch
46
+ https://127.0.0.1:5000/ にブラウザでアクセス
47
+ 保存されたクッキーを消す
38
48
  デベロッパツールのコンソールから fetch を使い、以下のスクリプトを実行します。
39
49
 
40
50
  ```javascript
@@ -48,9 +58,15 @@
48
58
  })
49
59
  ```
50
60
 
51
- ### 結果
52
- 上記 JavaScript のコードの結果は、以下のような具合です。
61
+ -> 問題なくクッキーが保存されました。
53
62
 
63
+ #### その３ 失敗 - CORS で fetch
64
+ https://127.0.0.1:5001/ にブラウザでアクセス
65
+ デベロッパツールのコンソールから fetch を使い、上記のスクリプトを実行しました。
66
+ -> クッキーは保存され **ない**。
67
+
68
+ 結果の詳細は、以下のような具合です。
69
+
54
70
  |ブラウザ|コンソール|ネットワーク|ストレージ|
55
71
  |:--|:--|:--|:--|
56
72
  |Chrome|エラーは起こらない|Set-Cookie ヘッダが表示される|クッキーは保存され **ない**|

4

誤字

2019/10/15 13:14

投稿

nico25
nico25

スコア830

title CHANGED
File without changes
body CHANGED
@@ -1,5 +1,6 @@
1
1
  お世話になっております。
2
2
  CORS でクッキーを保存することができず、このたび質問させていただきました。
3
+ 何か思い当たることなどありましたら、ご教示いただけると幸いでございます。
3
4
 
4
5
 
5
6
  ### 環境
@@ -130,4 +131,4 @@
130
131
 
131
132
 
132
133
  以上になります。
133
- 何か思い当たることがありましたら、ご教示いただけると幸いです。
134
+ 目を通していただき、ありがとうございます。

3

誤字

2019/10/15 12:35

投稿

nico25
nico25

スコア830

title CHANGED
File without changes
body CHANGED
@@ -1,5 +1,5 @@
1
1
  お世話になっております。
2
- CORS でクッキーを保存することができず苦慮していて、質問させていただきました。
2
+ CORS でクッキーを保存することができず、このたび質問させていただきました。
3
3
 
4
4
 
5
5
  ### 環境
@@ -47,7 +47,7 @@
47
47
  })
48
48
  ```
49
49
 
50
- ## 結果
50
+ ### 結果
51
51
  上記 JavaScript のコードの結果は、以下のような具合です。
52
52
 
53
53
  |ブラウザ|コンソール|ネットワーク|ストレージ|

2

誤字

2019/10/15 12:23

投稿

nico25
nico25

スコア830

title CHANGED
File without changes
body CHANGED
@@ -60,7 +60,7 @@
60
60
 
61
61
  ![画面](57625eb416003cc183da1e24ecfc9918.png)
62
62
 
63
- ## 参考にさせていただいているサイト
63
+ ### 参考にさせていただいているサイト
64
64
 
65
65
  主にこちらを参考にしました。
66
66
 
@@ -77,5 +77,57 @@
77
77
  > I find it pretty enraging that this is a "working as intended" behaviour of Safari, though I understand their motivation. XHR (and presumably native fetch when it lands natively) does not support the setting of third-party cookies at all.
78
78
  > This failure is completely transparent because it is handled by the browser outside of the scripting context, so client-based solutions are not really going to be possible.
79
79
 
80
+ ### 環境の補足
81
+ #### ◯ 使用しているサーバ
82
+ サーバは Flask を使用しています。
83
+
84
+ ```python
85
+ # api.py
86
+ from flask import Flask
87
+ from flask import Response
88
+
89
+ app = Flask(__name__)
90
+
91
+ @app.route("/")
92
+ def index():
93
+ resp = Response("This is sample page.")
94
+ resp.headers['Access-Control-Allow-Origin'] = 'https://127.0.0.1:5001'
95
+ resp.headers['Access-Control-Allow-Method'] = 'GET, POST, PUT, PATCH, DELETE, HEAD, OPTIONS'
96
+ resp.headers['Access-Control-Allow-Headers'] = 'Content-type,Accept,X-Custom-Header'
97
+ resp.headers['Access-Control-Allow-Credentials'] = 'true'
98
+ resp.headers['Access-Control-Max-Age'] = '86400'
99
+ resp.headers['Content-Type'] = 'text/plain; charset=utf-8'
100
+ resp.headers['set-cookie'] = 'connect.sid=s%3AM9NQy3hz5cLb3kW6htuybWE6nEX1_iL6.ENXqiTfVPMQVyP%2FGFZ9pshnC87D7rX5%2BM48mjVqwR7s; Path=/; HttpOnly; Secure'
101
+ return resp
102
+ ```
103
+ ```python
104
+ # clietn.py
105
+ from flask import Flask
106
+
107
+ client = Flask(__name__)
108
+
109
+ @client.route('/')
110
+ def index():
111
+ return ''
112
+ (venv) iMac:cors sho$ cat client.py
113
+ from flask import Flask
114
+
115
+ client = Flask(__name__)
116
+
117
+ @client.route('/')
118
+ def index():
119
+ return ''
120
+ ```
121
+
122
+ #### ◯ SSL 秘密鍵と証明書
123
+
124
+ mkcert を使って、オレオレ証明書を発行しています。
125
+
126
+ ```
127
+ mkcert 127.0.0.1
128
+ ```
129
+
130
+
131
+
80
132
  以上になります。
81
133
  何か思い当たることがありましたら、ご教示いただけると幸いです。

1

誤字

2019/10/15 12:21

投稿

nico25
nico25

スコア830

title CHANGED
File without changes
body CHANGED
@@ -1,5 +1,5 @@
1
+ お世話になっております。
1
- CORS でクッキーを保存することができず苦慮しております。
2
+ CORS でクッキーを保存することができず苦慮していて、質問させていただきました。
2
- 何か思い当たることがありましたら、ご教示いただけると幸いです。
3
3
 
4
4
 
5
5
  ### 環境
@@ -77,4 +77,5 @@
77
77
  > I find it pretty enraging that this is a "working as intended" behaviour of Safari, though I understand their motivation. XHR (and presumably native fetch when it lands natively) does not support the setting of third-party cookies at all.
78
78
  > This failure is completely transparent because it is handled by the browser outside of the scripting context, so client-based solutions are not really going to be possible.
79
79
 
80
- 以上になります。
80
+ 以上になります。
81
+ 何か思い当たることがありましたら、ご教示いただけると幸いです。