Affichage HTML de la réponse de l'Ajax appel à l'aide d'outils de développement Chrome?

Donc dans mon javascript, je fais un appel ajax pour un service sur mon site web. Oups, quelque chose tombe en panne. Pas de problème. Voici ce que je ferais dans Firefox:

  1. Ouvrir la console de firebug
  2. Trouver l'échec de l'appel Ajax et cliquez sur le signe + pour voir plus d'infos.
  3. L'onglet réponse a le HTML brut. Qui veut lire tout ça? Je clique sur l'onglet HTML.
  4. Ah, le bien mis en forme HTML renvoyé par Django montre mon erreur de division par zéro.

Maintenant, voici ce que j'ai actuellement ne dans google Chrome:

  1. Ctrl+Maj+J pour ouvrir les Outils de développement
  2. Aller à Ressources
  3. Faites défiler jusqu'à l'appel Ajax et cliquez sur
  4. Une fois de plus, je vois HTML brut. Encore ne veulent pas lire tout ça, mais puisqu'il n'y a pas un onglet HTML je copier et coller dans un éditeur de texte.
  5. Enregistrer le fichier html
  6. Ouvrir le fichier html dans le navigateur afin que je puisse lire l'erreur HTML renvoyé par Django

Donc à la question. Est-il de toute façon pour voir le code HTML de la réponse d'un appel Ajax est affiché dans le navigateur sans avoir à copier et coller le html brut à un éditeur de texte?

InformationsquelleAutor Eric Palakovich Carr | 2010-07-05
  1. 6

    Non, il n'y a actuellement aucun moyen. Lorsque vous goto Outils de développement > Ressources > XHR Tab >, Et cliquez sur votre ressource (sur la gauche), vous voyez deux onglets. Le premier étant en-Têtes (ce qui est cru) et le Contenu qui est cru ainsi.

    • Ouais, je pensais, comme beaucoup, mais pensé qu'il ne serait pas de mal à demander. Je vais vous donner ce un autre jour et, puisque vous avez été assez gentil de répondre, accepter cette réponse.
    • Peut-être qu'il serait sympa de faire un troisième onglet que l'on peut appeler de la visionneuse. Donc, en fonction du type de contenu (json, xml, html, format), il va s'afficher différemment. N'hésitez pas à soumettre une demande de fonctionnalité dans crbug.com/new et je peux marquer que le bogue disponibles afin que les gens peuvent triage, affecter ou une personne peut contribuer avec un patch pour elle. Ne devrait pas être difficile à mettre en œuvre, depuis ses tous les JavaScript et tout ce qui est disponible.
    • Va faire. Merci encore.
    • Fait. code.google.com/p/chromium/issues/detail?id=48389
    • Fait, ajouté à la phase de triage, une grande fonctionnalité. Merci!
    InformationsquelleAutor Mohamed Mansour
  2. 4

    Juste pour votre information, tandis que Firebug Lite ne pas ont un NET panneau, il ne ont une XHR fonctionnalité de l'observateur avec le même regard et la sensation de Firebug. Bien sûr, Firebug Lite est très limité par rapport à Chrome Developer Tools, mais pour certaines tâches spécifiques, comme la modification de la CSS ou XHR inspection, Firebug Lite fait le travail très bien.

    La version stable actuelle vous montre les en-têtes HTTP GET et POST variables, et le texte de la réponse. Mais la prochaine version 1.3.1 (qui sera publié prochainement) comprend la visionneuse HTML, XML viewer et la pratique JSON viewer (tant pour la demande et la réponse de données).

    Cette fonctionnalité sera inclus dans la prochaine version 1.3.1b2 (probablement la dernière version bêta pour la version 1.3.1), mais si vous voulez le voir courir à droite maintenant, vous pouvez utiliser le développeur canal.

    InformationsquelleAutor Pedro Simonetti
  3. 2

    Oui, le plus simple est d'utiliser l'onglet Réseau dans les Outils de développement.

    1. Ctrl+Maj+I pour ouvrir les Outils de développement (ou utiliser la barre de menu en haut: "View -> Développeur -> Outils de développement")
    2. Aller à l'onglet "Réseau"
    3. Actualiser votre page en cours
    4. Faites défiler jusqu'à l'appel Ajax sur la gauche et cliquez sur
    5. Le menu principal s'afficher plusieurs onglets (généralement défaut à l'Aperçu). Cliquez sur "en-Têtes" et vous devriez voir la Demande et la Réponse informations d'en-tête.
    InformationsquelleAutor Ry Robinson
  4. 2

    Clic droit sur le lien demandé dans l'onglet console de firebug. Puis faites un clic droit et choisissez ouvrir de réponse dans le nouvel onglet. Vous la verrez comme HTML.

    InformationsquelleAutor Tinh Dang
  5. 1

    Depuis j'ai remarqué que le clic-droit "enregistrer sous" capacité n'est plus là, sur le Réseau>XHR>onglet réponse ...j'ai créé une nouvelle auto-raccourci script: (cliquez sur bouton central de la souris sur le texte de la réponse)

    MButton::
MouseClick, left
ClipSaved := ClipboardAll
Send, ^a^c
sleep, 500
FileName := "C:\Users\David\Desktop\temp_xhr_response.html"
file := FileOpen(FileName, "w")
if !IsObject(file)
{
MsgBox Can't open "%FileName%" for writing.
return
}
StringGetPos, pos, Clipboard, HeadersPreviewResponseCookiesTiming
if pos = -1
{
pos = 0 
}
TestString := SubStr(Clipboard, pos+38)
file.Write(TestString)
file.Close()
Run, open "C:\Users\David\Desktop\temp_xhr_response.html"
Clipboard = %ClipSaved%
sleep, 1000
FileDelete, C:\Users\David\Desktop\temp_xhr_response.html
return
    InformationsquelleAutor prograhammer
  6. 0

    Vous pouvez télécharger autohotkey et écrire une macro pour faire les étapes nécessaires pour voir la réponse XHR dans une fenêtre de navigateur...

    Voici un script que j'ai écrit dans autohotkey que si vous appuyez sur le bouton central de la souris (molette de la souris bouton) à l'intérieur de cette fenêtre de réponse dans Chrome Developer Tools > onglet Réseau, il va faire ces étapes:

    1. Clic droit...cliquez sur enregistrer en tant que
    2. Coller l'emplacement du fichier dans le fichier d'invite de commandes et appuyez sur Entrée
    3. Ouvrir le fichier (utilise le navigateur par défaut)

    4. Supprimer le fichier

      MButton::
MouseClick, right
MouseGetPos, xpos, ypos
xpos := xpos + 5
ypos := ypos + 5
MouseMove, xpos, ypos
MouseClick, left
Sleep, 500
ClipSaved := ClipboardAll
Clipboard := "C:\Users\David\Desktop\temp_xhr_response.html"
Send, ^v  {Enter}
Clipboard = %ClipSaved%
sleep, 500
Run, open "C:\Users\David\Desktop\temp_xhr_response.html"
sleep, 1000
FileDelete, C:\Users\David\Desktop\temp_xhr_response.html
return

    Cela devrait vous tenir au cours jusque Google publie une mise à jour pour une meilleure visualisation HTML réponses. Je ne suis pas en utilisant FF de FireBug plus, il est devenu extrêmement lent!

    InformationsquelleAutor prograhammer