programing tip

jQuery를 사용하여 파일 다운로드

itbloger 2020. 8. 7. 08:07
반응형

jQuery를 사용하여 파일 다운로드


사용자가 링크를 클릭 할 때 다운로드를 요청하려면 어떻게해야합니까?

예를 들어,

<a href="uploads/file.doc">Download Here</a>

다음을 사용할 수 있습니다.

<a href="#">Download Here</a>

 $('a').click... //Some jquery to download the file

이렇게하면 Google은 내 HREF 및 비공개 파일의 색인을 생성하지 않습니다.

jQuery로이 작업을 수행 할 수 있다면 어떻게해야합니까? 아니면 PHP 나 그 대신해야할까요?


다음을 사용하여보다 우아하게 저하되는 솔루션으로 이것을 제안 할 수 있습니다 preventDefault.

$('a').click(function(e) {
    e.preventDefault();  //stop the browser from following
    window.location.href = 'uploads/file.doc';
});

<a href="no-script.html">Download now!</a>

자바 스크립트가 없더라도 최소한 이렇게하면 사용자가 피드백을받을 수 있습니다.


검색 엔진이 특정 파일의 색인을 생성하지 않도록하려면 robots.txt사용 하여 웹 스파이더에게 웹 사이트의 특정 부분에 액세스하지 않도록 지시 할 수 있습니다.

자바 스크립트에만 의존하는 경우 자바 스크립트없이 탐색하는 일부 사용자는 링크를 클릭 할 수 없습니다.


다음은 검색 엔진에서 파일을 숨기는 다양한 방법을 보여주는 멋진 기사입니다.

http://antezeta.com/news/avoid-search-engine-indexing

자바 스크립트는 페이지 색인을 생성하지 않는 좋은 방법이 아닙니다. 사용자가 파일에 직접 링크하여 크롤러에게 공개하는 것을 방지하지 않으며 Rob이 언급했듯이 모든 사용자에게 작동하지 않습니다.
쉬운 해결 방법은 rel="nofollow"속성 을 추가하는 것입니다.하지만 robots.txt 없이는 완전하지 않습니다.

<a href="uploads/file.doc" rel="nofollow">Download Here</a>

예, window.location.href를 다운로드하려는 파일의 URL로 변경해야합니다.

window.location.href = 'http://www.com/path/to/file';

 var link=document.createElement('a');
 document.body.appendChild(link);
 link.href=url;
 link.click();

진술에 의해 window.location.href = 'uploads/file.doc';당신이 당신의 파일을 저장 어디 보여줍니다. 물론 .htacess를 사용하여 저장된 파일에 필요한 동작을 강제 할 수 있지만 항상 소수는 아닙니다 ....

서버 측 php-file을 생성하고 그 안에 다음 내용을 넣는 것이 좋습니다 :

header('Content-Type: application/octet-stream');
header('Content-Disposition: attachment; filename='.$_REQUEST['f']);
readfile('../some_folder/some_subfolder/'.$_REQUEST['f']); 
exit;

이 코드는 실제로 저장 한 위치를 표시하지 않고 모든 파일을 다운로드로 반환합니다.

이 PHP 파일을 다음을 통해 엽니 다. window.location.href = 'scripts/this_php_file.php?f=downloaded_file';


숨겨진 iframe 이 도움이 될 수 있습니다.


  • jQuery 함수 사용

        var valFileDownloadPath = 'http//:'+'your url';
    
       window.open(valFileDownloadPath , '_blank');
    

클릭 이벤트 전에 호출되는 mousedown 이벤트를 사용하는 것이 좋습니다. 이렇게하면 브라우저가 자연스럽게 클릭 이벤트를 처리하여 코드 이상을 방지 할 수 있습니다.

(function ($) {


    // with this solution, the browser handles the download link naturally (tested in chrome and firefox)
    $(document).ready(function () {

        var url = '/private/downloads/myfile123.pdf';
        $("a").on('mousedown', function () {
            $(this).attr("href", url);
        });

    });
})(jQuery);

jQuery를 사용하여 양식을 지우는 방법에 대한 유사한 게시물을 보려면 여기를 참조하십시오. jQuery로 다단계 양식 재설정

또한 struts 값 스택에 의해 값이 다시 채워지는 문제가 발생할 수 있습니다. 즉, 양식을 제출하고 조치 클래스에서 무엇이든 수행하지만 조치 클래스에서 관련 필드 값을 지우지 마십시오. 이 시나리오에서 양식은 이전에 제출 한 값을 유지하는 것처럼 보입니다. 어떤 식 으로든이를 지속하는 경우 지속 후 SUCCESS를 리턴하기 전에 조치 클래스의 각 필드 값을 널 (null)하십시오.

참고URL : https://stackoverflow.com/questions/1296085/download-file-using-jquery

반응형