AJAX的跨域访问

新的W3C策略实现了HTTP跨域访问，还亏我找了很久的资料解决这个问题：

只需要在servlet中返回的头部信息中添加Access-Control-Allow-Origin这个既可。

比如我要开放所有我本地的跨域访问，就设置如下：response.setHeader("Access-Control-Allow-Origin", "http://127.0.0.1/*");

这样我本地的A工程中的AJAX请求就可以跨域请求B工程中的servlet。

 

代码如下：

HTML的js的ajax请求：

 

1. /* Create a new XMLHttpRequest object to talk to the Web server */
2. var xmlHttp = false;
3. /*@cc_on @*/
4. /*@if (@_jscript_version >= 5)
5. try {
6.     xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
7. } catch (e) {
8.     try {
9.         xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
10.     } catch (e2) {
11.         xmlHttp = false;
12.     }
13. }
14. @end @*/
15. if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
16.      xmlHttp = new XMLHttpRequest();
17. }
18. var url = "http://127.0.0.1:2012/esb/servlet/HttpClient?randomType=MIX";
19. xmlHttp.open("GET", url, true);
20. //Setup a function for the server to run when it's done
21. xmlHttp.onreadystatechange = function(){
22.     if (xmlHttp.readyState == 4) {
23.         var response = xmlHttp.responseText;
24.         alert(response);
25. }
26. }
27. //Send the request
28. xmlHttp.send(null);

 

 

servlet代码:

 

1. protected void service(HttpServletRequest req, HttpServletResponse resp)
2.                    throws ServletException, java.io.IOException {
3.       resp.setHeader("Pragma", "no-cache");
4.       resp.setHeader("Cache-Control", "no-cache");
5.       //下面那句是核心
6.       resp.setHeader("Access-Control-Allow-Origin", "http://127.0.0.1/*");
7.       resp.setDateHeader("Expires", 0);
8.       ServletOutputStream sos = resp.getOutputStream();
9.       try {
10.            sos.write(obj.toString().getBytes("GBK"));
11.        } catch (Exception e) {
12.            System.out.println(e.toString90)
13.        } finally {
14.               try {
15.                   sos.close();
16.               } catch (Exception e) {
17.                   LOG.error(e);
18.               }
19.        }
20. }

 

 

代码在本机测试是可以的，待过两天，我把servlet放到服务器上去，然后再本地测试。

文章出处：http://hi.baidu.com/aullik5/blog/item/12f2f8ec552da74878f0553f.html

 

 

      上面的方式虽然很完美的解决了问题，但是上面的文章也说了。可能存在安全问题，而且新标准是否都支持还是个问题，所以我们可以套用另外一种取巧的方式来完成同样的效果，因为js不存在跨域问题，如果我们服务器的servlet返回的是JS脚本，那就可以了。我们可以在A工程的js中使用JavaScript的src来访问B工程的servlet，然后通过servlet输出的js脚本来传递数据。因此根据这个思想我又做了下面代码的测试：

 页面的JS代码:

 

1. function loadAjax(){
2.      id="testesbscript";
3.      oScript = document.getElementById(id);
4.      var head = document.getElementsByTagName("head").item(0);
5.      if (oScript) {
6.         head.removeChild(oScript);
7.     }
8.     oScript = document.createElement("script");
9.     var url = "http://127.0.0.1:2012/esb/servlet/HttpClient?randomType=MIX&success=justHandle
10.     oScript.setAttribute("id",id);
11.     oScript.setAttribute("type","text/javascript");
12.     oScript.setAttribute("language","javascript");
13.     head.appendChild(oScript);
14. }
15. //jsutHandle这个函数是反调函数。servlet代码中会使用eval这种方式来执行。
16. function justHandle(dd){
17.     alert(dd);
18. }

 

servlet的代码:

 

1. protected void service(HttpServletRequest req, HttpServletResponse resp)

                       throws ServletException, Java.io.IOException {

    

         Object obj = "test";

         ServletOutputStream sos = resp.getOutputStream();

         StringBuffer sb = new StringBuffer();

         resp.setCharacterEncoding("GBK");

    

         resp.setHeader("Charset","GBK");

         resp.setContentType("charset=GBK");

         //下面那句表明是javascript脚本文件

         resp.setContentType("text/javascript");

    

         sb.append("eval(/""+paramMap.get("success")+"(/'"+obj.toString()+"/')/")");

         try {

             sos.write(sb.toString().getBytes(this.character_encoding));

         } catch (Exception e) {

             System.out.println(e.toString());

         } finally {

              try {

                  sos.close();

               } catch (Exception e) {

                  System.out.println(e.toString());

               }

         }

    

   }

    

 

参考：

 

    掌握AJAX：http://www.ibm.com/developerworks/cn/xml/wa-ajaxintro1.html

    AJAX跨域访问-方法大全:http://juliet./blog/180011

    baidu的Ajax跨域解析:http://www./ajax/ajax_BaiduCrossDomainMethod.php