Angular 1 reading JSON cross-domain

Question

Angular 1 reading JSON cross-domain

Navigation

#1 by (1 votes)

1

I'm having a little problem with angular and wondered if anyone can help me, I was asked the following task to make a shelf from the products of an external JSON (where you have all the info of each product).

const API_URL = '/caminho/para/JSON.json';
var app = angular.module('root', []);
app.controller('testCtrl', function($scope, $http){
  $http({
  method: 'JSONP',
    url: API_URL
  }).then(function (success){
    $scope.content = "Something went right";
   },function (error){
    $scope.content = "Something went wrong";
   });
});

<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.min.js"></script></head><body><divclass="container" ng-app="root">
  <h1 ng-controller="testCtrl">
    {{content}}
  </h1>
</div>
</body>
</html>

< - JSON STRETCH - >

[
  {
    "productId": "2000646",
    "productName": "Fitnow T-Shirt loja-teste - Feminino",
    "brand": "loja-teste",
    "categoriesIds": [
        "/104/72/",
        "/104/",
        "/104/267/"
    ],
    "gender": [
        "female"
    ],
    "age_group": [
        "adult"
    ],
    "Atributos Google": [
        "gender",
        "age_group"
    ],
    "items": [
        {
            "itemId": "24121",
            "name": "| PRETO - P",
            "nameComplete": "Fitnow T-Shirt loja-teste - Feminino | PRETO - P",
            "ean": "78993232323",
            "referenceId": [
                {
                    "Key": "RefId"
                }
            ],
            "Cor": [
                "Preto e Verde"
            ],
            "Tamanho": [
                "P"
            ],
            "variations": [
                "Cor",
                "Tamanho"
            ],
        },
    ]
  },
]

I can not get it to read any data from this JSON, nor does it appear to load because when it runs it only appears to have given something wrong by my scope. That's another problem I'm having I'm not getting very well referencing the lines of this JSON which is complicating me a lot.

Does anyone have any light for this problem?

javascript jquery angularjs html5 json

asked by anonymous 12.08.2017 / 06:17

1 answer

Equivalent to sql function LEFT () in JPA Shopping cart item is not removed

score 1 · Accepted Answer

You need to send headers in your $http service:

$http({
    method: 'JSONP',
    url: API_URL,
    headers: {
        Content-Type: "application/json"
        // Você pode precisar da autorização também
        //Authorization: token  
    }
}).then(function ( success ){
    $scope.content = "Something went right";
},function ( error ){
    $scope.content = "Something went wrong";
});

Make sure that the server to which you make requests has CORS > configured ( Access-Control-Allow-Origin: * , eg).