vue项目部署后，js-cookie的domain属性设置无效，无法登录

Question

1.问题描述

1. 在开发环境中，使用js-cookie设置如下，本地环境可以实现cookie携带token实现单点登录

        submitLogin(){
          // 第一步：调用接口进行登录，返回token字符串
              loginApi.submitLoginUser(this.user)
                .then(response => {
                  this.message = response.data.message

                  //判断一下被试是否输入了合法的账户和密码
                  var reg =  RegExp(/全局/)
                  if(response.data.code == 20001 && response.data.success == true){
                      if(response.data.message.match(reg)){
                        this.open1()
                      }else{
                        this.open2()
                      }
                  }else{
                    //第二步：把token存在cookie中、也可以放在localStorage中
                        //1.调用cookie的方法set，放对象；
                        //2.三个参数：cookie名字 cookie值 作用域
                      cookie.set('cnu_token', response.data.data.token, { domain: 'localhost' })
                      //第三步:创建拦截器,把cookie值放进header中
                      //第四步:调用后端接口,根据token获取用户信息
                      loginApi.getLoginUserInfo()
                        .then(response => {
                        this.loginInfo = response.data.data.userInfo
                        //将返回的用户信息,也放入cookie
                        cookie.set('cnu_ucenter', this.loginInfo, { domain: 'localhost' }) 
                        //跳转页面
                        window.location.href = "/";
                    })
                    .catch(error => {//请求失败
                      console.log(error)
                    })
                  }        
              })
        },

1. 但是部署阿里云后，将domain的代码改成如下域名，却无法实现登录

else{
                    //第二步：把token存在cookie中、也可以放在localStorage中
                        //1.调用cookie的方法set，放对象；
                        //2.三个参数：cookie名字 cookie值 作用域
                      cookie.set('cnu_token', response.data.data.token, { domain: 'cnu.cool' })
                      //第三步:创建拦截器,把cookie值放进header中
                      //第四步:调用后端接口,根据token获取用户信息
                      loginApi.getLoginUserInfo()
                        .then(response => {

                        this.loginInfo = response.data.data.userInfo
                        //将返回的用户信息,也放入cookie
                        cookie.set('cnu_ucenter', this.loginInfo, { domain: 'cnu.cool' }) 
                        //跳转页面
                        window.location.href = "/";
                    })
                    .catch(error => {//请求失败
                      console.log(error)
                    })
                  }

2.可以与接口进行通信

输错密码会提示,从接口返回的"密码错误"提示,输错账号会从后端返回"账号错误"的提示,可以确定与后端确实是进行了通信

3.端口号

该项目的端口号是83,即cnu.cool:83可以访问,并且能够成功的打开网站,就是没办法成功的登录

4.项目框架

项目使用的是nuxt服务端渲染技术

5.看网上有说关于nginx跨域不携带cookie导致,但是目前的项目并没有跨域名,都在统一域名中进行

6.有说域名前需要加'.',来代表该域名和子域名,这个也试过了,但是不行

若那位哥哥姐姐有过前端的经验,请速来救小弟

Answer 1

首先你先确保你的域名备案了，其次你访问网站是通过cnu.cool:83访问的把domain的值改成cnu.cool:83