Bild in jQuery nach Beitrag anzeigen() Anfrage

Ich möchte eine Bilddatei auf meiner HTML-Seite anzeigen, die ich nach dem Senden einer JQuery post() - Anfrage an den Server erhalten, wie im folgenden Code gezeigt.Bild in jQuery nach Beitrag anzeigen() Anfrage

Ich habe kommentiert, wo ich das Problem habe.

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css"> 
 
    <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> 
 
    <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> 
 

 
    <script> 
 
    $.post("http://10.10.129.164:8080/picsOnDemand/sendcphoto/cphoto", { 
 

 
     clientid: "1234567890", 
 

 
     }, 
 
     function(data) { 
 

 
     $('#blah').attr('src', data); //What should I code here? 
 

 
     }); 
 
    </script> 
 
</head> 
 

 
<body> 
 

 
    <div data-role="page"> 
 
    <div data-role="header"> 
 
     <h1>Welcome To My Homepage</h1> 
 
    </div> 
 

 
    <div id="newimage" data-role="main" class="ui-content"> 
 
     <p>I Am Now A Mobile Developer!!</p> 
 
     <img id="blah" src="" height="200" width="200" alt="Image preview..."> 
 
    </div> 
 

 
    <div data-role="footer"> 
 
     <h1>Footer Text</h1> 
 
    </div> 
 
    </div> 
 

 
</body> 
 

 
</html>

Von der Server-Seite ich eine Bilddatei als Antwort schickte wie in dem unten stehenden Code dargestellt:

@Path("/sendcphoto") 
public class SendCPhotoRequested { 
@POST 
@Path("/cphoto") 
@Produces("image/jpeg") 
public Response getCPhoto(@FormParam("clientid") String clientid){ 

    File file = new File("C:\\Users\\nmn\\workspace1\\clientimages\\"+clientid+".jpg"); 
    System.out.println("File sent"); 
    ResponseBuilder builder = javax.ws.rs.core.Response.ok((Object) file); 
    builder.header("Content-Disposition", "attachment; filename=clientpic.jpg"); 
    return builder.build(); 
} 
}

Bitte bitte helfen, ich habe für diese Suche aber Ich habe keine einzige Antwort, die für mich funktioniert hat.

Quelle

2016-04-21 AnshX

Sie können eine URL für das Bild vom Server generieren und in der Antwort senden. Dann sollte der obige Code zum Anzeigen des Bildes wie erwartet funktionieren. –

https://css-tricks.com/data-uris/ schau hier, hoffe das hilft –

Debugger kurz vor $ setzen ('# blah'). Attr ('src', data); und überprüfen Datenobjekt in der Konsole –

Wie Adarsh Konchady sagte, könnten Sie die URL für das Bild zurückgeben, damit Sie es mit Ihrem aktuellen Code anzeigen können.

Sie könnten auch den Bildinhalt als base64 String zurück und display it mit data URI:

$('#blah').attr('src', 'data:image/jpeg;base64, ' + data);

Quelle

2016-04-21 11:26:03 Aurel

Mann, wenn Sie nur Kommentare duplizieren, bitte, mindestens markieren sie als nützlich –

Ich habe es nicht absichtlich duplizieren, ich sah gerade, dass der Kommentar hatte eine der Antwort, die ich früher als ich, also zitiere ich den Autor . – Aurel

Konvertieren Sie das Bild in Base64-String und schicken Sie es an Ihre Ansicht.

Base64.encode(FileUtils.readFileToByteArray(file));

und setzen Sie einfach die Base64-Zeichenfolge im Bild src wie unten.

$('#blah').attr('src', 'data:image/jpeg;base64, ' + data);

Quelle

2016-04-21 11:32:39 Sagar

Bild in jQuery nach Beitrag anzeigen() Anfrage

Antwort

Verwandte Themen