?? 最近做了一個下載pdf文檔的需求，本以為使用HTML5中<a>標(biāo)簽的屬性download就能簡單搞定，不料IE竟然不支持這一簡單粗暴的H5新特性，而是直接在網(wǎng)頁中打開，

于是各種搜索之后得出以下結(jié)論：IE中下載文檔時，要想直接下載而不是在瀏覽器中打開，就要給下載的請求添加一些header屬性：

1、Content-Disposition: attachment; filename=filename 2、Content-Type: application/octet-stream;

?

現(xiàn)在以我做的項目為例，總結(jié)一下在IE中下載pdf等類型文檔的方法：

1、服務(wù)器端語言：PHP

2、前端語言：Jquery

因為要設(shè)置header，所以只能走服務(wù)器

第一步：前端創(chuàng)建一個下載文件的按鈕

<button class="btn btn-small btn-warning" id="df">下載pdf文檔</button>

?這里面的class是bootstrap中的樣式，用過bootstrap的人應(yīng)該都很熟悉，這里不再贅述

第二步：給這個按鈕添加點擊事件，當(dāng)點擊該按鈕時發(fā)起一個下載文檔的請求給服務(wù)器

$("#df").click(function(){$.ajax({url:"downloadFile",type : 'POST',dataType : 'json',success : function (m) {if (m.status == 1) {location.href = "downloadFile" } else {showAlert(m.info);}}}); });

這里使用ajax請求，downloadFile為請求的服務(wù)端方法，當(dāng)服務(wù)器接收到該請求之后就會做出響應(yīng)，即下一步

第三步：服務(wù)器接受并響應(yīng)請求

public function downloadHelp(){/*設(shè)置文檔的路徑*/$fileDir = SERVER_PATH . 'static/help/';if (IS_POST) {if (!is_dir($fileDir)) {mkdir($fileDir, 0777, true);}$filePath = $fileDir . '下載文檔.pdf';if (!is_file($filePath)) {$this->ajax_return(0,"文檔不存在");} else if (!is_readable($filePath)) {$this->ajax_return(0,"文檔不可讀");} else {$this->ajax_return(1);}} else {$ua = $_SERVER["HTTP_USER_AGENT"];$fileName = '下載文檔.pdf';$encoded_filename = urlencode($fileName);$encoded_filename = str_replace("+", "%20", $encoded_filename);$url = $fileDir . $fileName;$fileSize = filesize($url);header("Cache-Control: private");header("Content-Type: application/octet-stream;");header("Accept-Ranges: bytes");header("Accept-Length: " . $fileSize * 1024);/** 根據(jù)瀏覽器設(shè)置下載文件名稱為中文時的編碼*/if (preg_match("/MSIE/", $ua) || strpos($ua,"rv:11.0")) { header('Content-Disposition: attachment; filename="' . $encoded_filename . '"'); } else if (preg_match("/Firefox/", $ua)) { header('Content-Disposition: attachment; filename*="utf8\'\'' . $fileName . '"'); } else { header('Content-Disposition: attachment; filename="' . $fileName . '"'); } readfile($url);exit;} }

上面代碼中的方法其實是完成了兩次客戶端請求，

1、第一次請求方式是POST（可見js代碼中的ajax請求），所以這時會判斷文件是否存在以及是否具有讀取權(quán)限等
2、第二次請求方式是GET，所以這時會根據(jù)第一次請求的結(jié)果決定下一步

???? （1）當(dāng)staus="0",，提示"文檔不存在" or "文檔不可讀"?

　? （2）當(dāng)status="1"，設(shè)置header，并輸出文件

其中值得注意的是，當(dāng)下載的文件名為中文，且字符編碼是UTF-8時，要根據(jù)瀏覽器類型進(jìn)行設(shè)置，否則會出現(xiàn)文件名亂碼的情況，上面的代碼中已解決該問題，但是方法不止這一種，

所以再貼出解決下載文件名中文亂碼的兩種方法：

公共部分： $ua = $_SERVER["HTTP_USER_AGENT"]; $fileName = '下載文檔.pdf'; $encoded_filename = urlencode($fileName); $encoded_filename = str_replace("+", "%20", $encoded_filename); $url = $fileDir . $fileName;第一種方法： if (strpos($ua,"MSIE") || strpos($ua,"rv:11.0")) {header('Content-Disposition: attachment; filename="' . $encoded_filename . '"');} else if (strpos($ua,"Firefox")) {header('Content-Disposition: attachment; filename*="utf8\'\'' . $fileName . '"');}else {header('Content-Disposition: attachment; filename="' . $fileName . '"');}第二種方法： if (preg_match("/MSIE/", $ua) || strpos($ua,"rv:11.0")) { header('Content-Disposition: attachment; filename="' . $encoded_filename . '"'); } else if (preg_match("/Firefox/", $ua)) { header('Content-Disposition: attachment; filename*="utf8\'\'' . $fileName . '"'); } else { header('Content-Disposition: attachment; filename="' . $fileName . '"'); }

其實這兩種方法本質(zhì)上沒什么區(qū)別，只是我在測試的過程中發(fā)現(xiàn)，通過 $_SERVER["HTTP_USER_AGENT"]獲取的瀏覽器信息中，如果瀏覽器是IE（我用的是IE11），

就沒有“MSIE”這個字符串，導(dǎo)致即便是IE，strpos($ua,"MSIE")方法的結(jié)果還是false，所以無法解決IE中的亂碼問題，于是就用strpos($ua,"MSIE")和preg_match("/MSIE/", $ua) 兩種方法，

并在兩種方法中都加上?strpos($ua,"rv:11.0")，這樣才能判斷出是IE瀏覽器，也就能順利解決IE中文件名稱中文亂碼問題了。

以上就是本次下載pdf文檔的需求中總結(jié)出的，本以為是個很簡單的功能，沒想到當(dāng)它涉及到瀏覽器時竟有如此多的學(xué)問。

?

轉(zhuǎn)載于:https://www.cnblogs.com/hellowhy/p/6395147.html

總結(jié)

以上是生活随笔為你收集整理的项目中的那些事---下载pdf文件的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。