我的PHP服务器上的uploads
文件夹中有一些文件。我的问题如下:我想从我的客户端发送一个JSON异步请求,以便选择其中一个文件,并用它创建一个图像元素,以便在浏览器中显示它。
JS代码
var file_name="test.jpg";
$.ajax({
method:"POST",
dataType:"json",
url:"retrieve_photo.php",
data:{name:file_name},
success: function(data) {
var new_thumb = document.createElement("img");
document.getElementById('dragarea').appendChild(new_thumb);
...
}
})
PHP代码(retrieve_photo.PHP):
<?php
$ds = DIRECTORY_SEPARATOR;
$storeFolder="uploads";
$file_name=$_POST[name];
$files = glob($storeFolder.$ds.$file_name);
if ( false!==$files ) {
....
}
header('Content-type: text/json');
header('Content-type: application/json');
echo json_encode($result);
?>
我不知道该写什么,因为$result
以正确的方式馈送data
。我试过
$result=readfile($storeFolder.$ds.$file_name);
但可能不正确。最后,我想使用data
在浏览器中显示图像。
感谢
也许做这样的事情会更好?:
var image = new Image();
image.src = "blabla";
$(image).on('load', function(){
//do what you want
})
你为什么还要使用AJAX?也许我不明白)
由于您在PHP中不使用算法或函数,因此您可以通过Javascript/Jquery:完成所有操作
var img = $("<img />").attr('src', 'uploads/'+ file_name)
.on('load', function() {
if (!this.complete || typeof this.naturalWidth == "undefined") {
alert('Image not found');
} else {
$("#dragarea").append(img);
}
});
文件getElementByI('dragarea').appendChild(new_thumb);
М你是说?文件getElementById('dragarea').appendChild(new_thumb);
document.getElementById('dragarea').appendChild(new_thumb);
在retrieve_photo.php
中尝试此操作
$filename = "test.jpg";
//Make sure $filename contains the appropriate path of the photo
$size = getimagesize($filename);
$file = $filename;
if ($size) {
header("Content-type:". $size['mime']);
header("Content-Length: " . filesize($file));
header("Content-Disposition: attachment; filename=$filename");
header('Content-Transfer-Encoding: base64');
header('Cache-Control: must-revalidate, post-check=0, pre-check=0');
header("Content-Type: application/force-download");
readfile($file);
exit;
}