如何启用AngularJs CORS [英] How to enable CORS in AngularJs

问题描述

我已经创建使用JavaScript的Flickr图片搜索API的演示。
现在我将其转换为AngularJs。
我已经搜索互联网上，下面配置中找到。

I have created a demo using JavaScript for Flickr photo search API. Now I am converting it to the AngularJs. I have searched on internet and found below configuration.

配置：

myApp.config(function($httpProvider) {
  $httpProvider.defaults.useXDomain = true;
  delete $httpProvider.defaults.headers.common['X-Requested-With'];
});

服务：

myApp.service('dataService', function($http) {
    delete $http.defaults.headers.common['X-Requested-With'];
    this.flickrPhotoSearch = function() {
        return $http({
            method: 'GET',
            url: 'http://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=3f807259749363aaa29c76012fa93945&tags=india&format=json&callback=?',
            dataType: 'jsonp',
            headers: {'Authorization': 'Token token=xxxxYYYYZzzz'}
         });
     }
});

控制器：

myApp.controller('flickrController', function($scope, dataService) {
        $scope.data = null;
        dataService.flickrPhotoSearch().then(function(dataResponse) {
            $scope.data = dataResponse;
            console.log($scope.data);
        });
    });

但我仍得到了同样的错误。
这里有一些链接我尝试：

But still I got the same error. Here are some links I tried:

XMLHtt prequest无法加载URL。原产地不是由访问控制允许来源允许

<一个href=\"http://samurails.com/tutorial/cors-with-angular-js-and-sinatra/\">http://samurails.com/tutorial/cors-with-angular-js-and-sinatra/

编辑：

我的Node.js创建一个代理服务器上@Quentin的建议：

I created a proxy server in node.js on suggestion of @Quentin:

var http = require('http');
var url = require('url');
var fs = require('fs');
var server;

server = http.createServer(function (req, res) {
    // your normal server code
    var path = url.parse(req.url).pathname;
    fs.readFile(__dirname + path, function (err, data) {
        if (err) {
            return send404(res);
        }
        res.writeHead(200, {'Content-Type':path == 'json.js' ? 'text/javascript' : 'text/html'});
        res.write(data, 'utf8');
        res.end();
    });
}),
server.listen(8001);
//using express to load customizes static files
var express = require("express"),
    app = express();

app.all("/api/*", function (req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Cache-Control, Pragma, Origin, Authorization, Content-Type, X-Requested-With");
    res.header("Access-Control-Allow-Methods", "GET, PUT, POST");
    return next();
});
app.use("/js", express.static(__dirname + '/js'));
app.listen(3001);

最后修改

我删除了Authorization头

I removed the Authorization header

标题：{'授权'：'令牌令牌= xxxxYYYYZzzz'}

，它是正常的运行。我已经得到了我想要的东西。
感谢大家参与这个问题。

and it is running alright. I have got what I wanted. Thanks everyone for participation in this question

推荐答案

您没有。服务器你正在请求必须实现CORS从您的网站的访问给予的JavaScript。你的JavaScript不能授予本身权限访问其他网站。

You don't. The server you are making the request to has to implement CORS to grant JavaScript from your website access. Your JavaScript can't grant itself permission to access another website.

这篇关于如何启用AngularJs CORS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！