"AJAX"를 사용하여 CSV 파일 다운로드

"AJAX"를 사용하여 CSV 파일 다운로드

저는 제 웹사이트를 위해 꽤 간단한 작업을 수행하려고 노력하고 있지만, 어떻게 해야 할지 정확히 모르겠습니다.사용자가 테이블을 보고 버튼을 클릭하면 해당 테이블의 내용을 CSV 파일로 저장할 수 있습니다.이 요청은 때때로 매우 복잡할 수 있으므로 사용자에게 경고하기 위해 진행률 페이지를 생성합니다.

저는 csv 파일을 실제로 생성하는 것을 제외하고는 대부분 파악했습니다. (저는 jQuery와 PHP를 사용합니다.

클릭 시 실행되는 jQuery 코드:

hmis_query_csv_export: function(query_name) {
    $.uiLock('<p>Query Loading.</p><img src="/images/loading.gif" />')
    $.get({
        url: '/php_scripts/utils/csv_export.php',
        data: {query_name: query_name},
        success: function(data) {
            $.uiUnlock();
        }
    });}

관련 PHP:

header("Content-type: text/x-csv");
header("Content-Disposition: attachment; filename=search_results.csv");
//
//Generate csv
//
echo $csvOutput
exit();

이것은 텍스트를 PHP 파일로 보내지만 다운로드는 생성되지 않습니다.내가 뭘 잘못하고 있는 거지?

강제로 다운로드하는 경우 현재 페이지를 다운로드 링크로 리디렉션할 수 있습니다.링크가 다운로드 대화상자를 생성하므로 현재 페이지(및 해당 상태)는 제자리에 유지됩니다.

기본 접근 방식:

$('a#query_name').click(function(){
    $('#wait-animation').show();
    document.location.href = '/php_scripts/utils/csv_export.php?query_name='+query_name;
    $('#wait-animation').hide();
});

더 복잡함:

$('a#query_name').click(function(){
    MyTimestamp = new Date().getTime(); // Meant to be global var
    $('#wait-animation').show();
    $.get('/php_scripts/utils/csv_export.php','timestamp='+MyTimestamp+'&query_name='query_name,function(){
        document.location.href = '/php_scripts/utils/csv_export.php?timestamp='+MyTimestamp+'&query_name='+query_name;
        $('#wait-animation').hide();
    });
});

PHP 스크립트에서:

@header("Last-Modified: " . @gmdate("D, d M Y H:i:s",$_GET['timestamp']) . " GMT");
@header("Content-type: text/x-csv");
// If the file is NOT requested via AJAX, force-download
if(!isset($_SERVER['HTTP_X_REQUESTED_WITH']) || strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) != 'xmlhttprequest') {
    header("Content-Disposition: attachment; filename=search_results.csv");
}
//
//Generate csv
//
echo $csvOutput
exit();

가 새로운 두요은 URL 일야브가새저시속다니입않도록작지하를라드운다로청우의해동▁not▁the▁the▁at▁must▁browser▁be▁a▁requests다▁trick▁for니▁url입속▁download.document.location.href복사본을 캐시에 저장할 수 있습니다.저는 그것에 대해 완전히 확신할 수는 없지만,

EDIT 방금 10MB 파일로 시도했는데 val()이 너무 느려서 데이터를 삽입할 수 없는 것 같습니다.허럼.

---

좋아요, 그래서 한 번 더 해봤어요.이건 완전히 미친 짓일 수도 있고 아닐 수도 있습니다!이 아이디어는 데이터를 생성하기 위해 AJAX 요청을 한 다음 콜백을 사용하여 세 번째 "다운로드" 페이지의 동작이 있는 현재 페이지의 숨겨진 양식에 데이터를 삽입하는 것입니다. 삽입 후 양식이 자동으로 제출되면 다운로드 페이지가 헤더를 보내고 POST를 반향하며 다운로드합니다.

파일이 준비되고 있다는 표시가 원본 페이지에 나타나고 파일이 완료되면 표시기가 업데이트됩니다.

참고: 이 테스트 코드는 광범위하게 테스트되지 않았으며 실제 보안 검사(또는 전혀)가 시행되지 않았습니다.1.5로 테스트했습니다.제가 준비한 MB CSV 파일은 상당히 빨랐습니다.

Index.html

<a id="downloadlink" href="#">Click Me</a>
<div id="wait"></div>
<form id="hiddenform" method="POST" action="download.php">
    <input type="hidden" id="filedata" name="data" value="">
</form>

test.js

$(document).ready(function(){
  $("#downloadlink").click(function(){       // click the link to download
      lock();                                // start indicator
      $.get("create.php",function(filedata){ // AJAX call returns with CSV file data
          $("#filedata").val(filedata);      // insert into the hidden form
          unlock();                          // update indicator
          $("#hiddenform").submit();         // submit the form data to the download page
      });
  });

  function lock(){
      $("#wait").text("Creating File...");
  }

  function unlock(){
      $("#wait").text("Done");
  }
});

create.message

<?php
//create $data
print $data;
?>

download.download

<?php
header("Pragma: public");
header("Expires: 0"); 
header("Cache-Control: must-revalidate, post-check=0, pre-check=0");
header("Content-Type: text/x-csv");
header("Content-Disposition: attachment;filename=\"search_results.csv\""); 

if($_POST['data']){
    print $_POST['data'];
}
?>

이렇게 하는 가장 좋은 방법은 다음과 같이 데이터 URI를 사용하는 것입니다.

1. 정상적으로 서버에 AJAX 호출
2. 서버 측에서 CSV 생성
3. 데이터 반환(맨몸 또는 JSON 구조 내부)
4. 반환된 데이터를 사용하여 Javascript에서 Data URI 생성
5. window.location을 설정합니다.href는 데이터 URI입니다.

지침은 다음 링크를 참조하십시오(3항, 구체적으로).http://en.wikipedia.org/wiki/Data_URI_scheme

이렇게 하면 서버에 파일을 저장할 필요가 없으며 iframe이나 숨겨진 폼 요소 또는 이러한 해킹을 사용할 필요도 없습니다.

AJAX/JS 요청으로는 브라우저 다운로드가 불가능할 것 같습니다.CSV를 생성하는 페이지로 이동하는 숨겨진 iframe을 사용해 보십시오.

AJAX를 사용하면 페이지가 다시 로드되는 것을 방지할 수 있습니다.다운로드를 원할 경우 반대로 브라우저의 새로운 요청을 원할 수 있습니다.php 페이지를 가리키는 간단한 버튼을 만들 수 있습니다.

다른 사람이 말한 내용을 반향하고 확장하려면 AJAX를 사용하여 파일을 보낼 수 없습니다.그 이유 중 하나는 당신이 현재 있는 페이지가 이미 콘텐츠 헤더를 보냈기 때문입니다. AJAX 요청(PHP 파일이 하려고 하는 것)으로도 같은 창으로 다시 보낼 수 없습니다.

프로젝트에서 제가 이전에 했던 것은 단순히 별도의 다운로드 PHP 페이지에 링크(target="_blank" 또는 javascript redirect)를 제공하는 것입니다.Apache를 사용하는 경우 mod_xsend 파일도 확인하십시오.

언급URL : https://stackoverflow.com/questions/3346072/download-csv-file-using-ajax