/ / Consumo jsonp con angularjs, (non può CORS) - javascript, angularjs, node.js, http, jsonp

Consumare jsonp con angularjs, (non può CORS) - javascript, angularjs, node.js, http, jsonp

Devo caricare un file JSON da un altro server (dove non ho il controllo). Dopo alcune ore di ricerca ho scoperto che JSONP è lo sporco hack che risponde alle mie suppliche.

Sto usando nodejs, servendo il sito su localhost: 3000 usando gulp. Caricamento del JSON da localhost: 8000

Sono stato in grado di ottenere un esempio funzionante, da un URL che non mi serve (l'ho trovato casualmente su Internet), utilizzando lo stesso codice che non avevo funzionante con il mio URL.

Questo mi fa chiedere se sto cercando di leggere il file come se fosse qualcosa che non è? Per quanto ho potuto ricercare, non dovrebbe essere necessario analizzare un JSON in JSONP. Sono sulla strada giusta?

Sotto, il codice di cui stavo parlando:

(function () {
"use strict";

angular
.module("qwe.asd")
.controller("UsersController", UsersController);

/** @ngInject */
function UsersController($http, $log, $sce) {

var vm = this;
var trustedUsersAPI = "http://localhost:8000/users?callback=JSON_CALLBACK";
$sce.trustAsResourceUrl(trustedUsersAPI);

$http.jsonp(trustedUsersAPI, {
"callback": "JSON_CALLBACK"
})
.success(function (data) {
$log.log("request 1 - OK");
$log.log(data);
vm.users = data;
})
.error(function () {
$log.log("request 1 - KO");
});

var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=JSON_CALLBACK";
$sce.trustAsResourceUrl(url);

$http.jsonp(url)
.success(function (data) {
$log.log("request 2 - OK");
$log.log(data);
})
.error(function () {
$log.log("request 2 - KO");
});


}
})();

E i log generati ...

angular.js:13424 request 1 - KO
angular.js:13424 request 2 - OK
angular.js:13424 Object {found: 12, posts: Array[12]}

E infine, i file JSON che sto (male) leggendo:

Quello di cui ho bisogno ma non posso avere

[{"id":0,"firstname":"front","lastname":"end","email":"frontend@example.com"},{"id":1,"firstname":"back","lastname":"end","email":"backend@example.com"},{"id":2,"firstname":"john","lastname":"doe","email":"johndoe@example.com"},{"id":3,"firstname":"dev","lastname":"eloper","email":"developer@example.com"},{"id":4,"firstname":"ad","lastname":"min","email":"admin@example.com"}]

E quello di cui non ho bisogno ma funziona bene

{"found":12,"posts":[{"ID":XX,"site_ID":XXXX,"author":XXXX(..POSTS DATA WITH NO VALUE HERE..)}]}

P.S. Sono davvero verde qui, sono su angolare da stamattina!

risposte:

-1 per risposta № 1

Per quelli che vengono dopo di me, stavo seguendo la strada sbagliata. Grazie ai commentatori ho appreso che JSONP deve essere supportato sul server (proprio come fa CORS).