ASP.NET AJAX初学体验之客户端访问WebService(2)

今天要说的是客户端访问WebService--序列化与反序列化

我还是第一次在ASP.NET AJAX里听到序列化

==========================Demo1=====================

Demo1演示的是在客户端用JSON字符

先添加引用

<asp:ScriptManager ID="ScriptManager1" runat="server">
            <Services>
                <asp:ServiceReference Path="ColorService.asmx" InlineScript="true" />
            </Services>
        </asp:ScriptManager>

看看Javascript如何调用WebService，这里的数据类型为Complex

 <script language="javascript" type="text/javascript">
            function ReverseColor()
            {
                //JSON序列化字符
                var color = {"Red" : 50, "Green" : 100, "Blue" : 200};
                ColorService.Reverse(color, onSucceeded);
            }
            
            function onSucceeded(result)
            {
                alert(String.format(
                    "Red: {0}\nGreen: {1}\nBlue: {2}",
                    result.Red,
                    result.Green,
                    result.Blue));
            }            
        </script>

var color = {"Red" : 50, "Green" : 100, "Blue" : 200}，这行就是以JSON字符赋予color类型，这种写法似乎
有点不习惯啊！不过没关系，下一个Demo是我们熟悉的写法，onSucceeded是成功的回调函数。

我们看看ColorService是如何定义的：

[ScriptService]
public class ColorService  : System.Web.Services.WebService
{
    [WebMethod]
    [GenerateScriptType(typeof(Color))] //验证2_ComplexTypeProxy.aspx
    public Color Reverse(Color color)
    {
        return new Color(
            (byte)(255 - color.Red),
            (byte)(255 - color.Green),
            (byte)(255 - color.Blue));
    }
    
}

原来是Reverse方法接收一个Color类型的参数并返回一个Color类型，的确很简单
最后我们看下Color类是如何定义的：

public class Color
    {
        public Color() { }

        public Color(byte red, byte green, byte blue)
        {
            this.Red = red;
            this.Green = green;
            this.Blue = blue;
        }

        public byte Red;

        public byte Green;

        public byte Blue;
    }

再简单不过，应该不用介绍。我们还是直接进入Demo2吧。

==========================Demo2=====================

Demo2介绍的是如何在客户端生成复杂类型的代理，看下页面Javascript的代码

<script language="javascript" type="text/javascript">
            function ReverseColor()
            {
               
                //在Service方法前要标记，[GenerateScriptType(typeof(Color))] 
                var color = new ComplexType.Color(); 
                color.Red = 50;
                color.Green = 100;
                color.Blue = 200;
                ColorService.Reverse(color, onSucceeded);
            }
            
            function onSucceeded(result)
            {
                alert(String.format(
                    "Red: {0}\nGreen: {1}\nBlue: {2}",
                    result.Red,
                    result.Green,
                    result.Blue));
            }
        </script>

 

 啊哈，var color = new ComplexType.Color();
    color.Red = 50;
    color.Green = 100;
    color.Blue = 200;

这种写法是我们所熟悉的，不过你真的这么写的话，还需要在Service端进行如下标注
[GenerateScriptType(typeof(Color))] ，可以把它标到类的前面，也可以标到方法名的前面(推荐)
就像下面的代码一样：

[ScriptService]
public class ColorService  : System.Web.Services.WebService
{
    [WebMethod]
    [GenerateScriptType(typeof(Color))] //验证2_ComplexTypeProxy.aspx
    public Color Reverse(Color color)
    {
        return new Color(
            (byte)(255 - color.Red),
            (byte)(255 - color.Green),
            (byte)(255 - color.Blue));
    }
    
}

=============================Demo3========================

好我们对Demo2进行一下小小的改变

<script language="javascript" type="text/javascript">
            function ReverseColor()
            {
               
                //在Service方法前要标记，[GenerateScriptType(typeof(Color))] 
                var color = new Object(); 
                color.__type=ComplexType.Color;
                color.Red = 50;
                color.Green = 100;
                color.Blue = 200;
                ColorService.Reverse(color, onSucceeded);
            }
            
            function onSucceeded(result)
            {
                alert(String.format(
                    "Red: {0}\nGreen: {1}\nBlue: {2}",
                    result.Red,
                    result.Green,
                    result.Blue));
            }
        </script>

 

其他都不变，能达到同样的效果。

Demo4介绍的是在客户端如何调用返回类型为Table的Service；Demo5介绍的是在客户端如何

调用有循环调用的Service，这2个Demo比较复杂，这里暂时就不介绍了，您可以参考相关资料

或Email给我，我会给你解答。(Email:gfreesky@gmail.com)