Tải xuống tệp bằng jQuery

Làm cách nào để nhắc tải xuống cho người dùng khi họ nhấp vào liên kết.

Ví dụ, thay vì:

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

Tôi có thể sử dụng:

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

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

Bằng cách này, Google không lập chỉ mục các tệp riêng tư và HREF của tôi.

Điều này có thể được thực hiện với jQuery, nếu vậy, làm thế nào? Hay điều này nên được thực hiện với PHP hoặc một cái gì đó thay thế?

Tôi có thể đề xuất điều này, như một giải pháp làm giảm hiệu quả hơn, bằng cách sử dụng 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>

Ngay cả khi không có Javascript, ít nhất bằng cách này, người dùng sẽ nhận được một số phản hồi.

Nếu bạn không muốn công cụ tìm kiếm lập chỉ mục các tệp nhất định, bạn có thể sử dụng robots.txt để thông báo cho trình thu thập dữ liệu web không truy cập vào một số phần nhất định của trang web của bạn.

Nếu bạn chỉ dựa vào javascript, thì một số người dùng duyệt mà không có nó sẽ không thể nhấp vào liên kết của bạn.

Đây là một bài viết hay chỉ ra nhiều cách ẩn tệp khỏi công cụ tìm kiếm:

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

JavaScript không phải là một cách tốt để không lập chỉ mục một trang; nó sẽ không ngăn người dùng liên kết trực tiếp đến tệp của bạn (và do đó tiết lộ nó cho trình thu thập thông tin) và như Rob đã đề cập, sẽ không hoạt động với tất cả người dùng.
Một cách khắc phục dễ dàng là thêm rel="nofollow"thuộc tính, tuy nhiên, một lần nữa, thuộc tính này không hoàn chỉnh nếu không có tệp robots.txt.

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

Có, bạn sẽ phải thay đổi window.location.href thành url của tệp bạn muốn tải xuống.

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

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

• Sử dụng hàm jQuery

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

Bằng cách nêu rõ window.location.href = 'uploads/file.doc';bạn hiển thị nơi bạn lưu trữ các tệp của mình. Tất nhiên, bạn có thể sử dụng .htacess để buộc hành vi cần thiết cho các tệp được lưu trữ, nhưng điều này có thể không phải lúc nào cũng hữu ích ....

Tốt hơn là tạo một tệp php phía máy chủ và đặt nội dung này vào đó:

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

Mã này sẽ trả về BẤT KỲ tệp nào dưới dạng tải xuống mà không hiển thị nơi bạn thực sự lưu trữ tệp đó.

Bạn mở tệp php này qua window.location.href = 'scripts/this_php_file.php?f=downloaded_file';

Iframe ẩn có thể giúp

Tôi khuyên bạn nên sử dụng sự kiện mousedown, được gọi là TRƯỚC sự kiện nhấp chuột. Bằng cách đó, trình duyệt xử lý sự kiện nhấp chuột một cách tự nhiên, tránh bất kỳ sự kỳ lạ nào của mã:

(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);

Xem bài đăng tương tự về cách sử dụng jQuery để xóa biểu mẫu tại đây: Đặt lại biểu mẫu nhiều giai đoạn với jQuery

Bạn cũng có thể gặp phải sự cố trong đó các giá trị đang được lập lại bởi ngăn xếp giá trị thanh chống. Nói cách khác, bạn gửi biểu mẫu của mình, thực hiện bất kỳ điều gì trong lớp hành động, nhưng không xóa các giá trị trường liên quan trong lớp hành động. Trong trường hợp này, biểu mẫu sẽ xuất hiện để duy trì các giá trị bạn đã gửi trước đó. Nếu bạn đang kiên trì những điều này theo một cách nào đó, chỉ cần bỏ trống mỗi giá trị trường trong lớp hành động của bạn sau khi kiên trì và trước khi trả về SUCCESS.