1. 程式人生 > >Uncaught DOMException: Blocked a frame with origin - 跨域資料問題及解決

Uncaught DOMException: Blocked a frame with origin - 跨域資料問題及解決

遇到需要使用視窗的功能,是這樣的 ,A站點的a1頁面為主要顯示頁面,但是需要呼叫B站點的b1介面用來儲存資料到B站點上,然後再將b1頁面獲取的地址體現到a1頁面上,在呼叫頁面的關閉事件的時候遇到問題:

Uncaught DOMException: Blocked a frame with origin 

瞭解出錯的錯誤資訊後百度了,都是寫了寫跨域的問題,修改地址為IP地址對本應用是不可取的,自己琢磨如何操作。通過頁面除錯Console 操作相當的程式碼:

  • window.top.parent_dialog.close()
  • window.parent_dialog.close();
  • window.parent.parent_dialog.close();
  • $(window.parent.document).find("#dialog-upload").data(“kendoWindow”).close();

均能正常關閉頁面檢視,然而除錯的時候,檢視是在子頁面上,並不找不到相關的ID。我猜測應該是獲取不到父頁面節點的問題,因為在報錯的位置上,並不會存在相關的節點資訊。

經過幾番測試,使用監聽方式傳送資料給父頁面,當父頁面接收到相關的資料後執行操作,解決了無法呼叫父頁面的操作。

子頁面:
var message = {s:"close",filePath:filePath}
                window.parent.postMessage(message, '*');
父頁面:
window.addEventListener('message', function (e) {
            //let target = e.target;
            let data = e.data;
            console.log(data);
            if (true)
            {
             	//****
            }           
        }, false);
        

解決。