egg.js+vue前后端分离项目，后端如何使用set-Cookie为前端设置cookie

前后端分离，必然涉及跨域。直接设置不行的。

网上看到很多设置方式比如 axios配置：withCredentials: true。然后后端采用cors ,添加Access-Control-Allow-Credentials：true。是不行的哈！

本人项目栈，egg.js + vue +axios+nginx 实现后端为前端设置cookie。

思路，消除跨域，只有从本质上解决跨域问题，后端才能为前端设置cookie，这个没价讲~

操作如下：vue:8080 egg:7001

nginx配置如下：

 server {listen 80;client_max_body_size 8m;server_name www.test.com;location / {proxy_pass http://127.0.0.1:8080;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Real-Port $remote_port;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;}location /api {proxy_pass http://127.0.0.1:7001;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Real-Port $remote_port;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;}}

重启：nginx

taskkill /f /im nginx.exe

start nginx

接下来前端直接www.test.com可以访问。（如果是本地环境，需要配置host哈 127.0.0.1 www.test.com）

但是后端输入www.test.com/api发现404 not found。

此时需要在后端配置访问前缀：如下

直接请求：

restful api方式

反正是以api开头就可以请求到后端去了。当然如果ngixn配置的目录是serverxxx。那么前缀就应该是serverxxx，这个不多说。

至于后端egg.js 中cors的配置，可以看到不用过多配置，withCredentials: true都不用设置的，因为已经在一个域名下了。

接下来就可以愉快的后端设置cookie了

 ctx.cookies.set("token", '13213123', {httpOnly: true, // 默认就是 truemaxAge: 0.5 * 3600 * 1000,//有效时间 30分钟overwrite: true,//设置 key 相同的键值对如何处理signed: true,//签名encrypt: true, // 加密传输});

egg.js+vue前后端分离项目，后端如何使用set-Cookie为前端设置cookie相关推荐

tomcat vue 不用前后端_部署前后端分离项目(后端 tomcat 前端 nginx)
关键词 spring-boot gradle 腾讯云 tomcat nginx vue 前后端分离代理前言因为种种原因,把后端部署在 tomcat,前端项目部署在 nginx. Tomcat t ...
Java Web前后端分离项目—后端servlet实例
关与作者更多博客请访问云里云外开源社区文章目录一.闲谈二.json字符串的接受和发送 json的发送 json的接收三.内网穿透或服务上云服务器四.跨域背景(为什么) 如何跨域五.对接出 ...
前后端分离项目后端向前端返回压缩包的方法实现java版
最近公司的项目是让前端有让用户下载zip压缩包(里面都是图片,图片是保存在ftp上的)的任务,经过调研,将最终方案复制在下面: //zip文件的下载@GetMapping("/zip/{im ...
(五)Debian Linux中部署Spring Boot + Vue的前后端分离项目详细过程(arm64/aarch64架构下)
专题系列往期文章目录 (一)移动端安卓手机改造成linux服务器&Linux中安装软件踩坑历险记 (二)Debian Linux系统中安装oracle JDK1.8详细过程(arm64/aar ...
阿里服务器部署springboot+vue前后端分离项目
服务器部署springboot+vue前后端分离项目最近刚刚在实习熟悉公司的业务,所有尝试着自己将项目部署到服务器上.本次部署的项目是Spring Boot+Vue前后端分离项目,后端使用的技术有M ...
前后端分离项目部署（服务器或本地）
文章目录前后端分离项目部署(服务器或本地) 前端部署(以vue项目为例) 后端部署(以Springboot项目为例) 补充前后端分离项目部署(服务器或本地) 前端部署(以vue项目为例) 部署环境 ...
php node.js django,Vue.js和Django搭建前后端分离项目示例详解
本篇文章主要介绍了Django+Vue.js搭建前后端分离项目的示例,具有一定参考价值,有兴趣的可以了解一下在写这篇文章的时候,顺带学习了一下关于Markdown的使用方法. 笔者是个渣渣,一切都是 ...
Win10环境前后端分离项目基于Vue.js+Django+Python3实现微信(wechat)扫码支付流程(2021年最新攻略)
原文转载自「刘悦的技术博客」https://v3u.cn/a_id_182 之前的一篇文章:mpvue1.0+python3.7+Django2.0.4实现微信小程序的支付功能,主要介绍了微信小程序内 ...
Win10环境前后端分离项目基于Vue.js+Tornado+Python3实现微信(wechat)扫码支付流程
在生活具有广泛性.高效性.使用方便性的支付方式是扫码支付,扫码的优点在于推广成本低,上至钓鱼台国宾馆,下至发廊地摊都能用,打印出来就完事了,而相比其他支付方式,现金的找零及假钞问题,信用卡的办理门槛. ...
【两万字图文详解】运动会管理系统-前后端分离-项目开发：【后端】SpringBoot, SpringMVC, MyBatis【前端】Vue.js，ElementUI
项目名称:运动会管理系统技术栈: 后端:SpringBoot,SpringMVC,MyBatis,tkmapper,Maven聚合工程等前端:Vue.js,Element-u ...

egg.js+vue前后端分离项目，后端如何使用set-Cookie为前端设置cookie

egg.js+vue前后端分离项目，后端如何使用set-Cookie为前端设置cookie相关推荐

最新文章

热门文章