1.背景介紹
下載的資源是阿里云對(duì)象存儲(chǔ)，后臺(tái)將資源鏈接簽名后返回給前端,類(lèi)似下面的鏈接（隱去了域名，并且有有效時(shí)間，不可訪問(wèn)）
http://xxxxxx/book%2Foffline%2Fzip%2F2%2FISBN9787550245174_%E4%B8%80%E8%B5%B7%E6%9D%A5%E4%BC%A0%E8%AF%9D.zip?Expires=1565867136&OSSAccessKeyId=LTAIj9HegdJpycfI&Signature=9%2BmWUxAaGUZDq3CzMcsFcV4V7nQ%3D
理論上前端只需要將其包裹在<a>標(biāo)簽內(nèi)部即可
<a :href='url' ></a>
但實(shí)踐后發(fā)現(xiàn)默認(rèn)下載的文件名包含阿里云OSS的虛擬路徑，如果需求對(duì)這個(gè)名字不敏感，這個(gè)問(wèn)題可以忽略，但公司要求不能包含虛擬路徑
2.問(wèn)題原因
下載時(shí)，部分下載文件路勁被轉(zhuǎn)碼，轉(zhuǎn)碼前瀏覽器找到最后一個(gè)/并認(rèn)為之后的所有字符串（截止到參數(shù)?）是文件名即book%2Foffline%2Fzip%2F2%2FISBN9787550245174_%E4%B8%80%E8%B5%B7%E6%9D%A5%E4%BC%A0%E8%AF%9D.zip,轉(zhuǎn)碼后book/offline/zip/2/ISBN9787550245174_一起來(lái)傳話.zip
所以首先想到，在前端將URL轉(zhuǎn)碼，使用decodeURIComponent(注意與decodeURI的區(qū)別)
實(shí)踐后，點(diǎn)擊測(cè)試，貌似解決了問(wèn)題，但測(cè)試小姐姐說(shuō)，隨機(jī)會(huì)出現(xiàn)下載簽名失效的問(wèn)題，起初懷疑后臺(tái)簽名出問(wèn)題，但給出的回復(fù)是這是批量簽名，不會(huì)某一個(gè)失敗，所以還是要找原因
觀察截圖的簽名，中間出現(xiàn)了空格，實(shí)際上這是不可能的，所以確定是轉(zhuǎn)碼弄出的問(wèn)題
現(xiàn)在問(wèn)題就是，資源路徑需要解碼，而簽名信息需要編碼
所以最終解決辦法是在前端將前部分資源路徑解碼，而保持后部分簽名信息不變
http://xxxxxx/book/offline/zip/2/ISBN9787550245174_一起來(lái)傳話.zip?Expires=1565867136&OSSAccessKeyId=LTAIj9HegdJpycfI&Signature=9%2BmWUxAaGUZDq3CzMcsFcV4V7nQ%3D
代碼如下（全局filter）
const ossurl=function(url){
let index = url.indexOf("?")
if (index != -1) {
let sig = url.slice(index)
let urlexp = decodeURIComponent(url.slice(0, index))
return `${urlexp}${sig}`
}
return url
}
不知道這樣處理是不是最佳實(shí)踐，或者是其他錯(cuò)誤導(dǎo)致現(xiàn)在的結(jié)果，希望有了解的朋友幫忙指出
