img src属性从$ .post请求返回二进制数据

时间:2014-02-11 01:41:30

标签: php jquery html ajax image

我正在尝试通过向php脚本发布请求来在html页面中呈现图像,该脚本以二进制模式打开图像,然后返回带有正确内容标题的图像并将其呈现在img标记中。我在控制台中看到二进制数据,但我不知道如何使用它来在html页面中呈现图像。

img src属性引用此URL:http:// [IP]:[PORT] / img / 123。当请求到达服务器时,url被重写为指向tracker.php。在tracker.php中,会收到一个get请求,该请求成功返回一个图像url,并以此url作为数据发出另一个post请求。在同一个tracker.php页面中,php脚本以二进制模式打开url引用的文件,并使用正确的标题输出。

如何将此数据恢复到html网页img标记并正确呈现?这甚至可能吗?

谢谢,J

<?php 
error_reporting(-1);
#phpinfo();
#var_dump($_REQUEST);
if(isset($_POST['val'])) {

  // open the file in a binary mode
  $name = $_POST['val'];
  $fp = fopen($name, 'rb');

  // send the right headers
  header("Content-Type: image/png");
  header("Content-Length: " . filesize($name));

  // dump the picture and stop the script
  fpassthru($fp);
  exit;
}
?>
<html>
<head>
<script type='text/javascript' src='/steal/steal.js'></script>
<script type="text/javascript" src="/plugins/jquery/json2.js"></script>
<script type="text/javascript">
steal('jquery/dom/fixture').then(function(){

$.fixture("GET /event/{code}", function(original, settings, headers){
    return [200, "success", { "img_url":"http://path/to/my/img.png" }, {} ]
})

var strObj = <?php echo json_encode($_REQUEST); ?>;
var str = strObj.q;
var eventCode = str.split('/')[1];

$.ajax({
  url: "/event/"+eventCode,
  success: function(data) {
     var imgUrl = data.img_url;
     $.post('/tracker.php', 'val='+imgUrl, function (response) {
        return response; // push img data from php back to html page img tag.
     });
   }
});

});
</script>

</head>
<body>

</body>
</html>

0 个答案:

没有答案