我想在我的 html 页面上显示一个图像文件,该文件是我在向服务器发送 JQuery post() 请求后收到的,如下面的代码所示。
我已经评论了我遇到的问题。
<!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>
从服务器端,我发送一个图像文件作为响应,如下面的代码所示:
@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();
}
}
请帮忙,我一直在寻找这个,但我没有得到一个对我有用的答案。
最佳答案
正如 Adarsh Konchady 所说,您可以返回图像的 URL,以便可以使用当前代码显示它。
您还可以将图像内容作为 base64 字符串和 display it 返回使用data URI :
$('#blah').attr('src', 'data:image/jpeg;base64, ' + data);
关于javascript - post()请求后在jquery中显示图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36768015/