web-dev-qa-db-fra.com

Demande $ http inter-domaines AngularJS

J'ai un site Web simple que je construis avec AngularJS qui appelle une API pour les données json.

Cependant, je reçois un problème d'origine interdomaine.

Erreur:

XMLHttpRequest ne peut pas se charger http://api.nestoria.co.uk/api?country=uk&pretty=1&action=search_listings&place_name=soho&encoding=json&listing_type=rent . Aucun en-tête "Access-Control-Allow-Origin" n'est présent sur la ressource demandée. L'origine 'http: // localhost' n'est donc pas autorisée à y accéder.

  searchByPlaceName: function() { 
        var url = baseurl+'country=uk&pretty=1&action=search_listings&place_name=london'+encoding+type;
         return $http.get(url);
    }
jsonangularjshttpcross-domain
12
Tom

Il paraît que api.nestoria.co.uk ne permet pas CORS. Il doit définir le Access-Control-Allow-Origin l'en-tête lui-même - vous n'avez aucun contrôle direct sur cela.

Cependant, vous pouvez utiliser JSONP. Ce site le permet via le paramètre de requête callback.

$http.jsonp(baseurl+'country=uk&pretty=1&action=search_listings&place_name=london'
    +encoding+type + "&callback=JSON_CALLBACK")
14
Explosion Pills

Installez Fiddler. Ajoutez-y une règle personnalisée:

static function OnBeforeResponse(oSession: Session)
{
    oSession.oResponse.headers.Add("Access-Control-Allow-Origin", "*");
}

Cela vous permettrait de faire des demandes interdomaines à partir de localhost. Si l'API est HTTPS, assurez-vous d'activer "décrypter le trafic HTTPS" dans fiddler.

Référence

-------------------- MISE À JOUR

La réponse que vous obtenez est JSON. La spécification de JSONP comme type de données ne fonctionnerait pas. Lorsque vous spécifiez JSONP, le retour doit être une fonction et non un objet JSON.

JSONP

2
uiwarrior