Erreur lors de la récupération de jsonp à partir du client http aurelia

Question

J'ai une application que je crée en utilisant Aurelia. Je souhaite récupérer les dernières images d'un utilisateur dans instagram via ajax. J'ai essayé d'utiliser le Aurelia http client parce que c'est ce que l'exemple de Flickr sur la page de démarrage d'Aurelia utilise.

Si j'utilise http.get, j'obtiens une erreur CORS d'instagram. En essayant http.jsonp, la réponse inspectée montre le correct format, mais je reçois ce qui ressemble à une erreur d'analyse (Jeton inattendu ":") avant que le rappel qui gère la réponse soit en cours d'exécution.

I suis suis capable de récupérer avec succès les images via AJAX en utilisant jQuery, mais je suis curieux de savoir ce que je fais de mal avec le client http Aurelia.

Voici les bits pertinents du modèle de vue:

import {inject} from 'aurelia-framework'; 
import {HttpClient} from 'aurelia-http-client'; 

@inject(HttpClient) 
export class Welcome { 
    images = []; 
    url = '[INSTAGRAM_URL]'; 

    constructor(http){ 
    this.http = http; 
    } 

    activate(){ 
    return this.http.jsonp(this.url).then(response => { 
     this.images = response.data.map(function (d) { 
      return { 
       src: d.images.standard_resolution.url, 
       caption: d.caption.text, 
       when: d.created_time 
      }; 
     }); 
    }); 
    } 
} 

Answer 1

API paramètre callback Instagram attend GET pour être présent dans l'URL de la requête. Ce paramètre devrait être un nom de fonction pour envelopper l'objet de réponse dans (Aurelia va ajouter quelque chose comme &callback=jsonp_callback_59563). La raison pour laquelle cela fonctionne avec jQuery.jsonp est qu'il ajoute automatiquement le paramètre callback derrière la scène.

code correct devrait alors être:

return this.http.jsonp(this.url, 'callback').then(response => { 
    this.images = response.content.data.map(function (d) { 
     return { 
      src: d.images.standard_resolution.url, 
      caption: d.caption.text, 
      when: d.created_time 
     }; 
    }); 
});