GET调用Rest API的问题 [英] Problems with GET call to rest API

问题描述

我第一次使用angularJs，我会做一个非常简单的事情，但是我不知道我做错了什么。我将代码保存在本地环境中，并且该API处于网络上（我使用免费工具创建了一个简单的API）。

I am using, for the first time, angularJs and I would do a thing very simple, but I don't know what I wrong. I have my code in my local env and the API is on web (I used free tool to create a simple API).

我创建了以下简单的API： http://www.mocky.io/v2/5a1fedce310000221bc0b08b

I created this simple API: http://www.mocky.io/v2/5a1fedce310000221bc0b08b

返回：

{"id" : 1, "name" : "France - Mainland", "desc": "some description" },
{"id" : 2, "name" : "Gibraltar", "desc": "some description"},
{"id" : 3, "name" : "Malta", "desc": "some description"}

现在我有我的应用了.js

Now I have my app.js

(function () {
'use strict';

angular.module('test', []).controller('DemoCtrl', function ($scope, $http) {
    $scope.selectedTestCountry = null;
    $scope.testCountries = [];


    $http({
            method: 'GET',
            url: 'http://www.mocky.io/v2/5a1fede63100005d1ec0b08f',
            data: { someId: 3 }

        }).then(function (result) {
            $scope.testAccounts = result;

        }).catch(function (err) { 
            $scope.error = err}
    );
});
})()

问题是，在拨打电话时，错误。

The problem is, when the call is made, I got an error.

从Chrome出现此错误：

From Chrome I got this error:

1. 无法加载资源：服务器响应状态为403（禁止）


2. 所请求的资源上没有 Access-Control-Allow-Origin标头。因此，不允许访问原始 null。响应的HTTP状态代码为403。

我读了一些建议更改浏览器的内容，例如使用FF。

I read something that suggest to change browser, for example use FF.

但是在FF中我还有另一个错误：

But in FF I have an other error:

Bloccata richiesta multiorigine（cross-origin）：il criterio di corrispondenza dell'origine未经许可，请在 http://www.mocky.io/v2/5a1fede63100005d1ec0b08f。 Motivo：标头CORS访问控制允许来源 mancante。 （抱歉是意大利语，但这意味着CORS会出现问题）

Bloccata richiesta multiorigine (cross-origin): il criterio di corrispondenza dell’origine non consente la lettura della risorsa remota da http://www.mocky.io/v2/5a1fede63100005d1ec0b08f. Motivo: header CORS "Access-Control-Allow-Origin" mancante. (sorry is in italian, but it means there are some issue with CORS)

最后，如果我在catch中打印错误，我会得到：

In the end, if I print the error in catch, I got this:

{"data":null,"status":-1,"config":{"method":"GET","transformRequest":[null],"transformResponse":[null],"jsonpCallbackParam":"callback","url":"http://www.mocky.io/v2/5a1fede63100005d1ec0b08f","data":{"applicationId":3},"headers":{"Accept":"application/json, text/plain, */*"}},"statusText":"","xhrStatus":"error"} 

请帮助我。

谢谢

推荐答案

由于域不同而出现Access-Control-Allow-Origin。可能是您在 http：// localhost 或 http://127.0.0.1

Access-Control-Allow-Origin appears due to different domains. may be you are running app on http://localhost or http://127.0.0.1

此域与 http://www.mocky.io/ ，因此它阻止了该请求。

this domain is different than http://www.mocky.io/ hence it blocks the request.

要解决此问题，您应检查 https://stackoverflow.com/a / 38112602/1006780

to fix this you should check https://stackoverflow.com/a/38112602/1006780

我也注意到这是一个月前修复的> https://github.com/julien-lafont/Mocky/issues/13#issuecomment-338432249

also i notice that this is fixed a month ago https://github.com/julien-lafont/Mocky/issues/13#issuecomment-338432249

这篇关于GET调用Rest API的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！