Question

我遇到的情况是这样的：我有一个从零开始做的php项目，用作用React创建的客户端Web应用程序的API端点。目前，它们都是本地的，PHP在localhost:8000上运行，并在localhost:3000上进行响应。当我尝试使用axios发出令牌保护的请求时，会出现问题。登录后，PHP生成的会话丢失。

我尝试添加withCredentials:true客户端并同时启用 header('Access-Control-Allow-Origin: ' . $_SERVER['HTTP_ORIGIN']);在服务器端与此处提到的许多正确答案一样，但没有运气。

PHP标头：

header('Access-Control-Allow-Origin: ' . $_SERVER['HTTP_ORIGIN']);
header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');
header('Access-Control-Max-Age: 1000');
header('Access-Control-Allow-Credentials: true');
header('Access-Control-Allow-Headers: Origin, Content-Type, Accept, Authorization, X-Request-With, Set-Cookie, Cookie, Bearer');

Axios请求：

return axios({
    method: 'GET',
    url: LOAD_NOTES_ENDPOINT,
    headers: {'Authorization': token, 'Access-Control-Allow-Origin': '*',}
})
.then(response => {
    console.log(response.data);
    return response;
})
.catch(
    (err) => {
        return err.response;
    }
);

当前，我能够在登录时发送生成令牌，并在尝试访问受保护的路由时将其发送回去，如果我在Postman上发出请求，并且此操作确认这完全是CORS问题，则可以正常工作。我已经花了两天的时间来寻找解决方案，并打开了有关此问题的所有可能的链接，但所有这些都在提出我已经尝试过但无法解决的问题。我可以找到一种解决方法，但这会使服务器容易受到CSRF攻击，这是我必须防止的事情。

我在这里想念什么吗？还有其他人找到解决方案吗？

Answer 1

嗯，我不知道那里出了什么问题。但是，我通过这个小的设置使其运行：

文件55976696.php

header('Access-Control-Allow-Origin: http://localhost:3000');
header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');
header('Access-Control-Max-Age: 1000');
header('Access-Control-Allow-Credentials: true');
header('Access-Control-Allow-Headers: Origin, Content-Type, Accept, Authorization, X-Request-With, Set-Cookie, Cookie, Bearer');

echo json_encode('php successs');

php -S localhost：8000 55976696.php

文件55976696.js

var express = require('express');
const app = express()

app.get('/', (req, res) => res.sendFile('55976696.html', {root: __dirname}))

app.listen(3000, () => console.log(`Example app listening on port 3000!`))

文件55976696.html

<html>
<head>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
function test() {
    axios.get('http://localhost:8000', {
        withCredentials: false,
    }).then(res => { 
        console.log('SUCCESS', res);
    }).catch(error => {
        console.log('erro', error);
    })
   }; 
</script>
</head>
<body>
test
<div onClick="test()">go</div>
</body>
</html>

节点55976696.js

您的axios.get调用只有一点更改，并且我确定PHP头是我想要的...

在CORS环境中，无法维护php会话

1 个答案: