另一种选择 AJAX与泛型处理常式(.ashx)

前面哩哩匝匝讲了这么多, 大部分都是围绕在PageMethod

( 发这么多篇不入流的文章, 伤了大家的眼不好意思 orz)

会推荐jQuery的AJAX调用PageMethod的原因

其实最主要是透过.NET auto Parse JSON的机制

让我们写起程序就跟之前AutoPostBack在同一页不同之程序叫来叫去一样

一开始阵痛期过后

后面写起来就是行云流水

但是PageMethod有他的缺点在, 例如说要传输的数据量大于纯ajax

会输出许多自动产生的js程序之类的

而我们其实有另外一种选择, 泛型处理常式(.ashx)

点右键选新增项目可以看到

相信写程序一定时间的人一定知道泛型处理程序, 在这边就不多介绍, 总之就是类似ASPX的一个独立文件

仅说用AJAX调用这页的好处

传输的数据量较PageMethod来得小 (相对的时间就更快)

可以让不同页面调用 (其实PageMethod也可以让不同页面调用, 但是不建议)

让程序分工更清楚

1. PageMethod : for该页会用到的功能

2. ASHX : 让不同页可以调用同一支程序

我个人习惯这样分, 让程序逻辑跟模块更清楚, 并且确实的让自己的程序DRY一点

直接切入主题, 要怎么调用


$.ajax({
	url: {YourPath}/{YourFile}.ashx,
	data: { itemId : 3 }, //不需要经过$.toJSON
	type: 'GET',
	contentType: 'application/json; charset=utf-8',
	dataType: 'json',
	success: function (data) {
		if(data)
			alert(data.name);
	}
});

url : 指向该ashx的文件

data : 可以直接放对象进去, 不需要经过toJSON或著组字符串

type : GET ( 重要, 直接放data的话需要用GET, 或著只是我没试出来 orz; 不过不是把data处理之后放进去是可以用POST之类的啦)

可以看到跟PageMethod比较不一样的是这三个属性

当然这只是ashx的一种调用方式, jQuery是很强大的, 还有其他调用模式

但是我习惯用这种, 也相对的直觉, 而且用json

而在ashx该页面的程序则是


using System.Web.Services;
using System.Web.SessionState;
using System.Web.Script.Serialization;

    public class CategoryHandler : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            string szItemId = context.Request.QueryString["itemId"] ?? string.Empty; //传入的参数
			if (string.IsNullOrEmpty(szItemId)) return;
			
            int nItemId = -999;
            if (!int.TryParse(szItemId, out nItemId) || nItemId <= 0) return;
			
			Student stu = new Student(nItemId);
			
			context.Response.ContentType = "application/json";
			context.Response.Charset = "utf-8";
			context.Response.Write(new JavaScriptSerializer().Serialize(stu));
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

可以看到使用的方式很简洁, 就是用queryString用传入的data attr取得value (可以传入多个key –> value,)

接着进行操作

而操作完之后, 因为这不是PageMethod, .net不会自动parse成JSON

于是我们手动引入using System.Web.Script.Serialization;

接着声明说这些消息是JSON, 再用工具把他Parse成JSON string

这样就可以在success的地方接到该对象了

特别要注意的是


success: function (data) {
	if(data)
		alert(data.name);
}

可以看到这边直接就可以操作data的属性

不像PageMethod要取得name

必须要用data.d.name

这是特别要注意的地方

一般来说ashx我会习惯把类似的程序放在里面

例如说我要取得某一个类的商品

我可以把这段程序写在ashx, 再不同页面要取得不同类的商品时

我就通通都叫这支ashx, 并且在处理就好, 不用在每一页重复

至于怎么写jQuery UI 结合这支程序包装成一个UI,

每一页只需要套用UI不用管AJAX, 那又是另外一个故事了 = =

而ashx的应用还很多

之后在慢慢介绍, 若有任何写错的地方也麻烦前辈指正

本文可能有理解错误或不尽不实的地方

请路过的前辈不要客气用力打醒

这会是我们成长的主要养分

原文:大专栏另一种选择 AJAX与泛型处理常式(.ashx)

另一种选择 AJAX与泛型处理常式(.ashx)

猜你喜欢