13534259410
熱門服務
眾多企業的選擇
layer中子iframe跨域關掉父級iframe
網站建設
2023-10-22
次
在layer中如果iframe彈窗頁面為跨域請求時返回要關閉父級窗口時，會出現錯誤： Blocked a frame with origin “xxx“ from accessing a cross-origin frame
主要原因：
內嵌 iframe 頁面，一般使用 window.parent 或 window.top 來獲取父頁面的 window 對象
在子頁面 想使用(或傳遞給) 父頁面的參數，但是原因兩個的域名不一樣，所以會出現跨域問題。
解決方法：
1、父頁面監聽 message，寫法固定
window.addEventListener('message', function (e) {
console.log(e)
})
2、子頁面發送 message 消息，并附帶參數
// window.parent 是 iframe 子頁面獲取父頁面的 window 對象
// 后面的 * 號就是處理跨域問題的，任何域名都不會出現跨域問題
window.parent.postMessage("需要傳遞的參數", '*')
// 也可以指定傳送域名地址，這個域名不會出現跨域問題，寫父頁面(接收)域名地址
window.parent.postMessage("需要傳遞的參數", 'http://0.0.0.0:8080')
如果不跨域的話，關閉方法為：
layer.open({
content:data
,btn: ["確定"]
,yes: function (index,layero) {
let indexOfFather = parent.layer.getFrameIndex(window.name);
parent.layer.close(indexOfFather); //關閉頁面
window.parent.location.reload(); //刷新父頁面
}
})【版權聲明】:本站內容來自于與互聯網(注明原創稿件除外),供訪客免費學習需要。如文章或圖像侵犯到您的權益，請及時告知，我們第一時間刪除處理！謝謝！
? 猜您喜歡
- 外貿建站
- 東南亞語種
- 小語種建站
- 外貿推廣系統
- 海外營銷系統
- 外貿網站建設
- 海外獨立站建設
- 海外推廣
- 獨立站
- 跨境電商
- 外貿獨立站
- google詢盤
- wordpress建站
- wordpress教程
- 獨立站教程
- wordpress翻譯插件
- 多語種獨立站
- SSL證書
- 外貿網站
- 網站建設
- wordpress獨立站
- Google谷歌
- 獨立站搭建
- GoogleAds
- 關鍵詞規劃師
- googleads推廣
- 網站轉化率低
- 獨立站轉化低wordpress翻譯插件
- 獨立站費用
- 獨立站需要多少錢
- 外貿獨立站費用清單
- wordpress插件
- Sopify
- Ueeshop
- SaaS建站
- WordPress外貿網站
- wordpress獨立站wordpress翻譯插件
- shopify
- 轉化率
- 跨境電商wordpress翻譯插件
? 網站建設知識
? SEO/SEM推廣
? 常見問題
