Vue 3和cookies

Question

我正在Vue 3中构建一个前端，并使用fastAPI作为后端。我想在身份验证过程中使用httponly，但在浏览器中我看不到cookie已经收到。我已经向邮递员检查了后端的请求，我看到了带有后端数据的"set-cookie“。

前部：

127.0.0.1:8080

• Vue 3
• Axios 0.18.1
• url：

后端：

• FastAPI
• uvicorn
• url: 127.0.0.1:8000

在前面，使用Axios的post消息如下：

axios
    .post(process.env.VUE_APP_API_URL + '/login', this.auth, {withCredentials: true})
    .then(res => {
      console.log(res.data);
    })
    .catch(e => {
      console.log(e);
    });

在后端，我配置了显式的起源：

    origins = [
    "http://localhost",
    "http://localhost:8080",
    "http://127.0.0.1",
    "http://127.0.0.1:8080",
]
app.add_middleware(
    CORSMiddleware,
    allow_origins=origins,
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

当我把答案退回正面时：

    response.set_cookie(
        key="Authorization",
        value=f"Bearer {token}",
        domain="127.0.0.1",
        path="/login",
        httponly=True,
        secure=False,
        max_age=1800,
        expires=1800,
    )

谢谢你提前。

Answer 1

我做了以下修改，现在已经开始工作了：

前部：

.env.development文件：

NODE_ENV=development
VUE_APP_API_URL=http://localtest.me:8000

后端：

origins = [
"http://localhost",
"http://localhost:8080",
"http://localtest.me",
"http://localtest.me:8080"

]

response.set_cookie(
        key="Authorization",
        value=f"Bearer {token}",
        domain="localtest.me",
        path="/",
        httponly=True,
        secure=False,
        max_age=1800,
        expires=1800,
    )