Node+Express的跨域访问控制问题:Access-Control-Allow-Origin
问题一:项目A通过Ajax访问项目B的接口,获取json数据,项目B采用Node+Express技术栈。项目A可能遇到跨域访问控制问题。
问题二:vue-resource 能够跨域,一般使用jsonp,但是当需要发送大量的参数到服务器的时候,需要使用post请求.本文讲述跨域post请求,
问题三:报错如下:XMLHttpRequest cannot load http://localhost:7777/login. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.
解决方法:
服务器后端需要设置 Access-Control-Allow-Origin 为 *
解决代码如下:
var express = require('express');
var app = express();
//设置跨域访问
app.all('*', function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "X-Requested-With");
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();
});
app.use('/', index);
app.listen();
console.log('Listening on port 3000...');
Access-Control-Allow-Origin
浏览器的确发出了请求,只有当目标页面的response中,包含了 Access-Control-Allow-Origin 这个header,并且它的值里有我们自己的域名时,浏览器才允许我们拿到它页面的数据进行下一步处理。
前端Vue页面设置:
一定要设置 {emulateJSON: true},不然跨域不成功.
如果Web服务器无法处理编码为application/json的请求,你可以启用emulateJSON选项。启用该选项后,请求会以application/x-www-form-urlencoded作为MIME type,就像普通的HTML表单一样
this.$http.post('http://localhost:7777/login',data,{emulateJSON:true}).then(res =>
{
console.log(res.status,res.statusText);
alert("success");
},res=>{
console.log('error');
alert('error')
}
)
Node+Express的跨域访问控制问题:Access-Control-Allow-Origin的更多相关文章
- 解决NodeJS+Express模块的跨域访问控制问题:Access-Control-Allow-Origin
在一个项目上想用NodeJS,在前端的js(http://localhost/xxx)中ajax访问后端RestAPI(http://localhost:3000/….)时(Chrome)报错: XM ...
- vue+nodejs+express解决跨域问题
nodejs+express解决跨域问题,发现网上的大部分都是误导人,花了不少时间,终于弄懂了, 我在vue+nodejs+express+mongodb的项目里面,发现本地用vue代理正常调用远程的 ...
- 【windows 访问控制】七、window 访问控制编辑器(Access Control Editor)
window 访问控制编辑器(Access Control Editor) 右键(文件.目录.程序)>选择属性>安全>高级 进入访问控制编辑器
- Access control allow origin 简单请求和复杂请求
原文地址:http://blog.csdn.net/wangjun5159/article/details/49096445 错误信息: XMLHttpRequest cannot load http ...
- node作为中间层 —> 跨域请求java后台接口(使用http-proxy-middleware中间件)
情景:利用node的express 作为中间层,跨域调取java后台接口,由于java接口对session有判断,因此每次请求都必须在req的headers中需要带上cookie,否则接口报500错误 ...
- NODE中解决跨域请求的问题
1.Node Express 解决请求跨域请求 标签(空格分隔): 跨域 1是Access-Control-Allow-Origin 允许的域 2是Access-Control-Allow-Heade ...
- node下的跨域传递cookie
研究背景: 最近有一位朋友找工作,需要面试,涉及到面试就涉及面试题,于是我想起来鄙人之前面试被问到的一个跨域传递cookie的问题.搜索了相关资料,但自己不敲一下肯定是不足以让人信服的. 我用node ...
- 借助node实战JSONP跨域
一.前言: 浏览器安全是基于同源策略的.所谓同源策略就是三相同: 1.协议相同: 2.域名相同: 3.端口相同. 但,凡事都是有利弊,同源策略也导致了我们想用AJAX跨域请求,但NO!!为了规避这种限 ...
- vue-cli3.0+node.js+axios跨域请求session不一样的问题
一.问题重述 使用的是,前后端分离,前端vue+axios请求,后端使用node搭建服务端接口,遇到的问题是,我通过登录接口吧数据存储型在session,我登录上以后,发现再次验证登录(另一个接口)的 ...
随机推荐
- [转载]error while loading shared libraries的解決方法
转自:https://blog.csdn.net/dumeifang/article/details/2963223 error while loading shared libraries的解決方法 ...
- 【译】第43节---EF6-自定义约定
原文:http://www.entityframeworktutorial.net/entityframework6/custom-conventions-codefirst.aspx Code-Fi ...
- 如何用R来定制个性化PPT
ReporteRs包可以创建word,ppt,html文档.它可以格式化R的输出:如可编辑的矢量图,复杂的表格报告功能,企业模板文档的重用(.docx和.pptx).它是一个很好的自动化报告工具,并且 ...
- node.js模块本地代理模块(将自己本机/局域网)服务 代理到外网可以访问
npm 模块 localtunnel模块可以. lt --port 7000 其中7000是本地服务端口 会分配一个动态的url. 局域网中查看本地ip用ifconfg 或者在系统偏好设置里面查看网 ...
- sublime3 mac : Package Control There are no packages available for installation
如下问题: 查看控制台:点击 ctrl+`打开控制台 发现是因为http://packagecontrol.io/channel_v3.json 获取失败,手动下载channel_v3.json文件, ...
- ege demo
#include <ege.h> const float base_speed = 0.5f; const float randspeed = 1.5f; //自定义函数,用来返回一个0 ...
- jsp导入数据库数据写法(模板)
1.导入表格模板 <%@ page language="java" contentType="text/html; charset=utf-8" page ...
- Anroid 搭建Maven私服(Android Studio)
一.场景 ① 公司中有多个项目,多人开发,开发中的某一模块需要被其他几个项目的模块所依赖,最简单粗暴的方式就是打包成aar或者jar文件逐个拷贝到libs下进行依赖,可是这种方式太过于麻烦,而且需要每 ...
- Android的数据的存储方式
数据的存储方式,总的来说分为三种: ① 文件存储: * SharedPreferences存储 * SD卡存储 ---- Environment * 数据库存储 ---- SQLite .MySQL. ...
- Python 新建程序
1.建立一个新的文件夹 2.建一个包 3.建一个程序项目 4.默认模板配置