Habitat Framework

          專注于Java EE企業(yè)級開發(fā)
          posts - 13, comments - 81, trackbacks - 0, articles - 5
            BlogJava :: 首頁 :: 新隨筆 :: 聯(lián)系 :: 聚合  :: 管理

          使用AJAX不可以跨域一直是一個麻煩的問題,
          最近做AJAX框架時發(fā)現(xiàn)一種方法,不僅可以跨域,而且相比XHR可以省去很多解析XML的步驟,
          后來居然發(fā)現(xiàn)GoogleMap的API就在用,非常驚喜,趕快分享一下

          test.html
          <html>
          <title>Dynamic Script Object</title>
          <head/>
          <body>
           <div id="jsArea">
            <script id="js" src=testa.js></script>
           </div>
           <br>
           <input type="button" value="test" onclick="testSrc()">
          </body>
          </html>
          <script>
          //author:Kerwin.Weng
          //mail:hunteva@163.com
           function testSrc(){
            var jsObj = document.getElementById("js");
            var body = jsObj.parentNode;
            body.removeChild(jsObj);
            jsObj = null;
            var newJS=document.createElement("script");
            newJS.id = "js";
            newJS.src = "testb.js";
            body.appendChild(newJS);
            jsArea.innerHTML="Asynchronous"
           }
           var jsArea = document.getElementById("jsArea");
          </script>

          testa.js
          document.write("This is A");

          testb.js
          setTimeout(function(){jsArea.innerHTML="This is B,now imagine i'm a servlet";},100)

          測試結(jié)果表明可以在不刷新頁面的情況下更新jsArea中的內(nèi)容,如果我們把testb.js換成一個servlet會怎么樣
          那不是可以在serverside直接寫數(shù)據(jù)或function給client用了嗎,完全不需要XHR來中轉(zhuǎn),省去了不少麻煩,而且還可以實現(xiàn)跨域訪問

          但是有兩點要注意,testb.js用document.write沒有作用,如果不用setTimeout,會直接讓我的IE7和IE6crush,具體原因不明,有牛人知道請告訴我
          目前在FF2.0.0.4/Opera9.2/IE7/IE6下測試通過.

          由于找了好久都不知道這種方式的官方名稱,并且很明顯這不Asynchronous JavaScript and XML,這里連XML和XmlHttp的影子都沒有,
          所以為了稱呼方便我暫時叫它DSSO(DynamicSwitchScriptObject),當(dāng)然這不是我發(fā)明的,Google不知道用了多久了,如果你知道準(zhǔn)確的名字請麻煩告知我

          現(xiàn)在我們比較下AJAX和DSSO的特點:
          AJAX DSSO
          跨域訪問 不支持 支持
          異步操作 支持 支持(body.appendChild后不需要等到完成才會繼續(xù),當(dāng)然完整的異步訪問需要另外的pattern來支持)
          數(shù)據(jù)載體 XML或JSON或TEXT 可以直接由server寫成Javascript
          操作復(fù)雜性 需要解析XML或JSON 可以直接使用

          目前暫時想到這么多可以比的,期待大家的討論

          評論

          # re: AJAX還有另一條路,不用XHR也可以無刷新從serverside拿數(shù)據(jù)更新頁面,還可以克服XHR不能跨域問題[未登錄]  回復(fù)  更多評論   

          2008-12-29 16:27 by Jelly
          你測試過它可以跨域么????????

          # re: AJAX還有另一條路,不用XHR也可以無刷新從serverside拿數(shù)據(jù)更新頁面,還可以克服XHR不能跨域問題[未登錄]  回復(fù)  更多評論   

          2008-12-29 20:00 by Kerwin Weng
          當(dāng)然試過,貌似Gmail和Google Reader就用這樣的方式在做嘛

          # re: AJAX還有另一條路,不用XHR也可以無刷新從serverside拿數(shù)據(jù)更新頁面,還可以克服XHR不能跨域問題[未登錄]  回復(fù)  更多評論   

          2008-12-30 10:14 by Jelly
          跨域這個問題的關(guān)鍵并不在于ajax或xhr,而是瀏覽器對于javascript的安全考慮不允許跨域,不允許不同域名之間js互相調(diào)用。
          我用firebug看到的結(jié)果是,gmail依然用的xhr去定時更新數(shù)據(jù),至于跨子域調(diào)用js是有辦法解決的。
          你給的例子和跨域沒有任何關(guān)系,我很難相信你試過用在一個域名下去get或post另一個域名的請求。

          # re: AJAX還有另一條路,不用XHR也可以無刷新從serverside拿數(shù)據(jù)更新頁面,還可以克服XHR不能跨域問題[未登錄]  回復(fù)  更多評論   

          2008-12-30 12:05 by Kerwin Weng
          上面的例子是把test.html放在www.aaa.com下,把創(chuàng)建script的src改成一個http://www.bbb.com/testb.js,也就是說動態(tài)引入另一個域的script,難道我們不可以在一個域的頁面引用另一個域的js?難道引入的JS無法訪問引入它的頁面的對象?
          而且我又重做了一次測試,結(jié)果還是證明可以跨域,而且Google Maps API也是這樣在操作,所以我只能說你不信就不信吧.

          沒有post或get,具體怎么提交數(shù)據(jù)已經(jīng)說得很清楚了

          # re: AJAX還有另一條路,不用XHR也可以無刷新從serverside拿數(shù)據(jù)更新頁面,還可以克服XHR不能跨域問題  回復(fù)  更多評論   

          2008-12-31 05:27 by Ajaxer
          這種方法可以跨域的,原理是通過動態(tài)修改script 標(biāo)簽的src屬性實現(xiàn)的,這個屬性是沒有跨域問題的。MapABC API的一個工具類就是這么做的。不能使用document.write的原因是用write輸出的代碼會與page加載的代碼沖突,而且不同的瀏覽器對write的代碼和頁面加載的代碼執(zhí)行的順序是不一樣的,所以盡量使用DOM的操作方式。

          # re: AJAX還有另一條路,不用XHR也可以無刷新從serverside拿數(shù)據(jù)更新頁面,還可以克服XHR不能跨域問題[未登錄]  回復(fù)  更多評論   

          2008-12-31 12:21 by Kerwin Weng
          的確document.write不是一種好的方式,測試原理的時候我是圖簡單省事,但是其他任何環(huán)境下都推薦使用Dom

          # re: AJAX還有另一條路,不用XHR也可以無刷新從serverside拿數(shù)據(jù)更新頁面,還可以克服XHR不能跨域問題  回復(fù)  更多評論   

          2013-07-12 21:22 by hypol
          你這不就類似jQuery的jsonp么。。
          主站蜘蛛池模板: 宝坻区| 太仆寺旗| 藁城市| 佛学| 庄河市| 武城县| 霞浦县| 富顺县| 涪陵区| 绩溪县| 广水市| 溧阳市| 昌吉市| 许昌市| 临清市| 娱乐| 襄樊市| 大宁县| 竹溪县| 南木林县| 济南市| 江津市| 常熟市| 红原县| 同心县| 朝阳区| 女性| 怀柔区| 四平市| 磴口县| 抚宁县| 于田县| 舟曲县| 同德县| 那坡县| 大理市| 峡江县| 综艺| 德格县| 衢州市| 朔州市|