获取PHP服务器上的本地资源

csga3l58  于 2023-10-15  发布在  PHP
关注(0)|答案(1)|浏览(136)

我正在开发一个小型的准PHP后端(没有框架)和一个关于React的前端应用程序作为练习。非常基本的东西,React应用程序上的一些组件通过useEffect钩子和fetch请求调用PHP后端API上的路由。
一切都很顺利,但我在使用JWT的身份验证请求中遇到了一些麻烦。我运行的PHP服务器与内置的PHP服务器(php -S localhost:8080)。这是我发送的请求:

  1. const fetchHeader = {
  2. headers: {
  3. "Authorization": 'Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpZCI6MiwibmFtZSI6IlNyIENsaWVudGUiLCJlbWFpbCI6ImNsaWVudEBtYWlsLmNvbSIsImNyZWF0ZWQiOiIyMDIzLTEwLTExIDIwOjE1OjM1Iiwicm9sZSI6IkNMSUVOVCJ9.5m_IOjFa_DeTwzIeZk5adhQQY5O_PYrVpcR2StbwUas',
  4. 'Accept': 'application/json',
  5. 'Content-Type': 'application/json'
  6. }
  7. }
  8. useEffect(() => {
  9. fetch('http://localhost:8080/api/cart/current', { fetchHeader, crossDomain: true, method: 'GET' })
  10. .then((response) => response.json())
  11. .then((data) => {
  12. console.log(data)
  13. //setOrder(data.content);
  14. })
  15. .catch((err) => {
  16. console.log(err.message);
  17. });
  18. }, []);

在服务器上,我添加了这个来打印头,只是为了调试:

  1. header("Access-Control-Allow-Origin: *");
  2. header('Access-Control-Allow-Credentials: true');
  3. header("Access-Control-Allow-Headers: *");
  4. header("Access-Control-Allow-Methods: *");
  5. header('Content-Type: application/json; charset=utf-8');
  6. $headers = getallheaders();
  7. $headers['X-Control_Property'] = 'X-Control_Property';
  8. ksort($headers);
  9. echo json_encode($headers, JSON_PRETTY_PRINT);
  10. die();

使用Postman一切都很好,因为授权正在成功发送:

但是我注意到服务器端的输出有点不同

由于某种原因,认证显然没有被发送。我在这个问题上坚持了很长一段时间,搜索了很多解决方案,并尝试了几乎所有我找到的方法,比如在package.json上设置代理,http-proxy-middleware的东西和不同的头配置组合,但我没有办法了。

mctunoxg

mctunoxg1#

从表面上看,这没有多大意义.
此外,在您的获取请求中,您已将crossDomain: true AFAIK设置为获取API的无效选项。参见https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
查看它,您应该将credentials设置为include,例如。

  1. fetch('https://localhost:8080/api/cart/current', {
  2. headers: {
  3. "Authorization": 'Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpZCI6MiwibmFtZSI6IlNyIENsaWVudGUiLCJlbWFpbCI6ImNsaWVudEBtYWlsLmNvbSIsImNyZWF0ZWQiOiIyMDIzLTEwLTExIDIwOjE1OjM1Iiwicm9sZSI6IkNMSUVOVCJ9.5m_IOjFa_DeTwzIeZk5adhQQY5O_PYrVpcR2StbwUas',
  4. 'Accept': 'application/json',
  5. 'Content-Type': 'application/json'
  6. },
  7. credentials: 'include', // Include credentials with the request
  8. method: 'GET'
  9. })

因此,您需要修改您的获取并使用HTTPS(SSL)进行承载身份验证以按预期工作。

相关问题