專利名稱：Web頁面跨域通信方法和裝置的制作方法
技術領域：
本發(fā)明涉及網(wǎng)絡技術，特別涉及一種Web頁面跨域通信方法和裝置。
背景技術：
API (Application Programming Interface,應用程序編程接口)是一些預先定義的函數(shù)，目的是提供應用程序(或開發(fā)人員)基于某軟件(或硬件)的訪問一組例程的能力，而又無需訪問軟件的源碼，或理解軟件的內部工作機制的細節(jié)。Windows API是一套用來控制Windows的各個部件的外觀和行為的預先定義的Windows函數(shù)。用戶的每個動作都會引發(fā)一個或幾個函數(shù)的運行以告訴Windows發(fā)生了什么。一個HTML頁面可以有一個或多個Web子頁面(子框架)，Web子頁面中可以嵌套Web子頁面,這些Web子頁面可能屬于不同的域,而不同域的Web子頁面之間也有相互通信的需求。但是IE8版本以前的瀏覽器出于安全的考慮，不能自動支持不同域的Web頁面之間的跨域通信，而IE8版本以前的瀏覽器又占有很大的市場份額。因此，需要解決IE8版本以前的瀏覽器中不同域的Web頁面之間的跨域通信的問題。傳統(tǒng)的方法是設置一臺中轉服務器，需要跨域通信的兩個Web頁面通過中轉服務器通信。還有一種方法是采用部署代理文件的方式，例如，在域名為A的Web頁面中部署域名為B的Web頁面的代理文件，并在域名為B的Web頁面中部署域名為A的Web頁面的代理文件，兩個Web頁面通過代理文件實現(xiàn)跨域通信。但是，上述設置中轉服務 器的方法會帶來額外的開銷，增加了成本，而采用部署代理文件的方法，則也需要較高的部署成本。

發(fā)明內容基于此，有必要提供一種能減少成本的Web頁面跨域通信方法。一種Web頁面跨域通信方法，包括以下步驟:添加能被不同域的Web頁面訪問的API對象，所述對象實現(xiàn)了消息通知方法以及所述方法的監(jiān)聽事件；綁定第一 Web頁面的回調函數(shù)與所述監(jiān)聽事件；在第二 Web頁面向所述第一 Web頁面發(fā)送消息時,調用所述消息通知方法；觸發(fā)所述監(jiān)聽事件，將所述消息傳遞給所述第一 Web頁面的回調函數(shù)；其中，所述第一 Web頁面與所述第二 Web頁面屬于不同的域。此外，還有必要提供一種能減少成本的Web頁面跨域通信裝置。一種Web頁面跨域通信裝置,包括:初始化模塊，用于添加能被不同域的Web頁面訪問的API對象，所述對象實現(xiàn)了消息通知方法以及所述方法的監(jiān)聽事件，以及綁定第一 Web頁面的回調函數(shù)與所述監(jiān)聽事件；消息通知模塊，用于在第二 Web頁面向所述第一 Web頁面發(fā)送消息時，調用所述消息通知方法；回傳模塊，用于觸發(fā)所述監(jiān)聽事件，將所述消息傳遞給所述第一 Web頁面的回調函數(shù)；其中，所述第一 Web頁面與所述第二 Web頁面屬于不同的域。上述Web頁面跨域通信方法及裝置，通過添加能被不同域的Web頁面訪問的、且實現(xiàn)了消息通知方法以及該方法的監(jiān)聽事件的API對象，不同域的Web頁面都可調用此API對象的消息通知方法發(fā)送消息，還可以綁定其回調函數(shù)與消息通知方法的監(jiān)聽事件，以響應向該Web頁面?zhèn)魉偷南?，實現(xiàn)了不同域的Web頁面之間的跨域通信。由于不需要設置中轉服務器或者部署代理文件來進行跨域通信，因此上述Web頁面跨域通信方法和裝置能減少成本。

圖1為一個實施例中的Web頁面跨域通信方法的流程示意圖；圖2為一個實施例中第一 Web頁面與第二 Web頁面通信的示意圖；圖3為一個實施例中的Web頁面跨域通信裝置的結構示意圖。
具體實施方式如圖1所示，在一個實施例中，一種Web頁面跨域通信方法，包括以下步驟:步驟S10,添加能被不同域的Web頁面訪問的API對象,該對象實現(xiàn)了消息通知方法以及該方法的監(jiān)聽事件。具體的，在一個實施例中，該API對象為窗口對象的全局成員對象。由于Web頁面都繼承自它們的基類，即窗口對象(window對象)，屬于不同域的Web頁面都可訪問窗口對象的全局成員對象(即external成員)，因此API對象可以為窗口對象的全局成員對象，以能夠被不同域的Web頁面訪問。該API對象為窗口對象的全局成員對象，則不同域的Web頁面都可調用該API對象的消息通知方法來傳送消息。進一步的，為了響應消息通知方法傳送的消息，該API對象還實現(xiàn)消息通知方法的監(jiān)聽事件。當消息通知方法被調用時，即可觸發(fā)監(jiān)聽事件。在一個實施例中，API對象可封裝在瀏覽器插件或瀏覽器擴展組件中、或者內置于瀏覽器中。具體的，對于基于組件對象模型(component object model,COM)的瀏覽器,如IE瀏覽器，可將該API對象封裝在瀏覽器的擴展組件中，因為IE瀏覽器內核有一種擴展機制，提供了專門的接口(擴展組件)來實現(xiàn)窗口對象(window對象)的全局成員對象(external成員)。另外，對于可安裝瀏覽器插件的瀏覽器，API對象也可封裝在瀏覽器插件中，并通過安裝瀏覽器插件來添加API對象；其次，對于可自定義的瀏覽器，可直接將API對象添加到瀏覽器的代碼中。步驟S20,綁定第一 Web頁面的回調函數(shù)與上述監(jiān)聽事件。具體的，可在第一 Web頁面加載時或在加載完成后注冊API對象的消息通知方法的監(jiān)聽事件，即綁定頁面的回調函數(shù)與該監(jiān)聽 事件。觸發(fā)該監(jiān)聽事件即是觸發(fā)回調函數(shù)，因此當消息通知方法被調用時，即可觸發(fā)回調函數(shù)以響應消息通知方法通知的消息。
步驟S30，在第二 Web頁面向第一 Web頁面發(fā)送消息時，調用API對象的消息通知方法，其中，第一 Web頁面和第二 Web頁面屬于不同的域。由于添加的該API對象可被不同域的Web頁面訪問，因此在第二 Web頁面向第一Web頁面發(fā)送消息時，可將第二 Web頁面要發(fā)送的消息傳遞給消息通知方法，并調用該消息通知方法。在一個實施例中，調用API對象的消息通知方法的步驟為:將第一 Web頁面的屬性信息及第二 Web頁面的消息傳遞給該消息通知方法，調用該消息通知方法。具體的，第一Web頁面的屬性信息可包括第一 Web頁面的名稱、所屬域名等。將第一 Web頁面的屬性信息傳遞給消息通知方法，這樣便能根據(jù)第一 Web頁面的屬性信息將消息正確地傳送到第一Web頁面。步驟S40，觸發(fā)上述監(jiān)聽事件，將第二 Web頁面的消息傳遞給第一 Web頁面的回調函數(shù)。在一個實施例中，在將第二 Web頁面的消息傳遞給第一 Web頁面的回調函數(shù)之前，還包括:根據(jù)傳遞給API對象的消息通知方法的第一 Web頁面的屬性信息查找第一 Web頁面的回調函數(shù)。具體的，API對象的監(jiān)聽事件可能與多個頁面的回調函數(shù)綁定，所以在監(jiān)聽事件被觸發(fā)后，需要判斷把消息傳送給哪個頁面的回調函數(shù)?？筛鶕?jù)在上述傳遞給API對象的消息通知方法的第一 Web頁面的屬性信息來查找第一 Web頁面的回調函數(shù)。進一步的，將第二 Web頁面的消息傳遞給第一 Web頁面的回調函數(shù)。第一 Web頁面的回調函數(shù)可以對第二Web頁面的消息作相應的處理。在一個實施例中，如圖2所示，第一 Web頁面與第二 Web頁面屬于不同的域。具體的,第一 Web頁面和第二 Web頁面可以包含于一個HTML頁面中，例如，是HTML頁面中的兩個Frame (也稱IFrame, HTML頁面中的frame標簽定義了一個框架)。本實施例中，第二 Web頁面嵌套在第一 Web頁面中。應當說明的是，第一 Web頁面與第二 Web頁面也可以是并列關系。本實施例中，external成員為添加的能被不同域的Web頁面訪問的API對象，第一Web頁面和第二 Web頁面之間進行跨域通信的過程如下:(I)綁定第一 Web頁面的回調函數(shù)與external成員的監(jiān)聽事件。(2)在第二 Web頁面向第一 Web頁面發(fā)送消息時,將消息傳遞給external成員的消息通知方法，并調用該消息通知方法。(3)觸發(fā)external成員的監(jiān)聽事件,將消息傳遞給第一 Web頁面的回調函數(shù)。第一 Web頁面的回調函數(shù)可以對該消息作相應的處理，完成第一 Web頁面和第二 Web頁面之間的通信。如圖3所示，在一個實施例中，一種Web頁面跨域通信裝置，包括初始化模塊10、消息通知模塊20和回傳模塊30，其中:初始化模塊10用于添加能被不同域的Web頁面訪問的API對象，該對象實現(xiàn)了消息通知方法以及該方法的監(jiān)聽事件。具體的，在一個實施例中，該API對象為窗口對象的全局成員對象。由于Web頁面都繼承自它們的基類，即窗口對象(window對象)，屬于不同域的Web頁面都可訪問窗口對象的全局成員對象(即external成員)，因此API對象可以為窗口對象的全局成員對象，以能夠被不同域的Web頁面訪問。該API對象為窗口對象的全局成員對象，則不同域的Web頁面都可調用該API對象的消息通知方法來傳送消息。進一步的，為了響應消息通知方法傳送的消息，該API對象還實現(xiàn)消息通知方法的監(jiān)聽事件。當消息通知方法被調用時，即可觸發(fā)監(jiān)聽事件。在一個實施例中，API對象可封裝在瀏覽器插件或瀏覽器擴展組件中、或者內置于瀏覽器中。具體的，對于基于組件對象模型(component object model,COM)的瀏覽器,如IE瀏覽器，可將該API對象封裝在瀏覽器的擴展組件中，因為IE瀏覽器內核有一種擴展機制，提供了專門的接口(擴展組件)來實現(xiàn)窗口對象(window對象)的全局成員對象(external成員)。另外，對于可安裝瀏覽器插件的瀏覽器，API對象也可封裝在瀏覽器插件中，并通過安裝瀏覽器插件來添加API對象；其次，對于可自定義的瀏覽器，可直接將API對象添加到瀏覽器的代碼中。初始化模塊10還用于綁定第一 Web頁面的回調函數(shù)與上述監(jiān)聽事件。具體的，初始化模塊10可在第一 Web頁面加載時或在加載完成后注冊API對象的消息通知方法的監(jiān)聽事件，即綁定頁面的回調函數(shù)與該監(jiān)聽事件。觸發(fā)該監(jiān)聽事件即是觸發(fā)回調函數(shù)，因此當消息通知方法被調用時，即可觸發(fā)回調函數(shù)以響應消息通知方法通知的消息。消息通知模塊20用于在第二 Web頁面向第一 Web頁面發(fā)送消息時,調用API對象的消息通知方法，其中，第一 Web頁面和第二 Web頁面屬于不同的域。由于添加的該API對象可被不同域的Web頁面訪問，因此在第二 Web頁面向第一Web頁面發(fā)送消息時，消息通知模塊20可用于將第二 Web頁面的消息傳遞給消息通知方法，并調用該消息通知方法。在一個實施例中，在第二 Web頁面向第一 Web頁面發(fā)送消息時，消息通知模塊20用于將第一 Web頁面的屬性信息及第二 Web頁面的消息傳遞給該消息通知方法，調用該消息通知方法。具體的，第一 Web頁面的屬性信息可包括第一 Web頁面的名稱、所屬域名等。將第一 Web頁面的屬性信息傳遞給消息通知方法，這樣便能根據(jù)第一 Web頁面的屬性信息將消息正確地傳送到第一 Web頁面?；貍髂K30用于觸發(fā)上述監(jiān)聽事件，將第二 Web頁面的消息傳遞給第一 Web頁面的回調函數(shù)。在一個實施例中，在將第二 Web頁面的消息傳遞給第一 Web頁面的回調函數(shù)之前，回傳模塊30根據(jù)傳遞給API對象的消息通知方法的第一 Web頁面的屬性信息查找第一 Web頁面的回調函數(shù)。具體的，API對象的監(jiān)聽事件可能與多個頁面的回調函數(shù)綁定，所以在監(jiān)聽事件被觸發(fā)后，回傳模塊30需要判斷把消息傳送給哪個頁面的回調函數(shù)?？筛鶕?jù)在上述傳遞給API對象的消息通知方法的第一 Web頁面的屬性信息來查找第一 Web頁面的回調函數(shù)。進一步的，回傳模塊30用于將第二 Web頁面的消息傳遞給第一 Web頁面的回調函數(shù)。第一Web頁面的回調函數(shù)可以對第二 Web頁面的消息作相應的處理。上述Web頁面跨域通信方法和裝置，通過添加能被不同域的Web頁面訪問的、且實現(xiàn)了消息通知方法以及該方法的監(jiān)聽事件的API對象，不同域的Web頁面都可調用此API對象的消息通知方法發(fā)送消息，還可以綁定其回調函數(shù)與消息通知方法的監(jiān)聽事件，以響應向該Web頁面?zhèn)魉偷南?，實現(xiàn)了不同域的Web頁面之間的跨域通信，上述方式操作簡便，不需要設置中轉服務器或者部署代理文件來進行跨域通信，從而節(jié)約了成本。以上所述實施例僅表達了本發(fā)明的幾種實施方式，其描述較為具體和詳細，但并不能因此而理解為對本發(fā)明專利范圍的限制。應當指出的是，對于本領域的普通技術人員來說，在不脫離本發(fā)明構思的前提下，還可以做出若干變形和改進，這些都屬于本發(fā)明的保護范圍。因此，本發(fā)明專利的保護范圍應以所附權利要求為準。
權利要求
1.一種Web頁面跨域通信方法，包括以下步驟: 添加能被不同域的Web頁面訪問的API對象，所述對象實現(xiàn)了消息通知方法以及所述方法的監(jiān)聽事件； 綁定第一 Web頁面的回調函數(shù)與所述監(jiān)聽事件； 在第二 Web頁面向所述第一 Web頁面發(fā)送消息時，調用所述消息通知方法； 觸發(fā)所述監(jiān)聽事件，將所述消息傳遞給所述第一 Web頁面的回調函數(shù)； 其中，所述第一 Web頁面與所述第二 Web頁面屬于不同的域。
2.根據(jù)權利要求1所述的Web頁面跨域通信方法，其特征在于，所述API對象封裝在瀏覽器插件或瀏覽器擴展組件中、或者內置于瀏覽器中。
3.根據(jù)權利要求1所述的Web頁面跨域通信方法，其特征在于，所述調用所述消息通知方法的步驟為:將所述第一 Web頁面的屬性信息及所述消息傳遞給所述消息通知方法，調用所述方法。
4.根據(jù)權利要求3所述的Web頁面跨域通信方法，其特征在于，在所述將消息傳遞給所述第一 Web頁面的回調函數(shù)的步驟之前，還包括: 根據(jù)所述傳遞給消息通知方法的第一 Web頁面的屬性信息查找所述第一 Web頁面的回調函數(shù)。
5.根據(jù)權利要求1至4任意一項所述的Web頁面跨域通信方法，其特征在于，所述API對象為窗口對象的全局成員對象。
6.一種Web頁面跨域通信裝置，其特征在于，包括: 初始化模塊，用于添加能被不同域的Web頁面訪問的API對象，所述對象實現(xiàn)了消息通知方法以及所述方法的監(jiān)聽事件，以及綁定第一 Web頁面的回調函數(shù)與所述監(jiān)聽事件； 消息通知模塊，用于在第二 Web頁面向所述第一 Web頁面發(fā)送消息時，調用所述消息通知方法； 回傳模塊，用于觸發(fā)所述監(jiān)聽事件，將所述消息傳遞給所述第一 Web頁面的回調函數(shù)； 其中，所述第一 Web頁面與所述第二 Web頁面屬于不同的域。
7.根據(jù)權利要求6所述的Web頁面跨域通信裝置，其特征在于，所述API對象封裝在瀏覽器插件或瀏覽器擴展組件中、或者內置于瀏覽器中。
8.根據(jù)權利要求6所述的Web頁面跨域通信裝置，其特征在于，所述消息通知模塊還用于將所述第一 Web頁面的屬性信息及所述消息傳遞給所述消息通知方法，調用所述方法。
9.根據(jù)權利要求8所述的Web頁面跨域通信裝置，其特征在于，所述回傳模塊還用于觸發(fā)所述監(jiān)聽事件，根據(jù)所述傳遞給消息通知方法的第一 Web頁面的屬性信息查找所述第一Web頁面的回調函數(shù)，將所述消息傳遞給所述第一 Web頁面的回調函數(shù)。
10.根據(jù)權利要求6至9任意一項所述的Web頁面跨域通信裝置，其特征在于，所述API對象為窗口對象的全局成員對象。
全文摘要
一種Web頁面跨域通信方法，包括以下步驟添加能被不同域的Web頁面訪問的API對象，所述對象實現(xiàn)了消息通知方法以及所述方法的監(jiān)聽事件；綁定第一Web頁面的回調函數(shù)與所述監(jiān)聽事件；在第二Web頁面向所述第一Web頁面發(fā)送消息時，調用所述消息通知方法；觸發(fā)所述監(jiān)聽事件，將所述消息傳遞給所述第一Web頁面的回調函數(shù)；所述第一Web頁面與所述第二Web頁面屬于不同的域。上述Web頁面跨域通信方法實現(xiàn)了不同域的Web頁面之間的跨域通信，且成本較低。此外，還提供一種Web頁面跨域通信裝置。
文檔編號H04L29/06GK103095762SQ20111034232
公開日2013年5月8日 申請日期2011年11月2日 優(yōu)先權日2011年11月2日
發(fā)明者黃奎, 李臨, 郭學亨, 龍丁奮 申請人:騰訊科技(深圳)有限公司