问题一:项目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的更多相关文章

  1. 解决NodeJS+Express模块的跨域访问控制问题:Access-Control-Allow-Origin

    在一个项目上想用NodeJS,在前端的js(http://localhost/xxx)中ajax访问后端RestAPI(http://localhost:3000/….)时(Chrome)报错: XM ...

  2. vue+nodejs+express解决跨域问题

    nodejs+express解决跨域问题,发现网上的大部分都是误导人,花了不少时间,终于弄懂了, 我在vue+nodejs+express+mongodb的项目里面,发现本地用vue代理正常调用远程的 ...

  3. 【windows 访问控制】七、window 访问控制编辑器(Access Control Editor)

    window 访问控制编辑器(Access Control Editor) 右键(文件.目录.程序)>选择属性>安全>高级   进入访问控制编辑器

  4. Access control allow origin 简单请求和复杂请求

    原文地址:http://blog.csdn.net/wangjun5159/article/details/49096445 错误信息: XMLHttpRequest cannot load http ...

  5. node作为中间层 —> 跨域请求java后台接口(使用http-proxy-middleware中间件)

    情景:利用node的express 作为中间层,跨域调取java后台接口,由于java接口对session有判断,因此每次请求都必须在req的headers中需要带上cookie,否则接口报500错误 ...

  6. NODE中解决跨域请求的问题

    1.Node Express 解决请求跨域请求 标签(空格分隔): 跨域 1是Access-Control-Allow-Origin 允许的域 2是Access-Control-Allow-Heade ...

  7. node下的跨域传递cookie

    研究背景: 最近有一位朋友找工作,需要面试,涉及到面试就涉及面试题,于是我想起来鄙人之前面试被问到的一个跨域传递cookie的问题.搜索了相关资料,但自己不敲一下肯定是不足以让人信服的. 我用node ...

  8. 借助node实战JSONP跨域

    一.前言: 浏览器安全是基于同源策略的.所谓同源策略就是三相同: 1.协议相同: 2.域名相同: 3.端口相同. 但,凡事都是有利弊,同源策略也导致了我们想用AJAX跨域请求,但NO!!为了规避这种限 ...

  9. vue-cli3.0+node.js+axios跨域请求session不一样的问题

    一.问题重述 使用的是,前后端分离,前端vue+axios请求,后端使用node搭建服务端接口,遇到的问题是,我通过登录接口吧数据存储型在session,我登录上以后,发现再次验证登录(另一个接口)的 ...

随机推荐

  1. communication

    Always consider the challenge as a chance. Basic principles: Know your audience. Know your purpose. ...

  2. Use Memory Layout from Target Dialog Scatter File

    参考 MDK-ARM Linker Scatter File的用法(转载) keil报错 Rebuild target 'Target 1' assembling test1.s... linking ...

  3. Tomcat 跨域问题的解决

    先下载CORS对应的Jar: 下载链接: https://download.csdn.net/download/u010739157/10565169 在tomcat的Web.xml中加上如下配置: ...

  4. 自定义标签TLD文件中,rtexprvalue子标签的意思

    rtexprvalue的全称是 Run-time Expression Value, 它用于表示是否能够利用JSP表达式. 举例子: 1.定义一个TLD文件: <tag> <name ...

  5. angular在组件中选择dom元素

    想选择 在组件中选择自己template里的dom元素,要使用ElementRef.     import { Component, EventEmitter, HostListener, OnIni ...

  6. Python pip 常用命令

    使用了这么就pip命令,但是一直是简单使用,很多命令都是用了查,查了用,今天把常用的命令汇总一下,方便使用. 命令: pip 由上图可以看到 pip 支持一下命令 Commands: install ...

  7. lua中的闭包概念的学习笔记

    1.闭包的由来: 个人理解,lua中之所以出现闭包的概念,完全是因为lua中允许函数的嵌套定义,并且在内嵌函数中使用了外包函数中定义的局部变量,例如c.c#就不允许函数的嵌套定义(但是允许函数的嵌套调 ...

  8. 雷林鹏分享:使用 CSS 显示 XML

    使用 CSS 显示 XML 通过使用 CSS(Cascading Style Sheets 层叠样式表),您可以添加显示信息到 XML 文档中. 使用 CSS 显示您的 XML? 使用 CSS 来格式 ...

  9. H3C S6800交换机 BCM shell命令

    H3C S6800交换机 BCM shell命令 http://wgli978.blog.163.com/blog/static/13592877220172315858831/ <H3C> ...

  10. 圆的变化(自定义动画,及自定义UI)

    之前在面试的时候被问到过一个问题,如何实现一个圆沿着一条线由大到小 当时回答的含糊不清,现在已经明白怎么去实现 关键点:Paint,path,canvas 一种方法 在activity中去控制圆的x, ...