Read json via http by angularjs

Question

Read json via http by angularjs

Navigation

#1 by (1 votes)
#2 by (1 votes)
#3 by (0 votes)

0

I'm trying to read with an AngularJS / Phonegap application an HTTPS address that returns me a JSON ( link ). I'm getting this error:

XMLHttpRequest can not load link . Response to preflight request does not pass access control check: In 'Access-Control-Allow-Origin' header is present on the requested resource. Origin ' link ' is therefore not allowed access. The response had HTTP status 404.
angular.js:14700 Possibly unhandled rejection: {"data":null,"status":-1,"config":{"method":"GET","transformRequest":[null],"transformResponse":[null],"jsonpCallbackParam":"callback","headers":{"Access-Control-Allow-Origin":"*","Access-Control-Allow-Methods":"GET, POST, PUT, DELETE, OPTIONS","Access-Control-Allow-Headers":"Content-Type, X-Requested-With","Access-Control-Allow-Credentials":true,"Accept":"application/json, text/plain, */*"},"url":"https://gestormegaclube.com.br/api/app/v1/parceiros"},"statusText":"","xhrStatus":"error"}

I think this is not a block on the server because, using PostMan ( link ) it returns me the information, I already used several header different and nothing works.

.controller('MainController', function($scope, $http){
  $http.get("https://gestormegaclube.com.br/api/app/v1/parceiros", {
    headers: {
      'Access-Control-Allow-Origin': '*',
      'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
      'Access-Control-Allow-Headers': 'Content-Type, X-Requested-With',
      'Access-Control-Allow-Credentials':  true
    }
  }).then(function(response) {
    $scope.data = response.data;
  });
});

Maybe it's because I'm in localhost, does anyone know how to get around this?

javascript angularjs json

asked by anonymous 29.08.2017 / 14:49

3 answers

Send To Menu from Windows, sending File Path [closed] Error returning StringStr

score 1 · Answer 1

In the Grid Stack Overflow you can find your solution here :
I made the request on my localhost and received the same error, this apparently it's CORS.
But in Postman it works (The postman and son of the devil)

GET request

function teste() {


        var config = {
            headers: {
                'Access-Control-Allow-Origin': 'http://192.168.88.101:3000',
                'Content-Type': 'application/json'
            }

        };


        return $http.get('https://gestormegaclube.com.br/api/app/v1/parceiros', config)
            .then(getAllComplete)
            .catch(getAllFailed);

        function getAllComplete(response) {

            console.log(response);

            return response.data;
        }

        function getAllFailed(error) {
            error.erro = true;
            return error;
        }

    }

My GET was as follows for the server (HEADERS):

OPTIONS /api/app/v1/parceiros HTTP/1.1
Host: gestormegaclube.com.br
Connection: keep-alive
Access-Control-Request-Method: GET
Origin: http://192.168.88.101:3000
User-Agent: Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) 
AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.101 Mobile 
Safari/537.36
Access-Control-Request-Headers: access-control-allow-origin
Accept: */*
Referer: http://192.168.88.101:3000/
Accept-Encoding: gzip, deflate, br
Accept-Language: pt-BR,pt;q=0.8,en-US;q=0.6,en;q=0.4

score 1 · Answer 2

The Access-Control-Allow-Origin must be defined on the server you are requesting.

This is a server security policy where you define which hosts / ips can access your services.

It is not who consumes the API, in case your app angularjs, which sets this setting.

UPDATE

Question : Why does postman get json?

Response : Because the security is the browser. The API server sends its security data to the Browser telling who can request its services, which verbs are allowed, which headers, and so on. Postman makes the request as a backend application and does not emulate an app in a browser.

score 0 · Answer 3

A brief explanation of why this happens.

I use this plugin for DEV when I can not edit the API server settings.

Moesif Origin & amp; amp; CORS Changer

Remembering that in production for hosts different, you must configure on the server of your API so that it "gives" access to the other server to consume the API.

I did not put code as it might vary a bit of technology.