2016-10-19 8 views
-1

오케이. 나는 건물에있는 갤러리 앱을 가지고 있는데 여기에는 섬네일 목록이 있으며, 클릭하면 ajax 호출을 통해 원본 이미지를 가져 와서 showfile.php에 보내고 X-Sendfile을 사용하여 header()를 통해 파일을 반환합니다. . 이 작동하지만 어떤 이유로 나는 올바른 값을 반환하기 위해 후속 호출을 얻을 수 없으며 스크립트가 중단됩니다. (첫 번째 반환 값은 "null"을 반환하며, 두 번째 값은 이진 데이터로 반환합니다).헤더가있는 반환 이미지 ("X-sendfile")는 첫 번째 반복에서 null을 반환하고 두 번째에서 이진 (ajax 사용)

오케이. 내가 NET 보면 (두 번째 호출에 showfile.php의 반환 값 이진 블록 -

이 작동
$('.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'}); }; 
       } 
      }) 
     } 
    }) 
    } 
}); 
}); 

는 최대 두 번째 아약스 호출 때까지 다음은 아약스 통화의 코드입니다 콘솔에서 -tab) 올바른 이미지가 반환됩니다. 그러나 어떤 이유로 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()을 사용하려고 시도했지만 더 잘 작동하지 않습니다. 일반적으로 조금 느립니다.

그래서, 내가 뭘 했는가 : 내가 뭘 잘못하고 있니? 아약스 호출은 첫 번째 클릭에서 작동하므로 두 번째 클릭에서도 제대로 작동해야합니다. 그러나 그렇지 않습니다. 그러나 이미지를 닫은 다음 새 축소판을 클릭하면 잘됩니다. 페이지 등을 새로 고침하지 말고 팝업을 닫은 다음 새 축소판을 클릭하면 다시 작동합니다. 그러나 어떤 이유로 인해 두 번째 클릭시 동일한 'null'값을 반환하지 않습니다.

어느 것이 닫히지 않거나 재설정되지 않거나, 어떤 종류의 "남겨진"문제가 있다고 믿습니다. PHP 파일로 연결되는 것은 다른 값을 반환하는 것입니다. 내가 "제로 아웃"할 수있는 것이 있습니까?

인터넷 검색을 사용해 보았지만 이러한 기능에 대한 많은 정보를 찾지 못했습니다.

오, 두 번째 ajax-click은 일부 바이너리 정보를 반환합니다.하지만 blob을 사용하여 objectUrl을 만들려고 할 때 작동하지 않습니다. 즉, URL이 작동하지 않습니다. URL이 정확하다고 보이지만 실제로 이미지가 아니라 깨진 이미지 아이콘을 보여줍니다 (미리보기를 다시 방문하고 다시 시작하는 것과 동일한 URL). 그리고 말했듯이 콘솔의 넷 탭에는 이미지가 표시됩니다. 두 경우 모두 반환됩니다.

답변

0

좋아, 나는 지금 매우 어리 석다. 오타입니다. datatypedataType이어야합니다. 때로는 자바 스크립트의 낙타 케이스가 나를 위로 이동시킵니다. 변경하면 문제가 해결됩니다.