主题词：YUI AJAX 跨域

     一、前言

     AJAX的POST及GET方式提交相信已经被人们熟知了，且应用面非常广，在同一工程中实现起来非常简单。由于项目的需要在本项目中跨域是很正常的现象，如何实现在同一项目的不同域中实现提交就摆在我们面前了。  

     二、方法分析

     1.ajax+webservice

     这是一种比较常用的模式。WEBSERVICE中返回的是XML结构,ajax直接对XML进行操作.

     2.ajax+wcf

     fm3.0的中新增的wcf，对以上的模式进行了优化，允许返回json形式，这种形式跟今天探讨的理论可能是一样的,我对wcf也是刚刚学习内部机理还不是太了解,不敢妄加断言.

     2.内嵌js实现方式

     这是今天要讨论的。

     众所周知，在浏览器中css和JS是允许跨域调用的，因为这种都是资源性文件，w3c是不会限制他们跨域的。这种方式是利用这种方式，在服务器端生成JSON代码，页面以调用JS的形式调用这个服务器端生成的JSON页面，以实现提交及接收返回值。

     YUI中具体的实现方法可以参见YAHOO开发者社区。

     三、YUI实现

     为了比较实现方式，利用YUI制作了本域内AJAX提交及跨域提交两部分。

     1. 制作HTML的调用页面

         调用YUI基础JS:

Code
<!--共通调用-->
<script type="text/javascript" src="JS/yahoo-min.js"></script>
<!--传统AJAX提交-->
<script type="text/javascript" src="JS/event-min.js"></script>
<script type="text/javascript" src="JS/connection-min.js"></script>
<!--跨域提交-->
<script type="text/javascript" src="JS/get-min.js"></script>

         JS调用内容: 

Code
<script type="text/javascript">
       //ajax成功处理
        var handleSuccess = function(o){
            alert(o.responseText);
        };
        //javascript成功处理
        var handleJsSuccess = function(o){
            alert(data[0].mess);
        };
        //失败处理
        var handleFailure = function(o){
            alert('connect service failt');
        };
        //传统ajax callback
        var callback =
        {
          success:handleSuccess,
          failure:handleFailure
        };
        //传统ajax post
        function makeRequest_Ajax_Post(){
            var postData = "a=b";
            var request = YAHOO.util.Connect.asyncRequest('POST', "../Ajax.aspx", callback, postData);
        }
        //传统ajax get
        function makeRequest_Ajax_Get(){
            var request = YAHOO.util.Connect.asyncRequest('GET', "../Ajax.aspx?b=c", callback);
        }
        //跨域提交
        function makeRequest(){
            //此处url需要改为不在本域的地址,该页需要返回json数据
            var request = YAHOO.util.Get.script("http://localhost:8313/yui_post_get_host/Json.aspx?a=b",
                                            { onSuccess: handleJsSuccess, 
                                              onFailure: handleFailure
                                            });
        }
    </script>

          调用控件

Code
<input id="btnAjaxPost" type="button" onclick="makeRequest_Ajax_Post();" value="传统AJAX_POST提交" />
        <input id="btnAjaxGet" type="button" onclick="makeRequest_Ajax_Get();" value="传统AJAX_GET提交" />
        <input id="btnJson" type="button" onclick="makeRequest();" value="跨域提交" />

     2.服务器端JSON生成:不分语言，不分平台。实现的方法很多,只要符合JSON的格式就可.

        简单JSON示例:

        var data = [{'mess':'ok'}];

     四、总结

     YUI是我比较喜欢的框架，原来用过一阵的EXT，感觉对页面的编辑上有些不自由。我个人感觉YUI从上手和自由度上要好一些，EXT在集成度上，快速实现界而UI上要好一些。

     五、源码下载

     http://files.cnblogs.com/delphiren/yui_post_get_host.rar

     六、参考资料

     http://developer.yahoo.com/yui/   YAHOO YUI社区

     http://json.org/json-zh.html    json介绍

     ASP.NET不知不觉中已经更新到3.5版本了,相信有很多朋友会由2.0迁移到3.5,我就是其中之一.为了节省我们的宝贵开发时间,尽量压缩在迁移的过程中所消耗成本,此文将以维基百科形式不断更新, 有兴趣的朋友可以在留言中把自己在工作中遇到的这方面的问题写出来,我会整理到此篇文章中.我先来一条,请博友们以此形式留言.

     一、基本 

    资源本地化时初始化语言变更 

     2.0:

          重写OnPreInit方法或InitializeCulture方法,并将语言编码覆给UICulture,Culture即可将该页面初始化此种语言.  

1protected override void OnPreInit(EventArgs e)
2{
3   this.Page.UICulture = this.Page.Culture = "ZH-CN";
4   base.OnPreInit(e);
5}

或者

Code
1protected override void InitializeCulture()
2{
3   this.Page.UICulture = this.Page.Culture = "JA-JP";
4   base.InitializeCulture();
5}

     3.5:

          不再支持OnPreInit方法.

     属性定义

     2.0

Code
1String _name;
2public String Name
3{
4    set{_name = value;}
5    get{return _name;}
6}

     3.0、3.5

Code
1public String Name
2{
3    get;set;
4}