React 不安全会话 Cookie

Question

我面临的问题是，React 并未将 Cookie 保存在站点的 Cookie 存储中

我的api在flask上运行并且有这个设置

# ------------- Flask App ------------- 
app = Flask(__name__, static_folder='templates/static')
app.secret_key = 'secret'
app.config['SESSION_TYPE'] = 'filesystem'
app.config['SESSION_USE_SIGNER'] = True
app.config['SESSION_PERMANENT'] = False
app.config['SESSION_COOKIE_SECURE'] = True  # Nur über HTTPS
app.config['SESSION_COOKIE_HTTPONLY'] = True  # Nicht über JavaScript zugänglich
app.config['SESSION_COOKIE_SAMESITE'] = 'Lax'  # Schutz vor CSRF
app.config['SESSION_COOKIE_SECURE'] = True

@app.after_request
def add_security_headers(response):
  response.headers['Access-Control-Allow-Origin'] = '*'
  # response.headers['Content-Security-Policy'] = "default-src 'self'; img-src 'self' 
  https://images-na.ssl-images-amazon.com/ https://cdn.discordapp.com/; style-src 'self' 
  https://unpkg.com/[email protected]/css/; font-src 'self' https://unpkg.com/[email protected]/; 
  script-src 'self' 'unsafe-inline' 'unsafe-eval'"
  response.headers['Strict-Transport-Security'] = 'max-age=31536000; 
  includeSubDomains;preload'
  response.headers['X-Content-Type-Options'] = 'nosniff'
  response.headers['X-Frame-Options'] = 'SAMEORIGIN'
  response.headers['Referrer-Policy'] = 'same-origin'
  return response

这个函数返回响应中的cookie

@app.route('/oauth', methods=['GET'])
def oauth():
# Check if data ok
if membership: # If user is allowed to use App
    session['userdata'] = [id, avatar, username, usertag, membership, access_token]
    session.setdefault('filter', [None, None, None])
    return jsonify({'status': 'authorized'})

在邮递员中一切正常，它保护cookie并在其他请求中重用它，但只有当我尝试用flask运行它时，我才获得授权，并收回cookie，但浏览器不保护它，所以它不会在接下来的请求中使用。

我已经尝试更改烧瓶的设置，就像这篇文章中的那样我无法设置从响应中收到的cookie但它没有改变任何东西。

Answer 1

Postman 处理

Cookies

的方式与浏览器不同。

带有

Cookie

 属性的 

HttpOnly

 告诉浏览器阻止 javascript 访问 

Cookies

，并且仅将 

Cookies

 包含在域的 

Request

 中。

如果您的reactjs应用程序在另一个域上运行（同一主机不同的端口仍然是另一个域）并且您希望这些

Cookies

与

Request

一起发送，则必须允许凭据即

Cookies成为一部分的 Request

。

使用

fetch()

的示例：

fetch(url, {
  credentials: "include",
});

服务器还必须通过发送带有

Request

:

的

Response

来响应，确认它允许跨源 HTTP

Header

包含凭证

Access-Control-Allow-Credentials: true