问题一:项目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. Perl CGI编程

    http://www.runoob.com/perl/perl-cgi-programming.html 什么是CGI CGI 目前由NCSA维护,NCSA定义CGI如下: CGI(Common Ga ...

  2. html 进度条

    <html> <head> <title>进度条</title> <style type="text/css"> .co ...

  3. in_array的三个参数

    needle 待搜索的值. haystack 待搜索的数组. strict 如果第三个参数 strict 的值为 TRUE 则 in_array() 函数还会检查 needle 的类型是否和 hays ...

  4. C#引用出错

    今天有朋友问我为什么自己引用了配置文件,但是还不能使用配置文件呢? 之后我查看他的项目,后来发现如下问题,并且总结引用文件流程如下: 引用文件的完整程序如下: 用配置文件举例 项目中的引用右击,然后点 ...

  5. Meta referrer标签的,可以防止CSRF的攻击

    Meta referrer标签的简要介绍 在某些情况下,出于一些原因,网站想要控制页面发送给 server 的 referer 信息的情况下,可以使用这一 referer metadata 参数. 参 ...

  6. flutter安装与配置 v1.2.1版本

    1---- 上面是下载地址https://flutter.dev/docs/development/tools/sdk/archive#windows 2---- 下载后,解压安装到C盘 3--- 测 ...

  7. Spring的一个入门例子

    例子参考于:Spring系列教材 以及<轻量级JavaEE企业应用实战> Axe.class package com.how2java.bean; public class Axe { p ...

  8. leecode第五十四题(螺旋矩阵)

    class Solution { public: vector<int> spiralOrder(vector<vector<int>>& matrix) ...

  9. PostCSS以及cssnext语法

    什么是postcss postcss 一种对css编译的工具,类似babel对js的处理,常见的功能如: 1 . 使用下一代css语法 2 . 自动补全浏览器前缀 3 . 自动把px代为转换成 rem ...

  10. Swift与JS的交互

    Swift与JS的交互 原理 同Object-C与JS交互的大同小异,只是方法形式改变了. 首先我们需要引入iOS7.0出来的JavaScriptCore.framework JavaScriptCo ...