（sqlite，Flask + React），flask session Z21D6F40CFB0511982E5220返回無。

Question

我在這個問題上花了太多時間，我認為我只是做錯了，有更好的方法來做到這一點。

我正在創建一個帶有反應前端和 flask 后端的網站，以及 sqlite 數據庫。 我的問題是，當我使用 session.get() 時，它在一個 function 中返回 None 而不是另一個。

在此 function 中，session.get() 返回正確的用戶 ID，因此 function 能夠正確地將數據添加到數據庫中。 即使我以其他用戶身份登錄，並且用戶 ID 也發生了變化。

@app.route('/addlist', methods=['GET','POST'])
def addlist():
    if request.method == 'POST':
        user_id = session.get("user_id")
        list_name = request.form['ListName']
        color = request.form['color']
        new_list = ListOfLists(user_id = user_id,name = list_name,color=color)
        db.session.add(new_list)
        db.session.commit()
        return redirect('http://localhost:3000/userPage')

但是當我嘗試在前端獲取列表時，session.get('user_id') 返回 None，因此我無法獲取用戶的列表。

@app.route('/getlists', methods=['GET', 'POST'])
def getlists():
    user_id = session.get('user_id')
    print("USER ID: {}".format(user_id))
    lists = ListOfLists.query.filter_by(user_id=1).all()
    return jsonify(lists)

打印 output： USER ID: None

function 本身肯定有效，因為當我將.filter_by(user_id=user_id)更改為.filter_by(user_id=1)時，數據庫中的用戶 id 為 1，它實際上將我在數據庫中的正確列表發送到前端。

---

這是應用程序配置、注冊和登錄端點，以及 javascript function 如果感興趣的話，它會獲取列表：

from flask import Flask, request, redirect, session, jsonify
from flask_session import Session
from flask_sqlalchemy import SQLAlchemy
from flask_cors import CORS

#flask app initialization
app = Flask(__name__)
app.config["SECRET_KEY"] = "changeme"
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///database.db'
db = SQLAlchemy(app)
app.config["SESSION_TYPE"] = "sqlalchemy"
app.config['SESSION_SQLALCHEMY'] = db
Session(app)
CORS(app)

@app.route('/register', methods = ['GET', 'POST'])
def register():
    if request.method == 'POST':
        username = request.form['email']
        password = request.form['password']
        new_user = User(username=username, password=password) #user table constructor
        db.session.add(new_user)
        db.session.commit()
        return redirect('http://localhost:3000/mainpage')

@app.route('/login', methods=['GET', 'POST'])
def Login():
    if request.method == 'POST':
        username = request.form['email']
        password = request.form['password']
        user = User.query.filter_by(username = username).first()
        if user and user.password == password:
            #save user to session
            session['user_id'] = user.id
            return redirect('http://localhost:3000/userPage')

import React, { useState, useEffect } from 'react';

export default function GetLists() {
    const [lists, setLists] = useState('');
    useEffect(() => {
        fetch('http://localhost:5000/getlists')
            .then(response => response.json())
            .then(data => console.log(data))
        },[]);
//return currently doesn't matter as I am only console.log-ing the data
    return (...);
}

編輯1：

I noticed the print output is USER ID: 1 (the correct user id) when I manually go to http://localhost:5000/getlists , but the output is None when I use fetch() in javascript

Answer 1

您的 session 存儲在名為 session 的 cookie 中。 根據這篇文章，fetch 默認不發送 cookies。

要在您的請求中包含 session cookie，請嘗試以下操作：

fetch(url, {
  credentials: "same-origin"
}).then(...).catch(...);