Flask - 无法获取 cookie

Posted 2023-03-10

【中文标题】Flask - 无法获取 cookie

【英文标题】：Flask - unable to get cookies

【发布时间】：2020-07-19 01:51:34

【问题描述】：

我有以下端点开始授权流程：

@spotify_auth_bp.route("/index", methods=['GET', 'POST'])
def spotify_index():
    CODE = "code"
    CLIENT_ID =   os.environ.get('SPOTIPY_CLIENT_ID')
    SCOPE = os.environ.get('SPOTIPY_SCOPE')
    REDIRECT_URI = os.environ.get('SPOTIPY_REDIRECT_URI')

    SPOTIFY_AUTH_URL = "https://accounts.spotify.com/authorize"

    return redirect("?response_type=&client_id=&scope=&redirect_uri=".format(
        SPOTIFY_AUTH_URL, CODE, CLIENT_ID, SCOPE, REDIRECT_URI), code=302)

然后我从 Spotify 重定向回 /callback，我在回复中设置 jwt cookie，如下所示：

 @spotify_auth_bp.route("/callback", methods=['GET', 'POST'])
 def spotify_callback():
    token = user.encode_access_token(access_token)
    a11n_h, a11n_d, a11n_s = token.decode().split('.')
    response = make_response(redirect('http://localhost/about', code=302))
    response.set_cookie('a11n.h', a11n_h)
    response.set_cookie('a11n.d', a11n_d) 
    response.set_cookie('a11n.s', a11n_s, httponly=True)  

    return response

Cookie 会显示在我的浏览器控制台的“应用程序”下。

---

现在我想从另一个端点获取它们，如下所示：

@spotify_auth_bp.route("/get_token/<user_id>", methods=['GET', 'POST'])
def get_token(user_id):
    # get access token cookies
    a11n_h = request.cookies.get('a11n.h')
    a11n_d = request.cookies.get('a11n.d')
    a11n_s = request.cookies.get('a11n.s')

但我将这些 cookie 打印为 None、None、None

另外，我没有 Flask 配置...

app.config.update(
    SESSION_COOKIE_SECURE=True,
    SESSION_COOKIE_SAMESITE='Lax',
)

...这可能会阻止通过 http 发送 cookie。

---

我错过了什么？

---

OBS：我正在使用Postman 测试此端点，并且在标头中我将键Access-Control-Allow-Credentials 设置为值true。

【问题讨论】：

首先，如flask doc中所述：安全“如果为真，cookie将只能通过HTTPS获得。”你在使用 https 吗？如果你不这样做，那么烧瓶就不会发送 cookie。这就是为什么它是无的。之后，如果 cookie 在 Web 浏览器中但未发回。可能是您设置了配置：SESSION_COOKIE_SECURE=True 或其他一些阻止 cookie 通过 http 发送的标头。看看flask.palletsprojects.com/en/1.1.x/security

@Victor 感谢您的评论。我已经编辑了我的问题。我没有使用 https，也没有阻止通过 http 发送 cookie 的配置……有什么想法吗？

不是真的，我的意思是如果 cookie 出现在浏览器中，它们似乎没有被发回。您可以使用 Web 浏览器的控制台 (F12) 并在单击 /callback 时检查请求中发送的内容。并在重定向中使用 url_for：redirect(url_for())

@Victor 没有 localhost 的功能，也没有 '/'，也没有任何 'about' 装饰器。这些 url 在前端由 React 处理。

【参考方案1】：

根据上述，我假设您正在使用基于任何其他框架的前端应用程序，并使用 axios、fetch、request 等库来访问烧瓶上的 API。

因此，您可能错过了需要在请求中设置一个标志以允许发送 cookie。请参阅以下链接以找到方法：

获取 API：https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#Sending_a_request_with_credentials_included

    fetch('https://example.com', 
      credentials: 'include'
    );

XMLHttpRequest

    var xhr = new XMLHttpRequest();
    xhr.open('GET', 'http://example.com/', true);
    xhr.withCredentials = true;
    xhr.send(null);

纠正我，如果不能解决问题。

【讨论】：

访问这个***.com/a/39923306/10798048它可能会解决这个问题

它解决了这个问题。我已经发布了一个答案，以详细说明它是如何解决的，但我已经接受并奖励了你的答案。谢谢。

【参考方案2】：

以下工作（如 Dhruv Agarwal 的回答中所建议的那样）：

getToken(event) 
    const userId = this.props
    const options = 
      url: `$process.env.REACT_APP_WEB_SERVICE_URL/get_token/1`,
      method: 'get',
      headers: 
        'Content-Type': 'application/json',
        Authorization: `Bearer $window.localStorage.authToken`,
      
    ;

    axios.defaults.withCredentials = true // <--------------------

    return axios(options)
    .then((res) => 
      console.log('res.data.data)
    )    
    .catch((error) =>  console.log(error); );
  ;

我不知道我的 Postman 请求中缺少什么，但现在它可以正常工作了。