随笔-15  评论-3  文章-4  trackbacks-1
  2008年6月12日

WebDevHelper介绍

WebDevHelper是微软公司ASP.NET Team架构师Nikhil Kothari在业余时间的小作品(赞叹人家架构师对技术的执著,加上对编码的热爱……),其中包含一些辅助Web开发的小工具,包括DOM查看、HTTP Trace、JavaScript Console、ASP.NET ViewState查看等杂项功能。今天Nikhil Kothari刚刚发布了WebDevHelper一个最新版本——(Version 0.8.5.1, 8/23/2007),其中非常引人注目的就是对ASP.NET AJAX开发的有力支持。

 

下载安装WebDevHelper

WebDevHelper的下载相关链接如下:

  1. WebDevHelper 0.8.4.0安装文件
  2. WebDevHelper 0.8.4.0帮助文档(非常精美且内容详尽,PDF格式,这就是精益求精、专业的力量!强烈推荐阅读)
  3. 如果1、2地址失效,请访问主页:http://projects.nikhilk.net/WebDevHelper/Default.aspx
    安装好之后,可以选择IE的Tools|Web Development Helper菜单项,启用该工具,如图:

 

在ASP.NET AJAX中使用WebDevHelper查看UpdatePanel信息

双击Log窗口中某一次由UpdatePanel引发的异步更新记录,将弹出这一次HTTP请求的详细信息窗口。其中可以选择以局部更新模式查看HTTP Response信息,对于UpdatePanel来说,这些详细的信息非常有用:

 

在ASP.NET AJAX中使用WebDevHelper查看JSON信息

双击Log窗口中某一条对服务器端Web Method异步调用的记录,将弹出这一次HTTP请求的详细信息窗口。其中可以选择以JSON模式查看HTTP Response信息,显得更加直观清晰:

 

总结

除了UpdatePanel和JSON两种模式显示的HTTP Response,这个WebDevHelper在其他方面确实乏善可陈。其他集成的东西似乎都如鸡肋一般:HTTP Trace/Debug没有Fiddler强,DOM查看也没有DevToolbar厉害……但有了这两个亮点,也不失为一个非常有用的工具。

posted @ 2008-06-12 10:37 Alex’Sky 阅读(24) | 评论 (0)编辑
  2008年6月10日
JSON定义

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,易于阅读和编写,同时也易于机器解析和生成。它基于ECMA262语言规范(1999-12第三版)中JavaScript编程语言的一个子集。 JSON采用与编程语言无关的文本格式,但是也使用了类C语言(包括C, C++, C#, Java, JavaScript, Perl, Python等)的习惯,这些特性使JSON成为理想的数据交换格式。

JSON的结构基于下面两点

  • 1. "名称/值"对的集合 不同语言中,它被理解为对象(object),记录(record),结构(struct),字典(dictionary),哈希表(hash table),键列表(keyed list)等
  • 2. 值的有序列表 多数语言中被理解为数组(array)
JSON使用

JSON以一种特定的字符串形式来表示 JavaScript 对象。如果将具有这样一种形式的字符串赋给任意一个 JavaScript 变量,那么该变量会变成一个对象引用,而这个对象就是字符串所构建出来的,好像有点拗口,我们还是用实例来说明。

 这里假设我们需要创建一个User对象,并具有以下属性

  • 用户ID
  • 用户名
  • 用户Email

    您可以使用以下JSON形式来表示User对象:

    {"UserID":11"Name":"Truly""Email":"zhuleipro◎hotmail.com"};


    然后如果把这一字符串赋予一个JavaScript变量,那么就可以直接使用对象的任一属性了。

    完整代码:

    <script>var User = {"UserID":11"Name":"Truly""Email":"zhuleipro◎hotmail.com"};
    alert(User.Name);
    </script>


    实际使用时可能更复杂一点,比如我们为Name定义更详细的结构,使它具有FirstName和LastName:

    {"UserID":11"Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"}

    完整代码:

    <script>var User = {"UserID":11"Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"};
    alert(User.Name.FirstName);
    </script>

    现在我们增加一个新的需求,我们某个页面需要一个用户列表,而不仅仅是一个单一的用户信息,那么这里就需要创建一个用户列表数组。
    下面代码演示了使用JSON形式定义这个用户列表:

    [
    {
    "UserID":11"Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"},
    {
    "UserID":12"Name":{"FirstName":"Jeffrey","LastName":"Richter"}, "Email":"xxx◎xxx.com"},
    {
    "UserID":13"Name":{"FirstName":"Scott","LastName":"Gu"}, "Email":"xxx2◎xxx2.com"}
    ]


    完整代码:

    <script>
    var UserList 
    = [
    {
    "UserID":11"Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"},
    {
    "UserID":12"Name":{"FirstName":"Jeffrey","LastName":"Richter"}, "Email":"xxx◎xxx.com"},
    {
    "UserID":13"Name":{"FirstName":"Scott","LastName":"Gu"}, "Email":"xxx2◎xxx2.com"}
    ];
    alert(UserList[
    0].Name.FirstName);
    </script>

    事实上除了使用"."引用属性外,我们还可以使用下面语句:

    alert(UserList[0]["Name"]["FirstName"]); 或者 alert(UserList[0].Name["FirstName"]); 

    现在读者应该对JSON的使用有点认识了,归纳为以下几点:

  • 对象是属性、值对的集合。一个对象的开始于“{”,结束于“}”。每一个属性名和值间用“:”提示,属性间用“,”分隔。
  • 数组是有顺序的值的集合。一个数组开始于"[",结束于"]",值之间用","分隔。
  • 值可以是引号里的字符串、数字、true、false、null,也可以是对象或数组。这些结构都能嵌套。
  • 字符串和数字的定义和C或Java基本一致。

    小节

    本文通过一个实例演示,初步了解了JSON 的强大用途。可以归结如下:

  • JSON 提供了一种优秀的面向对象的方法,以便将元数据缓存到客户机上。
  • JSON 帮助分离了验证数据和逻辑。
  • JSON 帮助为 Web 应用程序提供了 Ajax 的本质。

    参考资料:
    http://www.json.org/
    http://www.cnblogs.com/Truly/archive/2006/12/31/608896.html
    http://www.json.org/json-zh.html

  • posted @ 2008-06-10 12:19 Alex’Sky 阅读(47) | 评论 (0)编辑
      2008年6月9日

    AJAX / AJAX框架 / AJAX.NET (Professional) / ASP.NET AJAX

      这是我们见过的混淆最多的一组概念。不过当去年AJAX技术如火如荼,AJAX框架层出不穷,而微软又推出ASP.NET AJAX框架之后,这四个概念之间的混淆也愈发严重起来了。我们经常能看到这样的问题:

    • 我在用AJAX技术时不知道怎么在UpdatePanel里……
    • 我用AJAX.NET框架调用Web Service时……

      这是非常典型的概念混淆,上面两句话的AJAX与AJAX.NET都应该使用ASP.NET AJAX替换。我们在学习AJAX相关技术时需要理解以下概念:

      AJAX是Asynchronous JavaScript and XML缩写。这个概念代表的是一种技术,当您在说“我在项目中使用了AJAX技术时”,只是代表了您使用客户端XMLHttpRequest对象与服务器端进行异步通信。不过因为随着AJAX技术的运用往往会带来丰富的客户端效果,因此对AJAX技术的广义理解也可以认为这是一种操作客户端DOM而带来丰富效果的技术。

      AJAX框架是一套辅助开发人员使用AJAX技术的代码包(库,etc.)。一个AJAX框架的目的一般是对XMLHttpRequest对象的使用进行封装,并提供一些操作DOM元素或者实现特殊效果的“捷径”。成熟的AJAX框架有很多,它们可以被分为“以客户端为中心”和“面向特定服务器技术”两大类。前者的优秀代表有(排名不分先后):PrototypejQueryMootoolsYUIDojoEXTJS 2.0等等;而后者的典型代表有Anthem.NET、AJAX.NET、MagicAjax.NET和微软ASP.NET AJAX(最初为Atlas)(这几个对比参考);当然,也有优秀的AJAX框架面向其他服务器技术,呵呵这个我还没有了解。

      AJAX.NET (Professional)是ASP.NET平台上著名的AJAX框架,诞生于2005年2月(虽然正式命名为AJAX.NET则是在两个月之后),作者为Michael Schwarz。同年10月,Michael为AJAX.NET提供了更丰富的功能(主要是安全性方面),并将其改名为AJAX.NET Professional。AJAX.NET提供的最主要的(也是唯一)的功能就是异步调用服务器端方法,可谓非常纯粹的“基于数据”的AJAX使用方式。这个框架是一个个人作品,有支持.NET 1.1和2.0的版本,它并不属于微软官方,目前已经停止更新。

      ASP.NET AJAX的Code Name为“Atlas”,在CTP向Beta版转移时曾经发生过翻天覆地的变化。ASP.NET AJAX中包含了UpdatePanel等控件,可以非常透明地为现有的ASP.NET WebForms应用程序添加AJAX效果。此外还提供了客户端异步调用Web Services的方法,使开发人员也能够使用面向数据的方式使用AJAX技术。值得一提的是ASP.NET AJAX的“附属品”相当丰富。例如ASP.NET AJAX名为“Microsoft AJAX Library”的客户端部分是一个纯客户端AJAX框架,提供了面向对象类型系统、浏览器兼容层、异步通信层等多种基础组件;ASP.NET AJAX的开源扩展包“AJAX Control Toolkit”包含了数十个可以直接使用的AJAX服务器端控件,这样开发人员能够轻松地添加丰富的客户端效果。同时,官方还为ASP.NET AJAX提供了“非正式”地扩展包,其中的History等优秀控件也将加入未来版本的ASP.NET AJAX框架中。ASP.NET AJAX是官方出品的AJAX框架,目前已经被集成到ASP.NET 3.5中去了,因此其版本号也从ASP.NET AJAX 1.0一下子“跃升为”ASP.NET AJAX 3.5。如果您看到了这些版本号也请不要疑惑,其实ASP.NET AJAX 3.5相对于ASP.NET AJAX 1.0来说只是修补了一些细小bug,几乎没有任何变化。

    posted @ 2008-06-09 19:01 Alex’Sky 阅读(29) | 评论 (0)编辑
    Client.htm页面代码如下:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        
    <title>客户端</title>
            
    <script type="text/javascript">
            
    var XmlHttp = new ActiveXObject("Microsoft.XMLhttp");
            
    function sendAJAX()
            
    {
                XmlHttp.Open(
    "POST","receive.aspx",true);
                XmlHttp.send(
    null);
                XmlHttp.onreadystatechange
    =ServerProcess;
            }

            
    function ServerProcess()
            
    {
                
    if (XmlHttp.readystate==4 || XmlHttp.readystate=='complete')
                
    {
                    document.getElementById('nameList').innerHTML 
    =XmlHttp.responsetext;
                }

            }

            setInterval('sendAJAX()',
    1000);
            
    </script>
        
    </head>
        
    <body>
            
    <div id="nameList"></div>
        
    </body>
    </html>

    Receive.aspx CodeBehind代码:
    protected void Page_Load(object sender, EventArgs e)
        
    {
            PerformanceCounter myMemory 
    = new PerformanceCounter();
            myMemory.CategoryName 
    = "Memory";
            myMemory.CounterName 
    = "Available KBytes";

            
    string txtResult = "-->当前可用内存:" +myMemory.NextValue().ToString() + "KB";
            Response.Write(DateTime.Now.ToLongTimeString() 
    + txtResult);

        }
    posted @ 2008-06-09 17:59 Alex’Sky 阅读(16) | 评论 (0)编辑
      2007年3月7日

    1、在B机上安装设备仿真程序

    1)先确保B机上已安装了Windows Install 3.0以上版本。

    2Visual Studio 2005  安装光盘上的 wcu\ARM\vs_emulator.exe是设备仿真程序的安装向导,双击运行,然后按照提示进行操作。设备仿真程序默认安装在C:\Program Files\Microsoft Device Emulator\1.0文件夹下。DeviceEmulator.exe是设备仿真器程序,dvcemumanager.exe是设备仿真器管理器。

     

    2、将A机上的内核映像文件复制到B

    设备仿真程序要模拟哪一种设备,就需要用到这种设备的内核映像文件(扩展名为bin)。在BC:\Program Files\Microsoft Device Emulator\1.0文件夹下新建一个images文件夹,并根据需要将下面A机中的映像文件复制到这里。

     

    Pocket PC 2003 SE的映像文件默认安装在C:\Program Files\Microsoft Visual Studio 8\SmartDevices\Emulators\Images\PocketPC\2003\2052文件夹下,文件名是PPC_2003_SE_CHS_ARMv4.bin

    Pocket PC 2003 SE VGA的映像文件默认安装在C:\Program Files\Microsoft Visual Studio 8\SmartDevices\Emulators\Images\PocketPC\2003\VGAPortrait\2052文件夹下,文件名PPC_2003_SE_VGA_CHS_ARMv4.bin

    Smartphone 2003 SE的映像文件默认安装在C:\Program Files\Microsoft Visual Studio 8\SmartDevices\Emulators\Images\Smartphone\2003\2052文件夹下,文件名SP_2003_SE_CHS_ARMv4.bin

    Smartphone 2003 SE QVGA的映像文件默认安装在C:\Program Files\Microsoft Visual Studio 8\SmartDevices\Emulators\Images\Smartphone\2003\QVGA\2052文件夹下,文件名SP_2003_SE_QVGA_CHS_ARMv4.bin

     

    因为我在A机中安装了Windows Mobile 5.0 Pocket PC SDKWindows Mobile 5.0 Smartphone SDK,所以也可以找到相应映像文件。

    中文CHS Windows Mobile 5.0 Pocket PC的映像文件默认安装在C:\Program Files\Windows CE Tools\wce500\Windows Mobile 5.0 Emulator Images for Pocket PC - CHS\Deviceemulation\0804文件夹下。

    中文CHS Windows Mobile 5.0 Smartphone的映像文件默认安装在C:\Program Files\Windows CE Tools\wce500\Windows Mobile 5.0 Emulator Images for Smartphone - CHS\Deviceemulation\0804文件夹下。

    英文Windows Mobile 5.0 Pocket PC的映像文件默认安装在C:\Program Files\Windows CE Tools\wce500\Windows Mobile 5.0 Pocket PC SDK\Deviceemulation\0409文件夹下。

    英文Windows Mobile 5.0 Smartphone的映像文件默认安装在C:\Program Files\Windows CE Tools\wce500\Windows Mobile 5.0 Smartphone SDK\Deviceemulation\0409文件夹下。

     

    3、将A机上的外观文件复制到B

    在设备仿真程序运行时,还可以为仿真程序指定外观文件,以获得更逼真的效果。每一种外观由三个bmppng文件和一个xml 文件组成,并且保存在同一个文件夹下。xml文件是外观定义文件,三个bmppng 图像文件分别显示仿真程序的默认外观、所有按钮均为按下状态的仿真程序外观和由一种颜色填充的每个按钮的区域。

    B机的C:\Program Files\Microsoft Device Emulator\1.0文件夹下新建一个skins文件夹,并将A机中相应的外观文件复制到这里。

     

    PocketPC2003Smartphone 2003的外观文件在C:\Program Files\Microsoft Visual Studio 8\SmartDevices\Skins文件夹中。

    Windows Mobile 5.0 Pocket PC的外观文件在C:\Program Files\Windows CE Tools\wce500\Windows Mobile 5.0 Pocket PC SDK\Deviceemulation文件夹下除0409子文件夹外其它的文件夹中。

    Windows Mobile 5.0 Smartphone的外观文件在C:\Program Files\Windows CE Tools\wce500\Windows Mobile 5.0 Smartphone SDK\Deviceemulation文件夹下除0409子文件夹外其它的文件夹中。

     

    4、在B机上安装Microsfot ActiveSync 4.2简体中文版

    这主要是为了便于设备仿真程序与B机之间进行数据同步。

     

    5、在B机上创建桌面快捷方式

    1)为C:\Program Files\Microsoft Device Emulator\1.0\dvcemumanager.exe创建桌面快捷方式“设备仿真器管理器”。

    2C:\Program Files\Microsoft Device Emulator\1.0文件夹下DeviceEmulator.exe是设备仿真器程序,应该带参数运行。

    主要开关参数如下:

    os_image_file_name:指定仿真程序要使用的内核映像的路径和文件名称(*.bin *.nb0)。除非使用 /s 开关启动,否则为必需的参数。

    /skin skin_file_name:加载指定的外观文件。

    /s filename:指定保存状态文件。如果没有指定任何 ROM 映像,则必须有 /s filename,仿真程序将从指定的保存状态文件还原。当该仿真程序退出时,它会将新状态保存到保存状态文件的最前面。

    只要弄清楚了某种设备的映像文件和对应的外观文件,就可以创建该设备仿真程序的快捷方式。

    Pocket PC 2003 SE为例,先为DeviceEmulator.exe创建桌面快捷方式“Pocket PC 2003 SE”,然后修改该快捷方式的“目标”为:

    "C:\Program Files\Microsoft Device Emulator\1.0\DeviceEmulator.exe" images\PPC_2003_SE_CHS_ARMv4.bin /skin skins\PocketPC_2003\2052\PocketPC_2003_Skin.xml

    (3)如果弄不清映像文件与外观文件的对应关系,可打开A机的Visual Studio 2005查看。

    依次点击“工具”—>“选项”—>“设备工具”—>“设备”,见图1

    1

     

     

    选中某一设备,点击“属性”按钮,见图2

    2

     

    点击“仿真器选项”按钮,可看到该种设备的映像文件名称,见图3

    3

     

    在“显示”选项卡中,可看到对应的外观文件,见图4

    4

     

    4)如果在B机桌面了创建了多个设备仿真程序的快捷方式方式,会显得比较凌乱,应该把它们组织到程序菜单中比较好。

     

    好了,客户的电脑上也有了Pocekt PC 2003模拟器。什么时候想测试程序,只要点击菜单启动模拟器,再通过ActiveSync将应用程序布署到模拟器上运行就行了。但每次测试时,都要部署一遍,并且客户对电脑操作又不太熟练,感觉还是有点儿麻烦。因此,客户又提出来,能不能再简单点儿呢?

    答案是肯定的。只要用上前面提到的“/s”开关参数,就能解决这个问题。

    6、将A机上的设备仿真程序保存状态文件复制到B

    设备仿真程序使用 .dess扩展名的文件,来保存设备仿真程序中所有的 RAMROM 和设置信息。因此,.dess 文件是还原保存状态时必需的唯一文件。我在A机上调试程序时,会将程序部署到A机上的设备仿真程序中。调试通过后,关闭设备仿真程序时,系统询问“退出之前保存仿真程序状态吗?”,此时选择“是”,将产生一个保存状态文件,默认情况下位于C:\Documents and Settings\<username>\Application Data\Microsoft\Device Emulator 下,文件名为{B22C75F5-ABFC-4ca8-954F-7D4AB28CF096}.dess。保存状态文件的文件名是仿真程序的当前虚拟机标识符 (VMID),在不同的机器上会有所不同。

    (1)BD盘上新建一个Emulator文件夹。

    (2)A机上的{B22C75F5-ABFC-4ca8-954F-7D4AB28CF096}.dess复制到B机的D:\ Emulator文件夹下。

    (3)B机的桌面上创建快捷方式“我的Pocekt PC 2003”,修改快捷方式的目标为:

    "C:\Program Files\Microsoft Device Emulator\1.0\DeviceEmulator.exe" /s d:\emulator\{B22C75F5-ABFC-4ca8-954F-7D4AB28CF096}.dess

    这样,客户只要双击桌面上的“我的Pocekt PC 2003”,就可直接测试程序,无需通过ActiveSync重新布署了。而我修改程序后,只要将最新的保存状态文件传给客户,覆盖掉原来的文件即可。以后双方交流的时候,无需见面,在网上就可以进行了。

    posted @ 2007-03-07 17:24 Alex’Sky 阅读(1379) | 评论 (2)编辑
      2006年11月13日
         摘要:   阅读全文
    posted @ 2006-11-13 13:07 Alex’Sky 阅读(98) | 评论 (0)编辑
      2006年11月9日
    Windows CE 主要面向嵌入式开发,涉及硬件和底层的开发比较多,有很多工业级的设备,都是基于 Windows CE 的;Windows Mobile 主要面向移动计算的应用,用于智能手机和商用级的 Pocket PC 比较多,目前作为企业解决方案在移动领域的扩展;Windows XP Embedded 可以看成是 Windows XP 的可定制版本,目前我所了解的是,它在一些 POS 和银行终端应用比较多,它的优势是可以定制,企业可以根据自己的业务需要,将一些业务系统潜入到操作系统中,或者将一些 Windows 组件删除。

    视频教料:
    http://channel9.msdn.com/showpost.aspx?postid=252046
    posted @ 2006-11-09 13:01 Alex’Sky 阅读(150) | 评论 (0)编辑
      2006年10月31日
         摘要:   阅读全文
    posted @ 2006-10-31 09:45 Alex’Sky 阅读(42) | 评论 (0)编辑