PHP

Question

好的。我有一个正在构建的 gallery-app，其中有一个缩略图列表，单击时，通过 ajax-call 将原始图像提取到 showfile.php，而 return使用 X-Sendfile 通过 header() 发送文件。这有效，但由于某种原因，我无法获得对 return 正确值的后续调用，并且脚本中断。（第一个 return returns "null"，这是我想要的，而第二个 returns 图像作为二进制数据）。

好的。这是 ajax-call:

的代码

$('.lightbox').click(function(e) {
e.preventDefault();
var $this = $(this);
var linkName = $(this).attr('href').split('=')[1];
$.ajax({
  url: 'showfile.php',
  type: 'GET',
  dataType: 'binary',
  data: 'file='+linkName+'',
  responseType: 'blob',
  processData: false,
  success: function(result) {
    var image = new Image();
    image.src = URL.createObjectURL(result);
    $('#lightbox_container').append(image).removeClass('hidden').addClass('visible');
    image.onload = function() { var imageWidth = image.width/2; $('#lightbox_container').css({'margin-left':'-'+imageWidth+'px'}); window.URL.revokeObjectURL(image.src);};
    $('#overlay').removeClass('hidden').addClass('visible');
    $('.nextbutton,.prevbutton').click(function(e) {
        if ($(e.target).hasClass('prevbutton')) {
            var linkName = $this.parent('.pictures').prev('li.pictures').find('a').attr('href').split('=')[1];
            $.ajax({
                url: 'showfile.php',
                type: 'GET',
                datatype: 'binary',
                data: 'file='+linkName+'',
                responseType: 'blob',
                processData: false,
                success: function(result2) {
                    var image = new Image();
                    var binaryData = [];
                    binaryData.push(result2);
                    image.src = URL.createObjectURL(new Blob(binaryData));
                    // image.src = URL.createObjectURL(result2);
                    $('#lightbox_container img').remove();
                    $('#lightbox_container').append(image);
                    image.onload = function() { var imageWidth = image.width/2; $('#lightbox_container').css({'margin-left':'-'+imageWidth+'px'}); };
                }
            })
        }
    })
  }
}); 
});

这有效，直到第二个 ajax-call - 第二次调用 showfile.php 的 return 值是一个二进制块（如果我查看 NET-tab在控制台中，我得到了正确的图像 returned)，但由于某种原因 createObjectUrl 不起作用（我试过没有 binaryData-bit，但随后 createObjectUrl 自然而然地失败了，因为结果不正确。

showfile.php如下：

<?php
require_once('conf/config.php');
if (!session_id()) { session_start(); };
if ($isloggedin) {
    if (isset($_GET['file'])) {
        // $getFile = readfile($_SERVER['DOCUMENT_ROOT'].'/'.$userpath.$username.'pictures/'.$_GET['file']);
        header('Content-type: image/jpeg');
        header('X-Sendfile: '.$_SERVER['DOCUMENT_ROOT'].'/'.$userpath.$username.'pictures/'.$_GET['file'].''); # make sure $file is the full path, not relative
        exit;
        // echo base64_encode($getFile);
    }
}
?>

有一些注释行，我正在尝试使用 readfile() 代替，效果没有任何改善，总的来说似乎有点慢。

所以，我所追求的是：我做错了什么？由于 ajax-call 在第一次点击时有效，它应该在第二次点击时也有效，对吧？但事实并非如此。但是，如果我关闭图像并单击一个新的缩略图，它就可以正常工作。没有刷新页面或类似的东西，只需关闭弹出窗口，然后单击一个新的缩略图，它又可以工作了。但出于某种原因，第二次点击时 return 的值与 "null" 不同。

这让我相信有些东西没有被关闭或重置或其他什么，以及某种 "left over" 问题 - 这让我想到了 php-file，因为这似乎是return 不同的值。 "zero out" 有什么我可以做的吗？

我试过谷歌搜索，但根本没有找到太多关于这些函数的信息。

哦，第二个 ajax-click returns，正如我所说，一些二进制信息 - 但是当我尝试使用 blob 从它创建 objectUrl 时，它不起作用 - 即，url 不起作用，它只显示损坏的图像图标，而不是实际图像，尽管 url 看起来是正确的（与 url 相同，就好像我重新访问缩略图并再次单击，重新开始），正如我所说，控制台中的 net-tab 显示图像在两种情况下都被 returned。

Answer 1

好吧，我现在觉得自己非常愚蠢。这是一个错字。 datatype 应该是 dataType- 有时 javascript 中的驼峰式大小写会把我绊倒。更改它可以解决问题。

PHP - return 图像 header("X-sendfile") returns 在第一次迭代时为空，在第二次迭代时为二进制（使用 ajax）

PHP - return image with header("X-sendfile") returns null on first iteration, binary on second (using ajax)

jquery

ajax

binary

x-sendfile