Laden von Nicht-HTML-Inhalten mit Javascript. Ist das möglich?

Question

Hier ist das Szenario:

Ich möchte einige HTTP-API-Aufrufe mit Javascript zu machen, und haben die Antwort im Browser zu laden. Die Anfragen könnten sein GET , POST , PUT o DELETE und die Antwort, die zurückkommt, kann jede Art von Inhalt sein - HTML, JSON, XML, Bilder, Dokumente, binäre Inhalte oder was auch immer. Ich möchte, dass die Antwort vom Browser genau so behandelt wird, wie wenn der Browser eine neue Seite laden würde.

Das Problem ist, dass ich keine Möglichkeit sehe, die beliebigen Inhalte, die ich erhalte, zu laden.

Natürlich ist es möglich, Inhalte in das DOM zu laden, aber das erlaubt mir nur den Umgang mit HTML. (Und möglicherweise einige Medientypen wie Bilder usw. einbetten.) Ich sehe keine offensichtliche Möglichkeit, mit der Einbettung von Antworttypen wie JSON und XML umzugehen, ohne spezielle Fälle zu konstruieren, wie jeder Typ in HTML gerendert wird.

Ich habe überlegt, ob es nicht eine Lösung gibt, die Frames oder eine Änderung der window.location um den Inhalt zu laden, aber ich sehe keine Möglichkeit, dies zu bewerkstelligen.

Ist es überhaupt möglich, das zu tun, wonach ich suche, oder können Sie elegante Umgehungslösungen vorschlagen, die helfen könnten?

Edita:

Ein wenig mehr Hintergrundinformationen - Dies ist für einige Arbeiten an einen API-Browser . Ich habe kein Problem damit, das, was ich brauche, mit GET y POST - Es ist PUT y DELETE die umständlich sind, da ich sie nicht direkt mit HTML unterstützen kann. Im Moment verwendet die Implementierung einige serverseitige Tricks und eine versteckte _method Feld im Formular, das Folgendes ermöglicht POST Anfragen, die überladen werden müssen in PUT / DELETE / OPTIONS /was auch immer, aber idealerweise würde ich gerne diese Logik aus der Server-Seite zu nehmen, und tun das Äquivalent mit Javascript.

Im Moment glaube ich nicht, dass es wirklich machbar ist, aber ich hoffe, dass mir jemand das Gegenteil beweisen oder eine elegante Lösung finden kann.

Answer 1

Ich frage mich, ob Sie ein neues Fenster öffnen oder erstellen ein iframe wobei die URL, die Sie an das Fenster oder den iframe übergeben, keine absolute URL für die Ressource im Web ist, sondern eine Datenuri . Sie müssen den MIME-Typ der Antwort herausfinden und dann den Text der Antwort verschlüsseln.

Ich weiß nicht, ob es funktioniert, aber es würde mich interessieren zu hören, ob Sie es schaffen, das zu erreichen.

Andere Dinge zu entdecken: der BlobBuilder (eine HTML5-Funktion) und die Erstellung eines "quellenlosen" iframe (bei dem die src ist nur about:blank ) mit einem benutzerdefinierten Mime-Typ und verwenden Sie dann document.write in das iframe-Dokument zu schreiben (ein Teil des Codes in AppleOfMyIframe von Nutzen sein könnte).

Answer 2

Ich denke, die Daten URIs könnte funktionieren, aber letztlich ich Art von Gefühl, Sie würden entfernen ein winziges Bit der Server-seitigen Parsing (Ihre POST-Parameter) auf Kosten der Einführung von Komplexität anderswo.

Sie könnten die AJAX- und Umleitungs-Kombination verwenden, wenn Sie sich nicht um die Tatsache kümmern würden, dass Sie eine zwischengeschaltete GET-Anfrage verwenden, um die Antwort tatsächlich zu laden, aber ich schätze, dass Sie das wahrscheinlich tun, also ist das nicht machbar.

Da Sie nicht AJAX verwenden und in das DOM einfügen wollen, halte ich Ihr Formularfeld an dieser Stelle für die eleganteste oder zumindest robusteste Lösung. Kein Herumhantieren mit iframes, neuen Fenstern oder ähnlichem und eine Anfrage ergibt eine Antwort, auf Kosten von möglicherweise umzuinterpretieren ein POST als etwas anderes Server-seitig.

Ich kann mir keine bessere Lösung vorstellen als die, die Sie derzeit haben.

Answer 3

Wie Sie wahrscheinlich selbst wissen, lassen Formulare nur POST- und GET-HTTP-Anfragen zu. Die einzige Möglichkeit, PUT und DELETE mit Javascript zu tun ist durch AJAX (XMLHttpRequest); das ist etwas, das Sie nicht wollen, da Sie speziell Ihren Code benötigen, um die Seite auf jedem HTTP-API-Aufruf zu aktualisieren und dann zeigen die rohe Antwort auf dem Browser (entweder als XML oder JSON oder etwas anderes ).

Aber wenn das, was Sie tun wollen, wirklich so einfach ist wie

1. einen HTTP-API-Aufruf unter Verwendung von Javascript durchzuführen.
2. Laden der XML- oder JSON-Antwort, die Rohdaten auf GET/POST enthält (neben dem Parsen und Anhängen an das DOM)

dann denke ich nicht, dass die Lösung etwas Ausgefalleneres als eine einfache Umleitung sein sollte:

<html>
<head>
   <script type="text/javascript">
       var url = //insert your url here
       var a = document.getElementsByTagName[](0);
       a.addEventListener("click", callAPI, false);

       function callAPI(){
           location.href=url;
       } 
   </script>
</head>
<body>
   <a href="#request">Click here to make HTTP call</a>
</body>
</html>

Sie klicken auf diesen Link und werden dann zu der URL weitergeleitet, die das XML/JSON enthält. Dies zeigt Ihnen die Antwort, die die Rohdaten eingebettet in HTML auf dem Browser anzeigt

Sagen Sie mir Bescheid, wenn es das ist, wonach Sie fragen? Ich hoffe, das hilft Wenn Sie mehr über HTTP restful on javascript erfahren möchten, können Sie versuchen diesen Artikel hier lesen .