1 發(fā)現(xiàn)問題
最近開發(fā)了 Excel 導(dǎo)入悄雅、導(dǎo)出工具，極大地提升了工作效率铁蹈，沾沾自喜中宽闲。然而把項(xiàng)目部署在測(cè)試環(huán)境上，卻發(fā)現(xiàn)在 chrome 中無法上傳文件握牧，日志報(bào)了以下錯(cuò)誤：
Uncaught DOMException: Failed to read the 'contentDocument' property from 'HTMLIFrameElement': Blocked a frame with origin "http://xx.xx.xxx.xxx:8081 " from accessing a cross-origin frame.
at HTMLIFrameElement.<anonymous>http://xx.xx.xxx.xxx:8081/static-v1.0.0/dwz/js/dwz.ajax.js:76:20
at HTMLIFrameElement.dispatch http://xx.xx.xxx.xxx:8081/static-v1.0.0/dwz/js/jquery-2.1.4.min.js:3:6466 )
at HTMLIFrameElement.r.handle http://xx.xx.xxx.xxx:8081/static-v1.0.0/dwz/js/jquery-2.1.4.min.js:3:3241
2 分析
看提示是在獲取 iframe 的 contentDocument 時(shí)出現(xiàn)的異常容诬，這個(gè)異常一般是因?yàn)闉g覽器的同源策略，即同域可讀可寫沿腰，跨域可讀但不可寫览徒。
但我們是在同一個(gè)項(xiàng)目?jī)?nèi)，調(diào)用的都是同一個(gè)域內(nèi)的 action 呀矫俺，所以我們?cè)诖思右粋€(gè)斷點(diǎn)吱殉，觀察實(shí)際上的 iframe ：
發(fā)現(xiàn)這個(gè) baseURI 有問題，正常的地址應(yīng)該是對(duì)應(yīng)模塊的 URI厘托，形如：
http://xxx/base/index#/xxx/table友雳，然而這里的地址卻是之前的某個(gè)模塊的 URL 地址（沒有使用 Excel 導(dǎo)入、導(dǎo)出工具）铅匹，也就是說押赊，瀏覽器并沒有認(rèn)出來這個(gè)新頁面的 URL 地址。
查看代碼，發(fā)現(xiàn)在通用的 freemarker 頁面中寫的是：
action="${contextPath}/${importUrl}"
而傳入的 URL 地址卻是：
"/xxx/importExcel"
合并后的地址是：
//xxx/importExcel
有沒有發(fā)現(xiàn)前面多了一個(gè) /流礁，所以導(dǎo)致瀏覽器的 frame 沒有把這個(gè)地址認(rèn)出來涕俗！
3 解決
去除這個(gè)多余的 /，就可以啦O(∩_∩)O~
