在這之前我們先回顧以前用php導(dǎo)出excel，我直接寫成方法在這里：

public static function phpExcelList($field, $list, $title="文件",$file_time){$spreadsheet = new Spreadsheet();$sheet = $spreadsheet->getActiveSheet();foreach ($list as $key => $value) {    foreach ($field as $k => $v) {if ($key == 0) {    $sheet->setCellValue($k . "1", $v[1]);}$i = $key + 2; //表格是從2開始的$sheet->setCellValue($k . $i, $value[$v[0]]);    }}ob_clean();header("Content-type:application/vnd.ms-excel;charset=UTF-8");header("Content-Type: application/vnd.ms-excel");header("Content-Disposition: attachment;filename="".$title.".csv"");header("Cache-Control: max-age=0");$writer = new Csv($spreadsheet);$writer->save("php://output");exit;    }

一般有設(shè)置charset基本在前端就沒啥問題，問題就在于vue導(dǎo)出時就出現(xiàn)亂碼了，有可能是這個，大多數(shù)網(wǎng)友的解決方案就是在請求里邊加上參數(shù)：responseType: 'blob', // 表明返回服務(wù)器返回的數(shù)據(jù)類型，但這里我已經(jīng)提前申明返回的數(shù)據(jù)是正常的，這時候又會咋樣呢？

咱們試試用國產(chǎn)的wps打開吧：

咦？沒問題？再用office打開：啊哈》》？what？

那問題出在哪里呢？讀入的文件是utf-8格式，下載下來Excel打開亂碼，但是用其他編輯器打開并不是亂碼，一開始解決問題的思路是，下載文件的時候，是不是沒有指定編碼方式，導(dǎo)致文件編碼方式不對，于是乎使用了Blob里的type參數(shù)，硬塞了一個類型以及編碼方式，但是這種方法似乎并不管用，仔細(xì)讀了官方文檔之后，關(guān)于type的解讀如下：

type，默認(rèn)值為 “”，它代表了將會被放入到blob中的數(shù)組內(nèi)容的MIME類型。

這里明確表明，此type只是一個類型標(biāo)記，并不會起到轉(zhuǎn)碼的作用，想想也是，blob僅僅是內(nèi)存里開辟的0，1代碼，怎么可能在下載的過程中去解碼編碼呢？

發(fā)現(xiàn)這其實(shí)是微軟家的坑，微軟家發(fā)明了一個東西叫bom頭，關(guān)于bom頭：

類似WINDOWS自帶的記事本等軟件，在保存一個以UTF-8編碼的文件時，會在文件開始的地方插入U(xiǎn)TF-8 BOM頭。記事本等編輯器通過它來識別這個文件是否以UTF-8編碼(當(dāng)然即便沒有UTF-8 BOM頭記事本也能通過其它方式正確識別UTF-8編碼)。

那么如果一個UTF-8編碼的字符串的開頭處沒有BOM頭又會發(fā)生什么？答：不認(rèn)識你，亂碼給你看

所以我們在這需要手動加一個微軟看得懂的BOM頭：

window.URL.createObjectURL(new Blob(['\uFEFF' + content]))

總的代碼示例如下，不懂可以直接抄：

this.$http.get(common.webapi+"/api/exportExcel",{params:{參數(shù)名稱：參數(shù)值}}, {emulateJSON:true,responseType: "blob"}).then((res)=>{      if(res.data){      const link = document.createElement("a");// 創(chuàng)建a標(biāo)簽      let blob = new Blob(["\uFEFF" + res.data],{type: "application/vnd.ms-excel;"}); // 設(shè)置文件類型并在返回值前加bom頭，避免亂碼      link.style.display = "none";      link.href = URL.createObjectURL(blob); // 創(chuàng)建URL      link.setAttribute("download", "數(shù)據(jù)"+ this.$moment(new Date().getTime()).format("YYYY-MM-DD")+".csv");      document.body.appendChild(link);      link.click();      document.body.removeChild(link);      //如果不會出現(xiàn)亂碼，直接一句代碼搞定：this.$fileDownload(res.data, "發(fā)票數(shù)據(jù)"+ this.$moment(new Date().getTime()).format("YYYY-MM-DD")+".csv")     }     })

//如果不會出現(xiàn)亂碼，直接一句代碼搞定：this.$fileDownload(res.data, "數(shù)據(jù)"+ this.$moment(new Date().getTime()).format("YYYY-MM-DD")+'.csv')，接下來就是見證奇跡的時刻：

到此這篇關(guān)于PHP結(jié)合vue導(dǎo)出excel出現(xiàn)亂碼的解決方法分享的文章就介紹到這了,更多相關(guān)PHP導(dǎo)出excel出現(xiàn)亂碼內(nèi)容請搜索以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持！