如何用JS和PHP实现无刷新下载功能？

2026-04-06 16:511阅读0评论SEO资讯

内容介绍
文章标签
相关推荐

本文共计448个文字，预计阅读时间需要2分钟。

JavaScript结合PHP实现下载功能，服务端步骤包括：

1.设置头文件参数。

2.读取并输出文件。

代码示例：

php

if (file_exists($path . '/' . $filename)) { header('Content-Description: File Transfer'); header('Content-Type: application/octet-stream'); header('Content-Disposition: attachment; filename=' . basename($filename) . ''); header('Expires: 0'); header('Cache-Control: must-revalidate'); header('Pragma: public'); header('Content-Length: ' . filesize($path . '/' . $filename));

ob_clean(); flush(); readfile($path . '/' . $filename); exit;}?>

js结合php实现下载功能

服务端

步骤就是，设置头文件参数，然后读入并输出文件。下面代码的file_get_contents可以使用fread，fclose代替。

download.php

<?php $filename = $_GET['filename']; $path = __DIR__."/file/".$filename; header( "Content-type: application/octet-stream"); header( "Accept-Ranges: bytes "); header( "Accept-Length: " .filesize($filename)); header( "Content-Disposition: attachment; filename={$filename}"); echo file_get_contents($filename);

客户端

在很多时候，我们下载文件的操作，都是在前端页面直接点击下载的，而不是专门跳转到上面的download.php去下载。

所以我们需要在前端实现无刷新访问download.php来下载文件，通过隐藏的iframe来实现是不错的方式。下面是代码：

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <a href="javascript:download_file('localhost/download.php?filename=\" rel="external nofollow" 测试文件.doc\"')">下载</a> <script type="text/javascript"> function download_file(url) { if (typeof (download_file.iframe) == "undefined") { var iframe = document.createElement("iframe"); download_file.iframe = iframe; document.body.appendChild(download_file.iframe); } //alert(download_file.iframe); download_file.iframe.src = url; download_file.iframe.style.display = "none"; } </script> </body> </html>

file_get_contents先读取，然后echo的方式。可以使用readfile函数代替，效率更高。

以上就是js php实现无刷新下载功能的详细内容，更多请关注自由互联其它相关文章！

标签：PHP 实现无刷新下载