Question

vue + axios前端不会在请求标头中将cookie发送到我的php服务器。

我正在尝试将旧项目移至新服务器。我对项目架构进行了一些优化，并且在我的本地Docker环境中运行得很好。当我将其移至生产环境时发生了一些问题。每边有两个域。前端为admin.example.com，后端为serve.example.com。我在服务器代码中手动将cookie_path设置为/，将cookie_domain设置为.example.com。前端在后端响应标头中获得了预期的set-cookie。但是前端不会在每个下一个请求中将cookie发送到后端。因此无法保持登录状态。

const service = axios.create({
  baseURL: process.env.BASE_API,
  timeout: 15000,
  withCredentials: true,
  transformRequest: [function (data) {
    let ret = ''
    for (let it in data) {
      ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
    }
    return ret
  }],
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded'
  }
})

// code
session_set_cookie_params(
            C('COOKIE_EXPIRE'),
            C('COOKIE_PATH'),
            C('COOKIE_DOMAIN'),
            C('COOKIE_SECURE'),
            C('COOKIE_HTTPONLY')
);
session_name(C('SESSION_NAME'));

// config

'SESSION_NAME'          => 'xxxxx',

'COOKIE_EXPIRE'         =>  3600,
'COOKIE_DOMAIN'         =>  '.example.com',
'COOKIE_PATH'           =>  '/',
'COOKIE_PREFIX'         =>  '',
'COOKIE_SECURE'         =>  false,
'COOKIE_HTTPONLY'       =>  false,

响应标头如下：

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:DNT,X-Token,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type, Accept-Language, Origin, Accept-Encoding
Access-Control-Allow-Methods:GET, POST, OPTIONS, DELETE
Access-Control-Allow-Origin:http://admin.example.com
Set-Cookie:beb257200166c10f69c4667d621785f7=9m7e9lonmjtvh06fn3fi0nul71; expires=Thu, 08-Aug-2019 13:29:29 GMT; Max-Age=3600; path=/; domain=.example.com
X-Content-Type-Options:nosniff

预期结果：浏览器在每个请求中发送cookie，以便可以保持登录状态。

实际结果：尚未发送Cookie。浏览器在每个请求中都有不同的会话密钥。

Answer 1

我刚刚发现我昨晚犯了一个愚蠢的错误。我和我的朋友正在与这个项目合作。他在我们的前端服务器上部署了前端代码。这就是为什么浏览器从不向请求标头中的后端发送cookie的原因，无论我在前端和后端都做了什么。在这种情况下，您只需要做两件事。

在后端响应标头中发送“ Access-Control-Allow-Credentials：true”和“ Access-Control-Allow-Origin：frontend_domain”。请注意，在这种情况下，不允许将Access-Control-Allow-Origin设置为*。
在axios配置中设置“ withCredentials：true”。此项的默认值为false。这是启用axios在cors请求中发送cookie的设置。 You can get more information here

将Cookie发送到服务器时遇到问题

1 个答案: