Vue+NodeJS的跨域请求如何保存session
来源:互联网 发布:刚毕业的程序员工资 编辑:程序博客网 时间:2024/06/08 17:36
今天一直在练习如何使用Vue
,就把自己之前用node
写的个人博客改改,拿来当接口,涉及到跨域请求的问题,接下来简单的说下自己所遇到的问题,和解决方法。
一. 用cors来实现跨域请求:
一想到跨域请求,脑子里首先出现的是jsonp
,但是jsonp
只能是get
请求,在向后台提交数据时显然用ge
t是不合适的,所以选择用cors
,用cors
时后台要实现相关的配置,如下:
var app = express(); //express框架//设置跨域访问 app.all('*', function(req, res, next) { res.header('Access-Control-Allow-Origin', "*"); res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS"); res.header("X-Powered-By",' 3.2.1'); res.header("Content-Type", "application/json;charset=utf-8"); next(); });
上面的设置就不一一解释了,我想根据每个字段的值,应该都知道是干什么的,特别强调下:res.header('Access-Control-Allow-Origin', "*");
,这样设置允许所有的域,如果将*
号改为指定的域,则表明只允许特定的域。
二. 如何来存session?
因为我用的是vue-resource
插件,所以在每次跨域请求后台时都是一个新的session
,那么如何来保存我们的session呢?当然是要打开cookie了,这样才能保证每次的session都不是新的。
了解cors
的都知道,在后台如果要允许提交cookie
的话,要设置:Access-Control-Allow-Credentials:true
,这样后端才会接收前端发来的cookie
,所以将后台的跨域请求设置改一下就行了:
//将外源设为指定的域,比如:http://localhost:8080res.header('Access-Control-Allow-Origin', "http://localhost:8080");//将Access-Control-Allow-Credentials设为trueres.header('Access-Control-Allow-Credentials', true);
当然只允许后台接收cookie是不够的,必须得有人发送cookie啊,所以前端的请求头信息也是要变的,加上:withCredentials: true
就可以了。
以用户登录为例:
submit: function (){ this.$http.post(this.url, { username: this.username, userpass: this.userpass },{ withCredentials: true //打开cookie }).then( res => { console.log(res); if (res.body.result == 'ok'){ this.$router.push({path: '/home'}); } }).catch( error => { console.log(error); }); }
就这样简单的设置一下就可以了,这也是第一次对cors的应用,希望对初学的你也有帮助!
阅读全文
0 0
- Vue+NodeJS的跨域请求如何保存session
- 解决跨域 ajax 请求 服务器端 session 不能保存问题
- nodejs跨域请求
- vue跨域的session问题
- vue跨域请求
- Vue跨域请求
- Vue 跨域请求的解决办法
- NodeJs如何处理请求的路由
- vue前后端分离使用fetch 跨域请求时 session失效问题解决
- jsonp 跨域请求 VUE
- Vue-cli创建的项目跨域请求
- NodeJS如何发送HTTPS请求
- NodeJS如何发送HTTPS请求
- 如何使用nodejs提交表单方式的post请求?
- 如何屏蔽nodejs里的/favicon.ico请求
- vue开发:VUE axios发送跨域请求需要注意的问题
- NodeJS+ExpressJS解决跨域请求CORS
- Nodejs Express Ajax跨域请求
- FPGA学习网站推荐
- 原生ajax上传多图然后显示
- 浅谈zk(3).领导者与追随者如何协作?
- Codeforces Gym
- 我的博客地址
- Vue+NodeJS的跨域请求如何保存session
- [编程之美-15]输入一颗二元查找树将该树转换为它的镜像
- 实习两周来的体验
- Python::判断语句流程控制
- rtop 通过 SSH 监控远程主机
- [算法与数据结构]
- python数据分析与展示(三)
- 滑雪(DP+搜索)
- kendoGrid选中行信息