Wie Bild mit HTTP-Header in HTML-Seite anzeigen?

Ich habe eine einfache HTML-Seite mit einem Knopf. Beim Klicken auf diese Schaltfläche sollte eine HTTP-URL (mit Accept-Header) für die GET-Anforderung aufgerufen werden.Wie Bild mit HTTP-Header in HTML-Seite anzeigen?

Die Ausgabe von HTTP URL ist ein Bild oder Audio oder Video (gemäß dem Anfrage-Header). Wie soll ich ein Javascript oder Ajax-Aufruf

<html> 

<form> 

<input type="submit" id='img_display' onClick=imgDisp()> 
<div id='display'></div> 

</form> 

</html>

Ajax code-

$("#img_display").on("click", function imgDisp() { 
$.ajax(   
    { 
     type: 'GET',     
     url: 'http_url', 
     dataType: 'json', 
     beforeSend : function(xhr) 
     { 
      xhr.setRequestHeader('Accept', 'image/png'); 
     },    
     success: function(data){ 
       alert("successfully")            
     }, 
     error: function(e){  
       alert("error post" + e); 
     }    
    } 
    );

}) schreiben;

Quelle

2017-03-01 John Seen

sidennote: mit einem Javascript Klickereignis und onClick wird es zweimal ausgelöst, oder Konsolenfehler, dass die Funktion imgDisp nicht definiert –

hoffe das wird dir helfen !!

$(document).ready(function(){ 
 
    $("#Submit").click(function(){ 
 
     var image_url = $(".imageurl").val(); 
 
     $(".ImageContainer").html("<img src='"+image_url+"' width='200'>"); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" class="imageurl"> 
 
<button id="Submit">Submit</button> 
 
<div class="ImageContainer"> 
 
    <!--Image Display -->  
 
</div>

Quelle

2017-03-01 16:47:15

Funktioniert nicht für Video, obwohl. –

in Ordnung.! lass mich Video Option hinzufügen ..! –

Wie/Wo kann ich einen HTTP-Header in diesem Code hinzufügen? –

Um eine Ajax-Anfrage zu machen, die entweder ein Bild zurückgibt, Audio- oder Videoinhalt und zwingt die Empfangs Javascript den Inhaltstyp einer potenziell großen Klecks Daten zu erraten, ist schlecht Design.

Je nachdem, welchen Typ der Audio- und Videoinhalt hat, ist es unter Umständen nicht möglich, dies zu tun.

Es ist viel besser eine Ajax-Anfrage zu machen, die, sagen wir, ein JSON-Objekt mit dem Inhaltstyp und URL zurückgibt:

{ "type": "image", 
    "url": "http://example.com/images/5/example.jpg" }

oder, für ein Video:

{ "type": "video", 
    "url": "http://example.com/videos/5/example.mp4" }

Sie Holen Sie sich die Drift.

Sie können dann den Inhalt entsprechend behandeln, z. B. ein img-Element erstellen und die Eigenschaft src auf die URL festlegen oder einen Video- oder Audioplayer mit der Video-URL aufrufen.

Auf diese Weise können Sie auch andere Metadaten senden, die für das Rendern des Endergebnisses relevant sind - z. B. Bilddimensionen und Alt-Text.

Quelle

2017-03-01 16:51:14

Wie Bild mit HTTP-Header in HTML-Seite anzeigen?

Antwort

Verwandte Themen