Question

我正在localhost上运行我的node / express js应用程序。我正在做一个＆＃39; GET＆＃39;请求Instagram＆＃39; s api并继续收到此错误：

XMLHttpRequest cannot load https://api.instagram.com/oauth/authorize/?client_id=******&redirect_uri=http://localhost:4000/feed&response_type=code. 
No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'http://localhost:4000' is therefore not allowed access.

我在我的服务器中发出这样的请求：

app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Headers: x-requested-with");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
});

app.get('/',function(req,res){
    res.redirect(redirected to feed route);
})

app.get('/feed',function(req,response) {    
    var code = req.query.code;
    var url = "https://api.instagram.com/oauth/access_token";
    var options = {
      url: url,
      method: "POST",
      form: {
        client_id : clientId,
        client_secret : client_secret,
        grant_type: 'authorization_code',
        redirect_uri: redirect_uri,
        code: code
      },
      json: true
    }

    request(options, function(err,res,body){
        var instagram_response = body;
        response.json({access_info:instagram_response});
    })
})

从访问＆＃39; /＆＃39;获取数据在我的服务器路由工作正常。当我打电话给服务器＆＃39; /＆＃39;在客户端的路线（当Gallery.html加载时）使用如下的jQuery它给我错误。下面是在客户端加载gallery.html时运行的函数。

$(function(){
    $.get("/", function( instagram_reponse, access_token) {
     access_token = instagram_reponse.access_token;
    })
})

我是否因为我的节点服务器在localhost上运行而收到此错误？我做错了什么？

Answer 1

您需要在节点上安装CORS包..

$ npm install cors

var express = require（＆＃39; express＆＃39;），cors = require（＆＃39; cors＆＃39;），app = express（）;

app.use(cors());

app.get('/products/:id', function(req, res, next){
  res.json({msg: 'This is CORS-enabled for all origins!'});
});

app.listen(80, function(){
  console.log('CORS-enabled web server listening on port 80');
});

配置选项 来源：配置 Access-Control-Allow-Origin CORS标头。期待一个字符串（例如：＆＃34; http://example.com＆＃34;）。设置为true以反映请求源，由req.header定义（＆＃39; Origin＆＃39;）。设置为false以禁用CORS。也可以设置为一个函数，它将请求源作为第一个参数和一个回调（它需要签名错误[object]，允许[bool]）作为第二个参数。最后，它也可以是正则表达式（/example.com$/）或正则表达式数组和/或要匹配的字符串。

方法：配置Access-Control-Allow-Methods CORS标头。期待以逗号分隔的字符串（例如：＆＃39; GET，PUT，POST＆＃39;）或数组（例如：[＆＃39; GET＆＃39;，＆＃39; PUT＆＃39;，＆＃39; ; POST＆＃39;。]）

allowedHeaders：配置Access-Control-Allow-Headers CORS标头。期待逗号分隔的字符串（例如：＆＃39;内容类型，授权＆＃39;）或数组（例如：[＆＃39;内容类型＆＃39;，＆＃39;授权＆＃39;]）。如果未指定，则默认为反映请求的Access-Control-Request-Headers标头中指定的标头。

exposedHeaders：配置Access-Control-Expose-Headers CORS标头。期待以逗号分隔的字符串（例如：＆＃39;内容范围，X-Content-Range＆＃39;）或数组（例如：[＆＃39; Content-Range＆＃39;，＆＃39; X-内容范围＆＃39;]）。如果未指定，则不会公开自定义标头。凭据：配置Access-Control-Allow-Credentials CORS标头。设置为true以传递标题，否则将被省略。

maxAge：配置Access-Control-Allow-Max-Age CORS标头。设置为整数以传递标题，否则将被省略。

preflightContinue：将CORS预检响应传递给下一个处理程序。

有关详细信息https://www.npmjs.com/package/cors

，请参阅此处

客户端向服务器发出的GET请求给出错误No＆＃39; Access-Control-Allow-Origin＆＃39;

1 个答案: