web-dev-qa-db-fra.com

Utiliser JSONP pour charger une page HTML

J'essaie de charger une page externe en utilisant JSONP, mais la page est une page HTML, je veux juste en saisir le contenu en utilisant ajax.

EDIT: La raison pour laquelle je le fais est que je veux transmettre toutes les informations utilisateur, par exemple: en-têtes, ip, agent, lors du chargement de la page plutôt que de mes serveurs.

Est-ce faisable? À l'heure actuelle, je peux obtenir la page, mais jsonp tente d'analyser le json en renvoyant une erreur: Uncaught SyntaxError: Unexpected token <

Exemple de code:

$.post('http://example.com',function(data){
    $('.results').html(data);
},'jsonp');

J'ai mis en place un jsfiddle pour que les personnes puissent tester avec: http://jsfiddle.net/8A63A/1/

javascriptjqueryajaxjsonp
22
Korvin Szanto

http://en.wikipedia.org/wiki/JSONP#Script_element_injection

Passer un appel JSONP (en d’autres termes, pour utiliser ce modèle d’utilisation), nécessite un élément de script. Par conséquent, pour chaque nouvelle demande JSONP, le navigateur doit ajouter (ou réutiliser) un nouvel élément (en d’autres termes, injecter cet élément) dans le DOM HTML avec la valeur souhaitée pour l’attribut "src". Cet élément est ensuite évalué, l'URL src est récupérée et le JSON de réponse est évalué.

Maintenant, regardez votre erreur:

Uncaught SyntaxError: Jeton inattendu <

< est le premier caractère de toute balise HTML. Il s'agit probablement du début de <DOCTYPE, dans ce cas, qui est bien sûr, JavaScript non valide.

EtNO, vous ne pouvez pas utiliser JSONP pour récupérer des données HTML.

15
c69

J'ai fait ce que vous voulez, mais dans mon cas, j'ai le contrôle du code côté serveur qui renvoie le code HTML. Donc, ce que j'ai fait a été enveloppé le code HTML dans l'une des propriétés Json de l'objet renvoyé et utilisé au côté client, quelque chose comme:

callback({"page": "<html>...</html>"})

L’erreur de syntaxe à laquelle vous faites face est due au fait que la bibliothèque que vous utilisez attend JSON mais que la réponse est HTML, justement.

12
martosoler

J'ai trois mots pour vous: Politique relative à la même origine

Si l'URL distante ne prend pas en charge les requêtes JSONP appropriées, vous ne pourrez pas faire ce que vous essayez. Et c'est une bonne chose.

Edit: Vous pouvez bien sûr essayer de proxyer la demande via votre serveur…

2
vzwick

Si vous voulez vraiment employer le client pour attraper un fichier HTML, je suggère d'utiliser flyJSONP - qui utilise YQL .. ou d'utiliser jankyPOST qui utilise quelques techniques douces:

jankyPOST crée un iframe masqué et le remplit d'un formulaire (iframe [0] .contentWindow.document.body.form.name).

Ensuite, il utilise HTML5 (surveillez les anciens navigateurs!) WebMessaging API pour publier sur l'autre iframe et définit les valeurs des éléments de formulaire d'iframe sur ce que vous avez spécifié.

Envoie le formulaire au serveur distant ... terminé.

Ou vous pouvez simplement utiliser PHP curl, l'analyser, l'échanger, etc.

IDK si quoi exactement vous l'utilisez mais j'espère que cela vous aidera.

AUSSI ... Je suis presque sûr que vous pouvez utiliser JSONP pour tout ce qui est une sortie du code serveur. Je l'ai fait avec ClientLogin en ne faisant que JSONPing leur page keyGen et en consolant avec succès la consignation du texte même s'il s'agissait de balises n/b. J'ai eu quelques autres erreurs à ce sujet, mais le fait est que j'ai gratté cette sortie.

Actuellement, j'essaie de faire ce que vous êtes, donc je posterai le message en cas de succès.

2
Cody

Je ne pense pas que ce soit possible. JSONP nécessite que la réponse soit correctement rendue.

Si vous souhaitez une autre solution, qu’en est-il de charger l’url dans un iframe et d’essayer de parler de l’iframe. Je ne suis pas sûr à 100% que ça va marcher, mais ça vaut le coup.

0
jesse reiss