zoukankan      html  css  js  c++  java
  • AJAX 跨域 :Access-Control-Allow-Origin

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

    XMLHttpRequest cannot load http://localhost:3000/auth/xxx/xxx. Originhttp://localhost is not allowed by Access-Control-Allow-Origin.

    本地测试解决方案:

    1. 使用Chrome插件:Allow-Control-Allow-Origin: *
    2. 为Chrome浏览器添加启动属性:   --disable-web-security

    jQuery解决方案:

    使用 Ajax Cross Origin - jQuery plugin ajax跨域请求 

    NodeJS解决方案:

    • 方案一:Express
    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.get('/auth/:id/:password', function(req, res) {
    res.send({id:req.params.id, name: req.params.password});
    });

    app.listen(3000);
    console.log('Listening on port 3000...');
    var express = require('express');
    var app = express();

    app.get('/auth/:id/:password', function(req, res) {
    res.header("Access-Control-Allow-Origin", "*"); //设置跨域访问
    res.send({id:req.params.id, name: req.params.password});
    });

    app.listen(3000);
    console.log('Listening on port 3000...');

    参考: 
    http://m.blog.csdn.net/blog/marujunyy/8852017 
    http://www.tuicool.com/articles/vYBR3y

    • 方案二:
    var http=require("http");
    var server=http.createServer(function(req,res){
    if(req.url!=="/favicon.ico"){
    res.writeHead(200,{"Content-Type":"text/plain","Access-Control-Allow-Origin":"http://localhost:1234"});
    res.write("你好啊!");
    }
    res.end();
    });
    server.listen(3000,"localhost",function(){
    console.log("开始监听...");
    });
    var http=require("http");
    var server=http.createServer(function(req,res){
    if(req.url!=="/favicon.ico"){
    //res.writeHead(200,{"Content-Type":"text/plain","Access-Control-Allow-Origin":"http://localhost:1234"});
    res.statusCode=200;
    res.sendDate=false;
    res.setHeader("Content-Type","text/plain");
    res.setHeader("Access-Control-Allow-Origin","http://localhost:63342");
    res.write("你好啊!");
    }
    res.end();
    });
    server.listen(3000,"localhost",function(){
    console.log("开始监听...");
    });

    参考: 
    http://www.jb51.net/article/57874.htm

  • 相关阅读:
    Java用户自定义函数
    JavaScript常用函数
    Javascript 流程控制
    Javascript基础
    CSS的继承和使用方式
    Python列表
    Python变量和简单数据类型
    CSS选择符
    CSS的基本语法
    Java环境变量搭建
  • 原文地址:https://www.cnblogs.com/blog-leo/p/4769924.html
Copyright © 2011-2022 走看看