简单设置,解决使用webpack前后端跨域发送cookie的问题

最近用vue来做项目,用webpack来做前端自动化构建。webpack-dev-server会在本地搭建一个服务器,在和后端调试的时候,就会涉及到跨域的问题。

刚开始时,没有用vue-cli来构建项目,而是参考了github上的vue-vueRouter-webpack来构建。看网上的资料,vue-cli可以通过配置代理来解决跨域的问题:

proxyTable: {
  '/list': {
    target: 'http://api.xxxxxxxx.com',
    changeOrigin: true,
    pathRewrite: {
      '^/list': '/list'
    }
  }
}

具体可以看这篇文章:Vue-cli proxyTable 解决开发环境的跨域问题

假如不用代理,那需要怎样设置呢?

最简单的方法是服务端将响就头设置成Access-Control-Allow-Origin:域名,如果客户端发送请求时,不需要携带cookie等信息,可以设置成Access-Control-Allow-Origin:*,表示任何域都可以向服务端发送请求,客户端不需要任何配置,就可以进行跨域调试了。

但是一般的网站,都需要向后端发送cookie来进行身份验证,此时,服务器还需向响应头设置Access-Control-Allow-Credentials:true,表示跨域时,允许cookie添加到请求中。设置Access-Control-Allow-Credentials:true后,要将Access-Control-Allow-Origin指定到具体的域,否则cookie不会带到客户端,例如设置成Access-Control-Allow-Origin:http://192.168.0.1:8088,http://192.168.0.1:8088是前端服务器的域名,这就要求用webpack的时候,要指定具体的域来启动,不要直接用localhost

要向后端发送cookie,前端也需要有相应的配置。我在项目中,引用了fetch的polyfill,直接用fetch来发送ajax请求,需要将credentials设置成include,表示允许跨越传递cookie,不要将credentials设置成same-origin,如果设置成same-origin,只会在同源的时候发送cookie。另外还要将withCredentials设为true。

jquery的设置如下:

xhrFields: {
    withCredentials: true
},
crossDomain: true,

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏机器学习实践二三事

Mac无法升级six, numpy等

OS 10.10以上,会出现你无法直接使用pip升级向six, numpy等,报错就是各种权限不够,加上sudo结果也一样,原因就是MacOS的系统完整性保护(...

2278
来自专栏听雨堂

制作iis自动安装包

一直没有提供可独立安装的 IIS 安装包,Windows 的缺省安装没有安装它,通常要到控制面板的“添加/删除 Windows 程序”中去选择安装。对于熟悉 W...

2075
来自专栏技术博文

YUM查询软件信息

我们常会碰到这样的情况,想要安装一个软件,只知道它和某方面有关,但又不能确切知道它的名字。这时yum的查询功能就起作用了。你可以用yum search keyw...

26410
来自专栏向治洪

github搭建个人网站

1. 注册账号: 地址: https://github.com/ 输入账号、邮箱、密码,然后点击注册按钮.  ? 2. 初始设置 注册完成后,选...

1928
来自专栏FreeBuf

安全扫描工具WVS Console版v1.1

由于工作关系,也与近期极度无聊有关,为此用批处理写了关于WVS的简便Console版工具(自然需要安装WVS) 首先,运行试试看吧。第一次运行可能会出现这个提示...

1708
来自专栏祥子的故事

工具篇 | 获取邮箱的登陆授权码

2705
来自专栏不止是前端

Vue:前后端数据联调

3449
来自专栏SpringBoot 核心技术

第二十三章:SpringBoot项目多模块打包与部署

1483
来自专栏Java技术分享

Jrebel6.3.3破解,配置图文教程

Jrebel6.3.3破解,配置图文教程 JRebel是个很好的开发工具,我在网上找了好久都没有找到很详细的教程,破解与配置教程千篇一律,步骤不详细。编写这篇教...

1899
来自专栏JavaWeb

原 Spring Boot-使用Sprin

1554

扫码关注云+社区