Axios是否支持Set-Cookie?是否可以通过Axios HTTP请求进行身份验证?

rvpgvaaj  于 2023-01-17  发布在  iOS
关注(0)|答案(5)|浏览(273)

我正在尝试使用Axios HTTP请求调用对Express API后端进行身份验证。我可以在响应标头中看到“Set-Cookie”,但未设置cookie。是否可以通过Axios HTTP调用设置cookie?

Access-Control-Allow-Origin: *
Connection: keep-alive
Content-Length: 355
Content-Type: application/json; charset=utf-8
Date: Fri, 28 Sep 2018 05:59:01 GMT
ETag: W/"163-PAMc87SVHWkdimTJca7oRw"
Set-Cookie: token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...; Max-Age=3.6; Path=/; Expires=Fri, 28 Sep 2018 05:59:04 GMT; HttpOnly
X-Powered-By: Express
xuo3flqw

xuo3flqw1#

试试这个!

axios.get('your_url', {withCredentials: true}); //for GET
axios.post('your_url', data, {withCredentials: true}); //for POST
axios.put('your_url', data, {withCredentials: true}); //for PUT
axios.delete('your_url', data, {withCredentials: true}); //for DELETE

有关这方面的更多信息,请参阅axios文档:
“withCredentials指示是否应使用凭据发出跨站点访问控制请求”-https://github.com/axios/axios
关于使用凭据的更多详细信息:
https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/withCredentials

gstyhher

gstyhher2#

是的,您可以通过Axios设置cookie。cookie需要传递到头对象中。您可以通过get/post/put/delete等请求发送cookie:根据Aaron的建议:

axios.get('URL', {
  withCredentials: true
}); 
axios.post('URL', data, {
withCredentials: true
}); 
axios.put('URL', data, {
withCredentials: true
});
axios.delete('URL', data, {
withCredentials: true
});

或者你也可以试试这个:

axios.get(url, {
            headers: {
                Cookie: "cookie1=value; cookie2=value; cookie3=value;"
            }
        }).then(response => {
              console.log(response);
});
gz5pxeao

gz5pxeao3#

以防有人遇到我的问题,
下面是我对类似问题https://stackoverflow.com/a/62821342/8479303的回答
在我的例子中,网络面板显示响应具有'Set-Cookie'报头,但是在axios中,报头不会显示,并且cookie正在被设置。
对我来说,分辨率是设置Access-Control-Expose-Headers头。
为了解释这个问题,从这个关于axios存储库中的一个问题的评论中,我被引导到这个人的注解中,这些注解引导我设置Access-Control-Expose-Headers头--现在cookie在客户机中正确设置了。
因此,在Express.js中,我必须向cors中间件添加exposedHeaders选项:

const corsOptions = {
  //To allow requests from client
  origin: [
    "http://localhost:3001",
    "http://127.0.0.1",
    "http://104.142.122.231",
  ],
  credentials: true,
  exposedHeaders: ["set-cookie"],
};

...

app.use("/", cors(corsOptions), router);

同样重要的是,在axios端,我在以下axios请求中使用withCredentials配置,我希望包括cookie。
前/

const { data } = await api.get("/workouts", { withCredentials: true });
deikduxw

deikduxw4#

我尝试设置withCredentials: true,但仍然得到这个错误:
跨来源请求被阻止:同源策略不允许阅读位于http://localhost:4000/users/register的远程资源。(原因:CORS请求未成功)。
CORS配置为允许来自前端端口的请求。
我不得不修改axios的默认选项,如下所示:

axios.defaults.withCredentials = true

问题解决了,没有错误,设置Cookie按预期工作。

mnemlml8

mnemlml85#

cookie不能被触及,问题是它在附加到响应对象之后被捆绑到请求对象。

function sign(req,res){
  res.cookie("x-token", signed, { maxAge: (new JWTService().jwtExpirySeconds * 
   1000) });
}

客户端在接收到这个响应后,只需要继续请求,set-cookie以“Cookie“的名义将被捆绑到那些请求中,就像x1c 0d1x这样

警告:当HTTPcookie过期时,它会被自动删除,并且不会绑定到之后的请求。

相关问题