Handling Ajax requests in the Zend Framework

Doing Ajax is quite simple these days with the various JavaScript libraries offering easy ways to do it. But how do you do it on the server side, without complicating things too much?

Typically, in addition to the Ajax response, you need a traditional page response to a request as well – for example, for browsers which don’t support Ajax.

Let’s look at some methods how one can detect if a request is an Ajax request and how to respond to them in the Zend Framework. Continue reading

Advertisements

Chuyển trang ASP.NET sang Ajax với MagicAjax.NET

Là một trong những công nghệ nền tảng của Web 2.0, Ajax đã và đang làm thay đổi cách chúng ta nhìn nhận và sử dụng các ứng dụng web. Cùng với sự phát triển của các trang web hỗ trợ Ajax, các công cụ giúp các nhà phát triển nhanh chóng xây dựng các trang web này cũng đã ra đời và ngày càng phát triển. Một trong số đó là thư viện Ajax.NET (Bài “Sử dụng Ajax trong lập trình ASP.NET”, TGVT A số tháng 3/2006, trang 115).

Trong bài viết này, tôi sẽ giới thiệu một công cụ khác hỗ trợ phát triển Ajax không kém phần hiệu quả, đó là MagicAjax.NET (gọi tắt là MagicAjax). MagicAjax.NET giúp bạn đưa trang Web ASP.NET hiện có sang hỗ trợ Ajax một cách trực quan mà không cần phải thay thế các điều khiển ASP.NET đã có và/hoặc viết thêm mã JavaScript.

MagicAjax.NET là một dự án mã nguồn mở (C#) tuân theo các điều khoản trong giấy phép GNU Lesser GPL. Hiện phiên bản mới nhất là 0.3.0. Bạn có thể tải về thư viện, mã nguồn, các ví dụ cũng như tài liệu từ trang web chính thức của dự án http://www.magicajax.net.

Các đặc điểm của MagicAjax

• Tích hợp:

– Chỉ cần vài dòng thiết lập cấu hình trong web.config là có thể dùng MagicAjax.

– Chỉ cần thêm vào một điều khiển (AjaxPanel) để trang web của bạn hỗ trợ Ajax.

• Sử dụng:

Đặt phần trang web mà bạn muốn hỗ trợ Ajax vào trong AjaxPanel, công việc còn lại sẽ do MagicAjax Framework đảm nhiệm.

– Có thể đưa MagicAjax vào Visual Studio để sử dụng một cách trực quan.

– Không cần viết mã JavaScript để xử lí phía trình duyệt.

• Lập trình:

– Trong phần lớn trường hợp, để sử dụng MagicAjax, bạn chỉ cần thêm các AjaxPanel mà không cần thay đổi mã nguồn.

– MagicAjax thay hàm PostBack bằng hàm callback của Ajax (AjaxCall).

– Có thể dùng cả hàm PostBack và chức năng Ajax trong cùng một trang, chỉ những phần nằm trong AjaxPanel mới gọi AjaxCall thay cho PostBack.

– ViewState của trang web được chia sẻ giữa PostBack và AjaxCall, khi có một thay đổi tạo bởi AjaxCall, PostBack có thể dùng thay đổi đó và ngược lại.

– Bạn có thể điều khiển AjaxCall tương tự như PostBack, sử dụng lập trình ASP.NET phía server.

– MagicAjax nhận ra những thay đổi trong khi gọi AjaxCall, và gửi một đoạn mã JavaScript nhỏ nhất có thể để phản hồi các thay đổi đến trình duyệt.

– Có thể dùng mã để điều khiển.

• Tùy biến:

– Cung cấp nhiều thiết lập cho phép bạn sử dụng linh hoạt.

– Có thể tùy biến các điều khiển ASP.NET khi dùng chúng với MagicAjax.

– Có thể khai báo hàm AjaxCall sẽ gọi đồng bộ hay không đồng bộ đối với tất cả các điều khiển nằm trong AjaxPanel hay là chỉ với một điều khiển riêng biệt nằm trong đó.

– Bạn có thể khai báo một điều khiển nào đó của AjaxPanel sẽ gọi thuần PostBack.

– Thiết kế hướng đối tượng rõ ràng giúp bạn dễ dàng mở rộng Magic và tạo các điều khiển Ajax của chính bạn.

• Tương thích:

– MagicAjax hỗ trợ hầu hết các trình duyệt hiện nay như Internet Explorer, Firefox, Opera và Netscape.

– Nếu trình duyệt không hỗ trợ hoặc người dùng cấm tính năng JavaScript trong trình duyệt, trang web sẽ tự động chuyển về sử dụng PostBack.

Tích hợp MagicAjax

Mục đích của MagicAjax là hỗ trợ chuyển từ trang web ASP.NET hiện có sang Ajax một cách dễ dàng nhất, do vậy việc tích hợp MagicAjax hạn chế tối đa viết mã. Các bước thực hiện như sau:

1) Thay đổi web.config:

Bạn nên đăng kí MagicAjax ở section system.web trong file web.config như sau:

<httpModules>

<add name=”MagicAjax” type=”MagicAjax.MagicAjaxModule, MagicAjax” />

</httpModules>

Lúc này, MagicAjax sẽ sử dụng các thiết lập mặc định. Nếu muốn thay đổi các thiết lập, bạn có thể chỉnh sửa file web.config theo ý mình (một số chỉnh sửa quan trọng sẽ được giới thiệu trong phần sau của bài viết).

2) Thêm các điều khiển vào trang web:

Dùng một tag để đăng kí sử dụng namespace cho các điều khiển MagicAjax ở đầu trang web:
<%@ Register TagPrefix=”ajax” Namespace=”MagicAjax.UI.Controls” Assembly=”MagicAjax” %>

Sau đó, bạn có thể khai báo một điều khiển theo cấu trúc:

<ajax:AjaxPanel id=”AjaxPanel1” runat=”server”></ajax:AjaxPanel>

Bạn hãy để ý đến tag <ajax:AjaxPanel> và </ajax:AjaxPanel>, tag này có nhiệm vụ giới hạn “tầm ảnh hưởng” của Ajax. Chỉ những điều khiển nào được đặt trong tag này mới hỗ trợ Ajax, còn không thì chúng chỉ là những điều khiển thông thường. Điều này cho phép bạn sử dụng Ajax một cách linh hoạt.

3) Thêm thư viện MagicAjax:

Bạn tạo một thư mục bin nằm trong thư mục chứa trang web của mình. Copy file MagicAjax.dll vào, thế là xong. Bạn hãy mở trình duyệt và xem sự khác biệt.

4) Tích hợp MagicAjax trong môi trường Visual Studio (từ phiên bản 2003 trở lên):

Từ menu Tools, chọn Add/Remove Toolbox Items (chọn Toolbox Items với VS 2005), nhấn vào Browse và chỉ đến file MagicAjax.dll. Các điều khiển sẽ được thêm vào trong toolbox như bạn thấy dưới đây:
Lúc này, bạn có thể tạo một AjaxPanel để kéo-thả các điều khiển vào đó:

Các bước còn lại hoàn toàn như đã trình bày ở trên, chỉ có điều bạn làm một cách “trực quan” hơn trong môi trường VS mà thôi (bạn chỉ cần sửa lại web.config, còn các điều khiển nằm trong AjaxPanel sẽ được khai báo tự động hỗ trợ Ajax).

Sử dụng MagicAjax

AjaxPanel là nhân của MagicAjax, tương tự như panel của ASP.NET, các thành phần bên trong nó được hiển thị trực quan và bạn có thể thiết lập các thuộc tính của các điều khiển web, thay đổi thuộc tính Visible của nó… Hàm PostBack của tất cả các điều khiển nằm trong AjaxPanel được thay thế bằng AjaxCall, trừ khi nó được khai báo khác. Thuộc tính AjaxCallConnection của các điều khiển trong AjaxPanel có thể thiết lập thành:

Asynchronous (không đồng bộ – mặc định): AjaxCall sẽ được sử dụng dưới dạng nền (background), mã lệnh sẽ tiếp tục thực hiện mà không cần đợi nó trả về.

Synchronous (đồng bộ): trình duyệt sẽ đợi cho đến khi AjaxCall kết thúc.

None: các điều khiển này sẽ dùng hàm PostBack thông thường.

Thuộc tính ExcludeFlags của AjaxPanel xác định xem thành phần nào trong form sẽ bị loại khi một hàm AjaxCall gửi đến máy chủ, vì thế giảm số lượng gọi AjaxCall. Nó thiết lập thuộc tính ExcludeFlags của MagicAjax cho các điều khiển ASP.NET (bạn sẽ thấy ở phần sau). Một AjaxPanel con sẽ tự động thừa kế thuộc tính này của cha nó. Nó có thể đánh dấu thêm các thành phần của form để loại bỏ thông qua thuộc tính ExcludeFlags của nó, nhưng nó sẽ không thể gửi đến máy chủ các thành phần của form đã được đánh dấu để loại bỏ bởi cha của nó.

Để giảm lượng HTML cần gửi đến client, MagicAjax định nghĩa các “chủ thể HTML” riêng biệt. Một AjaxPanel con nằm trong một AjaxPanel cha, sẽ định nghĩa chủ thể HTML riêng biệt với cha nó. AjaxPanel cha sẽ bỏ qua mã HTML của AjaxPanel con, chỉ có AjaxPanel con chịu trách nhiệm phản hồi với chủ thể của nó trên client. Vì vậy, bạn có thể giảm số lượng AjaxCall, bằng cách thêm nhiều AjaxPanel để khai báo nhiều chủ thể HTML nhỏ hơn. Ví dụ, nếu bạn đặt một bảng trong một AjaxPanel, và thay đổi một trong số các cell của nó trong một AjaxCall, toàn bộ mã HTML của bảng đó sẽ được gửi đến client. Nếu bạn thêm một AjaxPanel cho mỗi cell, chỉ có mã HTML của cell đã thay đổi được gửi đến client.

AjaxPanel có thuộc tính AjaxLocalScope là true được gọi là AjaxZone. Khi một điều khiển nằm trong AjaxZone gọi một hàm AjaxCall, chỉ các giá trị của các thành phần trong form nằm trong AjaxZone được gửi đến máy chủ. Máy chủ sẽ kiểm tra các thay đổi và chỉ phản hồi đến các AjaxPanel nằm trong AjaxZone đó. Điều này sẽ làm giảm lưu chuyển Ajax và tăng khả năng đáp ứng của máy chủ. Mục đích của nó là tạo các phần riêng rẽ và độc lập với nhau trên cùng một trang, tương tự như các UserControl. Một AjaxZone có thể chứa các AjaxZone khác. Một điều khiển thuộc về AjaxZone là cha trực tiếp của nó.

Bạn có thể thiết lập các thuộc tính sau với các điều khiển ASP.NET để quyết định cách chúng được dùng bởi MagicAjax:

– AjaxCall (“Async”, “Sync” hoặc “None” ): Khi bạn thêm thiết lập AjaxCall với giá trị là “Async” hoặc “Sync” cho một điều khiển sử dụng chức năng PostBack (như Button, LinkButton, CheckBox,…), chức năng này sẽ được thay thế bằng chức năng Ajax, ngay cả khi điều khiển đó không nằm trong một AjaxPanel. Khi bạn thêm thiết lập AjaxCall với giá trị “None” vào một điều khiển nằm trong AjaxPanel, điều khiển này sẽ dùng PostBack thay cho AjaxCall. Bằng cách thêm thuộc tính AjaxCall, bạn có thể ghi chồng thuộc tính AjaxCallConnection của AjaxPanel chứa nó (ví dụ, nếu AjaxPanel được thiết lập để làm việc không đồng bộ, bạn có thể thêm AjaxCall với giá trị “sync” để nó thực hiện một lời gọi AjaxCall đồng bộ). Thuộc tính AjaxCall sẽ được áp dụng cho tất cả các con cháu của điều khiển, thế nên nếu bạn thêm nó vào một khung ASP.NET đơn thuần, tất cả các điều khiển nằm trong đó sẽ chịu ảnh hưởng của thuộc tính AjaxCall.

– ExcludeFromPost (“true” hoặc “false”): Khi thực hiện một lời gọi AjaxCall, client gửi các giá trị của các thành phần của form về máy chủ như là dữ liệu POST. Nếu điều khiển chỉ đơn giản dùng để hiển thị thông tin, và không nhận thông tin người dùng nhập vào, bạn có thể thêm thuộc tính ExcludeFromPost với giá trị là “true”, thì giá trị của điều khiển đó sẽ không được gửi đến máy chủ. Bạn có thể giảm lưu lượng thông tin không cần thiết giữa client và máy chủ bằng cách thêm thuộc tính này cho các điều khiển như readonly Textbox hay Label.

– AjaxLocalScope (“true” hoặc “false”): Thiết lập này điều khiển hoạt động tương tự một AjaxZone (đã nói ở phần trên).

– ExcludeFlags (biểu thức): Xác định xem thành phần nào của form sẽ bị loại bỏ khi gửi đến server trong một lời gọi AjaxCall. Thành phần của form sẽ bị loại bỏ khi gọi AjaxCall từ một điều khiển hay từ các con cháu của nó. Thuộc tính này nên được thiết lập với một biểu thức số học mà giá trị trả về là một số nguyên. Bạn có thể dùng các hằng số của JavaScript như excfViewState, excfFingerprints, excfUserHidden, excfAllHidden, excfFormElements, excfAllElements.

Ví dụ:

<asp:button excludeflags=”excfFormElements | excfViewState” …>

Chú ý là tất cả các thuộc tính trên đều có thể dùng mã để thiết lập. Các giá trị của chúng có thể thay đổi trong một AjaxCall:

Ví dụ:

Button1.Attributes[“ajaxcall”] = “async”;

Thiết lập MagicAjax

Thiết lập web.config

Bạn có thể thay đổi các thiết lập mặc định của MagicAjax trong section configuration của web.config. Các thiết lập này sẽ được áp dụng cho tất cả các trang có trong ứng dụng của bạn. Nếu bạn bỏ sót một thiết lập nào đó, MagicAjax sẽ sử dụng giá trị mặc định. Dưới đây là một ví dụ:

<configSections>

<section name=”magicAjax”

type=”MagicAjax.Configuration.MagicAjaxSectionHandler, MagicAjax”/>

</configSections>

<magicAjax

outputCompareMode=”HashCode”

tracing=”false”>

<pageStore

mode=”NoStore”

unloadStoredPage=”false”

cacheTimeout=”5”

maxConcurrentPages=”5”

maxPagesLimitAlert=”false”

/>

</magicAjax>

Thiết lập bằng mã

Bên cạnh việc sử dụng web.config, bạn có thể dùng mã để ghi chồng các thiết lập cho từng trang riêng biệt. Thuộc tính MagicAjaxContext.Current.Configuration chứa tất cả các tùy chọn. Trong sự kiện Load, bạn có thể thay đổi bất kì giá trị nào của nó, ví dụ:

private void Page_Load(object sender, System.EventArgs e)

{

MagicAjaxContext.Current.Configuration.PageStore.Mode = MagicAjax.Configuration.PageStoreMode.Session;

}

Các thay đổi của bạn sẽ được lưu vào một trường ẩn của trang và sẽ được phục hồi cho mỗi hàm PostBack/AjaxCall. Đoạn mã trên có thể viết như sau:
private void Page_Load(object sender, System.EventArgs e)

{

if ( !IsPostBack )

{

MagicAjaxContext.Current.Configuration.PageStore.Mode = MagicAjax.Configuration.PageStoreMode.Session;

}

}

Chú ý là các thiết lập chỉ được thay đổi trong hàm PostBack, còn với AjaxCall, điều này sẽ gây ra một lỗi ngoại lệ.

Một số thiết lập quan trọng:

• ScriptPath:

Kiểu: string, mặc định: null.

Script của MagicAjax đã được nhúng vào trong file MagicAjax.dll và được đặt vào trang có script như sau:

<script type=”text/javascript” src=”AjaxCallObject.js.aspx”></script>

Bạn có thể dùng script của mình bằng cách thiết lập:

<magicAjax ScriptPath=”~/script” />

Khi đó thuộc tính src ở trên sẽ chứa đường dẫn của ScriptPath.

• Tracing:

Kiểu: boolean, mặc định: false.

Nếu bật thiết lập tracing, một cửa sổ popup sẽ được tạo để hiển thị thông tin đã được gửi đến và gửi đi từ server, cho phép bạn giám sát các lời gọi AjaxCall từ trang web đó, điều này sẽ rất hữu ích khi bạn cần bẫy lỗi.

• PageStore – Mode

Kiểu: liệt kê (NoStore/Session/Cache), mặc định: NoStore.

Thiết lập này quyết định các hoạt động của Ajax, điểm khác biệt giữa các giá trị của nó như sau:

* NoStore: Đây là thiết lập được khuyến cáo sử dụng. Chu kì thực hiện của AjaxCall cũng giống PostBack. Mỗi khi có lời gọi AjaxCall, trang web và các điều khiển được tạo lại, không có gì được giữ lại ở máy chủ, các sự kiện với điều khiển ASP.NET được tạo. Tương thích với .NET 1.1 và 2.0

* Session: Trang web được yêu cầu sẽ lưu lại trên máy chủ, MagicAjax sẽ tạo các sự kiện khác nhau cho trang này. Chỉ tương thích với .NET 1.1. Đồng thời, nó chỉ làm việc với chế độ “InProc”, không làm việc với “StateServer” và “SQLServer”.

* Cache: làm việc tương tự chế độ Session, chỉ khác với chế độ Session ở chỗ trang web sẽ được lưu trên bộ đệm của máy chủ, vì vậy nó có thể làm việc được với “State Server” và “SQLServer”.

Trên đây là một số thiết lập quan trọng nhất. Các thiết lập khác bạn có thể tham khảo thêm tài liệu đi kèm với thư viện.

Hạn chế của MagicAjax

Phiên bản hiện tại của MagicAjax có các hạn chế sau:

* Với chế độ PageStore là NoStore, nếu các tag thuộc tính (như CssClass, BackColor,…) của một AjaxPanel thay đổi trong một AjaxCall, các thay đổi sẽ không được phản hồi đến trình duyệt.

* Điều khiển FileUpload sẽ không làm việc trong một AjaxCall.

Hạn chế khi dùng với .NET 2.0:

* Phương thức Server.Transfer gọi trong một AjaxCall sẽ không được sử dụng một cách phù hợp.

* Không hỗ trợ chế độ Session/Cache của PageStore.

Hi vọng bài viết này giúp bạn có một cái nhìn tổng quát về thư viện MagicAjax và bạn sẽ khám phá thêm nhiều điều thú vị khi sử dụng MagicAjax. Chúc các bạn thành công.

(Theo PCWorld)

Công cụ Ajax nguồn mở

Ai có thể cưỡng lại sức hấp dẫn của công nghệ thời thượng AJAX? Để bổ sung công nghệ này cho website cũng không quá khó, hiện có nhiều giải pháp nguồn mở hấp dẫn.

Ý tưởng sử dụng JavaScript có hay không có XML để thêm “tính thông minh” và khả năng tương tác cho trang web đã có từ thời kỳ đầu của web, hiện giờ AJAX là một trong những cách tốt nhất và đơn giản nhất cho công việc này. Các công cụ nguồn mở được xem xét ở đây khá đa dạng đủ để bao trùm thuật ngữ AJAX – Asynchronous JavaScript và XML.

Chọn 6
Vượt qua rất nhiều sản phẩm và giải pháp, sáu sản phẩm nổi bật được các tổ chức uy tín nhất hậu thuẫn được chọn: Dojo, Google Web Toolkit, Microsoft Atlas, Open Rico và Prototype, Yahoo AJAX Library và Kabuki AJAX Toolkit của Zimbra. Atlas của Microsoft không phải nguồn mở nhưng mã lệnh bạn tạo với sản phẩm này thuộc quyền sử dụng của bạn. Sáu sản phẩm đều cung cấp một số widget (ứng dụng nhỏ có thể chạy trong trình duyệt hoặc chạy độc lập) giao diện người dùng rất hữu ích và các công cụ cơ bản giúp dễ dàng xây dựng ứng dụng AJAX. Chúng rất hấp dẫn với những nhà phát triển muốn thêm một phần mới hay nâng cấp một trang trong ứng dụng hiện có. Ví dụ, nếu muốn thêm một hiệu ứng động hay một bảng dữ liệu động, bạn có thể lấy widget dán vào nơi cần thiết; nói chung chúng đủ tốt để giúp bạn thực hiện các tác vụ cơ bản. Tuy nhiên, nếu muốn làm những thứ hơi khác một chút, thường thì bạn phải chỉnh sửa mã lệnh (code). Điều này có vẻ quen thuộc với hầu hết lập trình viên từng dùng mã nguồn mở, nhưng các nhà phát triển dường như thích thứ có sẵn hơn. Nếu có kiến thức về lập trình và có thời gian để khai thác sự linh hoạt của nguồn mở thì các công cụ này là lựa chọn lý tưởng. Nếu không quen lập trình hay không có thời gian để “đào sâu”, bạn nên xem xét đầu tư cho các sản phẩm chuyên nghiệp hơn.
Dojo
Đây là dự án AJAX nguồn mở hàng đầu hiện nay. Không hẳn tốt hơn các công cụ khác về một phương diện cụ thể nào đó, nhưng nó có nhiều lựa chọn widget với khả năng tùy biến cao. Có thể hiểu vì sao cả IBM và Sun gần đây đã ký kết hỗ trợ dự án này. Website của dự án và mã nguồn của nó có ưu điểm của một dự án nguồn mở phong phú, được đội ngũ các nhà phát triển đầy nhiệt huyết điều hành. Cơ chế quản lý này khuyến khích mọi thành phần tham gia miễn là đáp ứng triết lý cơ bản của Dojo là đơn giản và dễ hiểu. Dojo có trình soạn thảo xuất sắc, nhiều lựa chọn hiệu ứng động, một số công cụ kéo-thả và nhiều thứ khác nữa. Phiên bản mới nhất 0.3.1 có công cụ lấy bản đồ từ Google và Yahoo. Tuy nhiên, có vẻ như Dojo cũng gặp vấn đề về chất lượng không ổn định phổ biến của các dự án nguồn mở. Một số phần của thư viện Dojo được lập tài liệu và có trang mẫu minh họa tốt, nhưng những phần khác thì để nhà phát triển tự mày mò. Việc bổ sung một ít tiện ích của Dojo vào ứng dụng web khá đơn giản. Chương trình được phát triển dạng môđun, cho phép ứng dụng web chỉ cần nạp các thành phần cần thiết. Trong nhiều tình huống, tất cả những gì bạn cần là bổ sung thuộc tính DojoType vào mã lệnh HTML của mình, lệnh này sẽ thực hiện công việc khi nạp trang. Dojo tiếp tục cải tiến khi nó lôi cuốn thêm nhiều nhà phát triển, nhiều ý tưởng và chương trình từ các dự án khác. Có cơ sở để hy vọng dự án này ngày càng có nhiều tính năng phức tạp hơn.
Zimbra Kabuki AJAX Toolkit
Khi Zimbra xuất hiện như một giải pháp quản lý email và lịch làm việc hoàn chỉnh cho một tổ chức, nó gây ấn tượng với việc sử dụng AJAX phức tạp ở mọi cấp. Mọi widget đều được thiết kế để đem lại cảm giác “động” thật sự. Trọn bộ sản phẩm được cung cấp theo một bản quyền nguồn chung, nhưng công cụ Ajax được Zimbra tách thành một sản phẩm riêng gọi là Kabuki và cấp phép sử dụng theo Apache hay Mozilla. Sản phẩm này bao gồm một số công cụ và widget thiết thực nhưng không có đủ tất cả như bộ sản phẩm lớn. Điều này không có nghĩa công cụ của Zimbra yếu: Kabuki có trình soạn thảo xuất sắc, thư viện cây hay và hệ thống dàn trang có thể xây dựng giao diện người dùng phức tạp. Sản phẩm của Zimbra không có được các hiệu ứng động hào nhoáng hay phức tạp như Dojo hay thư viện AJAX của Yahoo. Các widget của Kabuki ít chức năng và cũng khá cơ bản. Có thể khắc phục một số hạn chế này bằng style sheet (css) cộng với kỹ năng thiết kế, lập trình.
Google Web Toolkit
Công cụ của Google có điểm dị biệt. Trong khi các công cụ khác viết bằng JavaScript thì Web Toolkit của Google lại viết bằng Java rồi dịch sang JavaScript. Việc này không có gì phức tạp vì JavaScript khá gần gũi với Java. Tuy nhiên, việc dịch mã là giải pháp thú vị mà các nhà lập trình Java vừa thích lại vừa ngại vì JavaScript làm việc hơi khác với Java. Bộ công cụ này có nhiều widget thông dụng nhưng không có các hiệu ứng động hào nhoáng. Sản phẩm của Google dễ sử dụng, nó được thiết kế để xây dựng ứng dụng hoàn chỉnh chạy trong trình duyệt.
CÔNG CỤ AJAX THƯƠNG MẠI: NÂNG CẤP CUỘC CHƠI
Các sản phẩm nguồn mở có thể cạnh tranh với sản phẩm thương mại? Về tổng thể thì không nhưng về một số tính năng cụ thể thì có. Trước hết, các công cụ AJAX chuyên nghiệp thường đi kèm môi trường phát triển (IDE) kéo-thả. Ví dụ, Tibco General Interface (infoworld.com/3552) và JackBe (infoworld.com/3234) có IDE hoàn chỉnh chạy trong trình duyệt. Các công cụ nguồn mở hiện tại không có được sự tươm tất này, nhưng chúng có thể chạy theo – Microsoft Atlas được thiết kế để tích hợp với IDE của chính hãng, và công cụ Java-to-JavaScript của Google làm việc tốt với các IDE Java như Eclipse. Các sản phẩm thương mại cũng đi kèm với trình bẫy lỗi tinh vi. Chẳng hạn, Backbase cố tình bẫy lỗi tích hợp mở ngay ở website của người dùng. Nó được đóng gói chung với ứng dụng trong quá trình kiểm tra và được loại bỏ về sau. Việc bẫy lỗi các sản phẩm AJAX nguồn mở không thật thuận tiện. Dojo và Yahoo có thể ghi nhận các thông điệp để giám sát, còn Google có môi trường hoàn chỉnh chạy trên PC. Với ứng dụng quan trọng thì công cụ thương mại là giải pháp thích hợp. IceSoft và Nexaweb (infoworld.com/2257) cung cấp các công cụ client phong phú cho phép bạn nhúng thành phần web vào phần mềm client, cho phép bạn tận dụng tất cả kiến thức HTML và JavaScript để xây dựng ứng dụng client. Kapow (infoworld.com/4035) cũng cung cấp công cụ xử lý màn hình tinh vi với thư viện JavaScript nhúng. Có thể thực hiện những việc tương tự với các công cụ nguồn mở khác nhau, nhưng sẽ phải tốn nhiều công sức hơn.
Open Rice và Prototype
Một trong những dựa án AJAX nổi tiếng, hoàn toàn nguồn mở được tạo nên từ liên minh hai dự án Open Rico và Prototype. Rico và Prototype giống nhau ở điểm chú trọng đến các hiệu ứng động và khác nhau ở một số công cụ thiết thực. Thư viện Prototype là bộ công cụ cơ bản nhắm đến các nhà lập trình. Nó có các hàm chức năng đơn giản, tất cả đều được đặt tên một chữ để tăng tốc độ tải về. Đây là quy tắc hay cho các hàm thường dùng và bạn cũng có thể áp dụng để viết mã lệnh chương trình của mình. Rico là tập hợp một số widget và hiệu ứng động phổ biến được xây dựng trên Prototype. Không nhất thiết sử dụng Rico với Prototype, nhưng kết hợp cả hai giúp xây dựng ứng dụng AJAX dễ dàng hơn nếu bạn muốn các hiệu ứng mà chúng cung cấp. Đặc biệt, LiveGrid của Rico được đánh giá cao. Đây là tập hàm cải tiến bảng HTML cho phép lấy dữ liệu tự động bên dưới khi người dùng cuộn qua các mẩu tin, giúp hiển thị nhanh khối lượng dữ liệu lớn mà không phải nạp từng trang. Rico thường được xem như phiên bản rút gọn của Dojo nhưng có một số tính năng tốt hơn, như hỗ trợ việc kéo-thả.
Microsoft Atlas
Thư viện Microsoft Atlas miễn phí, nhưng việc áp dụng nó không đơn giản nếu không dùng bộ công cụ Visual Studio của Microsoft. Microsoft hẳn rất vui nếu bạn chịu khó tải về hàng trăm MB các công cụ phát triển trước khi cài đặt thư viện JavaScript của Atlas. Bản thân thư viện này không yêu cầu nhiều tài nguyên hệ thống, hỗ trợ nhiều trình duyệt như Firefox và Safari nhưng có hạn chế. Bạn có thể bắt gặp trong tài liệu Atlas nhiều câu ghi “Due to a known issue with Atlas on Safari” (có vấn đề với Safari) và cũng có những câu ghi tương tự cho Firefox. Tuy nhiên, đây thường là các vấn đề nhỏ như hộp pop-up biến mất khi người dùng nhấn chuột bên ngoài. Bộ widget của Atlas hơi ít so với các thư viện khác: không có trình soạn thảo đáng giá và chỉ có vài công cụ hiệu ứng động. Thay vào đó, Atlas tập trung vào việc tích hợp AJAX với server, cụ thể là các dịch vụ web trên nền .NET. Tài liệu và các ví dụ mẫu cho việc này rất tốt. Có một số cơ chế để lấy thông tin từ CSDL và định dạng ở client, chủ yếu dùng C# làm việc trên server và tất cả dều kết hợp tốt với JavaScript trên client. Atlas có ý nghĩa như là thư viện mở rộng cho nền tảng .Net hơn là công cụ để thực hiện những tính năng hấp dẫn ở client. Nếu bạn đã đầu tư nhiều cho .Net và muốn khai thác hạ tầng dịch vụ web của nền tảng này thì Atlas là giải pháp tốt để thêm sức sống cho các trang web của bạn.
Yahoo AJAX Library
Thư viện AJAX của Yahoo không chỉ là bộ tuyển tập đầy đặn các hàm mà còn là một minh hoạ tốt về cách thức phát hành phần mềm nguồn mở. Mã lệnh bổ sung nhóm widget then chốt vào ứng dụng web của bạn được dồn vào 1 file zip, Yahoo còn cung cấp nhiều ví dụ mẫu và gợi ý thiết kế. Nhiều hàm có đến 6-10 ví dụ khác nhau, tất cả đều có code và trang minh hoạ. Cách tiếp cận này khác biệt với các sản phẩm khác vì Yahoo muốn thúc đẩy triết lý thiết kế dễ hiểu cùng với việc cung cấp mã lệnh. Chiến lược này quan trọng vì người dùng thông thường vẫn cần được huấn luyện về hoạt động của các ứng dụng AJAX. Các nhà thiết kế của Yahoo muốn đảm bảo các widget AJAX hoạt động ổn định và tài liệu rất hoàn chỉnh của họ phục vụ cho việc này. Tập các tính năng của thư viện Yahoo phong phú nhưng không bằng Dojo. Có nhiều công cụ thông thường, như thư viện hiệu ứng động và thư viện cây, nhưng chỉ có vài công cụ quan trọng như trình doạn thảo hay bảng động. Yahoo có bổ sung một số đặc tính hay. Chẳng hạn thư viện hiệu ứng động cũng làm việc với một số công cụ chuẩn, cho phép thực hiện tự động một số hành vi của chương trình HTML. Hay như thư viện quản lý Connection sẽ tự động nối kết tất cả dữ liệu từ form và định dạng thích hợp cho ứng dụng GET hay POST. Mặc dù thiếu công cụ soạn thảo, nhưng những sự tương tác này đem lại cho thư viện Yahoo vẻ uyển chuyển hơn so với nét “thô ráp” của Open Rico và Zimbra. Khi cần đụng tới mã lệnh với Yahoo Toolkit, bạn sẽ có ấn tượng công ty này đã đầu tư nhiều công sức cho việc tối ưu các hàm chức năng và cung cấp các thư viện thật mạnh.
Sử dụng
Các công cụ AJAX nguồn mở vẫn đang phát triển. Google, Microsoft và Yahoo có lẽ sẽ vẫn tiếp tục kiểm soát chặt dự án AJAX của họ, nhờ vậy tài liệu sẽ luôn tốt. Trong khi đó, các dự án không chịu sự kiểm soát của một công ty nào thường có nhiều biến đổi khi có thêm nhiều người tham gia, sẽ tiếp tục có những ý tưởng sáng tạo nhất và cung cấp các widget hay nhất với tốc độ nhanh nhất. Thật khó đề cử một thư viện cụ thể nào là tốt nhất vì đa phần tính năng hữu ích của các công cụ phụ thuộc vào phong cách lập trình và nhu cầu của bạn. Tốt nhất bạn nên tìm hiểu qua các công cụ và chọn những thứ mà bạn cần để lắp vào ứng dụng web của mình.
Trang bị công cụ AJAX
Tải về và tìm hiểu nhiều công cụ nguồn mở để chọn những thứ tốt nhất.
• Dojo: dojotoolkit.org
• Google Web Toolkit: code.google.com/webtoolkit
• Microsoft Atlas: atlas.asp.net
• Open Rico and Prototype: openrico.orgprototype.conio.net
• Yahoo AJAX Library: developer.yahoo.com/yui
• Zimbra Kabuki AJAX Toolkit: zimbra.com/community/kabuki_ajax_toolkit_download.html

Theo blog thuynt

Atlas: Ajax kiểu Microsoft


top.document.title = ‘TGVT – ‘+’Atlas: Ajax kiểu Microsoft’;

Công nghệ mới của Microsoft tích hợp thư viện script phía client với nền tảng phía server của ASP.NET 2.0, hứa hẹn cung cấp nền tảng phát triển toàn diện hơn và đơn giản hoá việc phát triển ứng dụng web kiểu Ajax.

Công nghệ mới của Microsoft tích hợp thư viện script phía client với nền tảng phát triển phía server của ASP.NET 2.0, cho phép phát triển ứng dụng web thế hệ mới theo kiểu Ajax.

Sau khi được Jesse James Garret “khai sinh” với bài viết nổi tiếng “Ajax: Giải pháp mới cho ứng dụng web” (“Ajax: A New Approach to Web Applications”, Adaptive Path, tháng 2/2005), Ajax trở nên nổi đình nổi đám trong thế giới web và ngày càng xuất hiện nhiều website “kiểu Ajax” như Google Maps, A9.com và Flickr. (Công nghệ Ajax cho phép tạo nên những ứng dụng web có giao diện phong phú và có thể truy xuất dữ liệu từ server để cập nhật một phần nội dung trang web hiện hành mà không phải nạp lại toàn bộ trang như ở các website truyền thống. Tham khảo bài “Kỹ thuật lập trình Ajax” – TGVT A 12/2005, tr.124)

Microsoft cũng có những ứng dụng web kiểu Ajax như MSN Virtual Earth (http://www.virtualearth.com) và Start.com. Thật ra, Microsoft đã tham gia cuộc chơi Ajax khá sớm. Tất cả các thành phần Ajax – DHTML, JScript và XMLHTTP đã có trong Internet Explorer 5 và Outlook Web Access đã dùng các kỹ thuật này từ năm 1998. Trước khi Ajax trở nên phổ biến, Microsoft đã sử dụng kỹ thuật Script Callbacks có phương thức làm việc tương tự Ajax (nhưng tính năng hạn chế hơn) trong quá trình phát triển ASP.NET 2.0.

Nắm bắt xu thế Ajax, tại PDC 2005 (Professional Developer Conference – hội thảo thường niên dành cho các nhà phát triển chuyên nghiệp) Microsoft đã công bố dự án Atlas đầy tham vọng, hứa hẹn cung cấp một nền tảng toàn diện hơn và đơn giản hoá việc phát triển ứng dụng web kiểu Ajax.

MỤC TIÊU

Mục tiêu đầu tiên của Atlas nhằm hỗ trợ phát triển phía máy khách (client), cung cấp các tính năng:

• Thư viện API hướng đối tượng bổ sung cho JavaScript.

• Tương thích trình duyệt tự động (hỗ trợ ứng dụng chạy với nhiều trình duyệt).

• Thư viện API và các thành phần hỗ trợ tính năng giao diện người dùng (UI) phong phú.

• Phát triển client kiểu khai báo (XML script) nhằm đơn giản hoá mã lệnh chương trình.

Mục tiêu thứ hai của Atlas nhằm kết hợp việc phát triển phía client với việc phát triển phía server. Thay vì chú trọng toàn bộ chương trình phía client hoặc phía server, Atlas cung cấp hỗ trợ cho cả hai, cho phép xử lý tác vụ ở nơi có ý nghĩa nhất. Phía máy chủ (server), ASP.NET có các tính năng sau phục vụ cho ứng dụng Atlas:

• Dịch vụ web có khả năng kết hợp với ứng dụng Atlas.

• Các điều khiển (web server control) sinh mã client cần thiết cho ứng dụng Atlas.

KIẾN TRÚC

Ở dạng đơn giản nhất, ứng dụng web sử dụng thư viện script của Atlas phía client gọi một dịch vụ hay ứng dụng trên máy chủ web. Nhưng với ứng dụng web phức tạp hơn, bạn sẽ phải cần đến thành phần phía server của Atlas. Không đơn thuần là thư viện Ajax bổ sung cho ASP.NET, Atlas được thiết kế để trở thành nền tảng phát triển hoàn chỉnh từ client, server đến truyền thông giữa client và server. Ngoài ra, Atlas còn cung cấp nền tảng ứng dụng – cho phép nhà phát triển “lắp ráp” các thành phần có sẵn để tạo ứng dụng.

Thành phần client

Ở phía client, Atlas cung cấp Client Script Framework có thể xem là mở rộng của JavaScript, hỗ trợ phát triển hướng đối tượng, tương thích đa trình duyệt, giao tiếp với dịch vụ web và các tính năng giao diện người dùng phong phú. Microsoft hứa hẹn Atlas Client Script Framework sẽ làm việc với tất cả trình duyệt và với web server bất kỳ. Nó không yêu cầu bất kỳ cài đặt nào phía client.

Thư viện script phía client của Atlas là tập các file JavaScript (.js), gồm các thành phần sau:

• Nhân (Script Core): bổ sung đặc tính hướng đối tượng cho JavaScript (như lớp, interface, kế thừa, xử lý sự kiện, kiểu dữ liệu…). Đây là có thể xem là .NET CLR thu nhỏ ở phía client.

• Thư viện lớp cơ bản (Base Class Library): cung cấp các lớp và cấu trúc cơ bản được dùng trong phát triển .NET Framework (như StringBuilder, Debug, Event…); cung cấp thư viện API xử lý mã client dạng khai báo (XML). Lớp này còn cung cấp hỗ trợ XMLHTTP với WebRequest và WebResponse, cho phép gọi WebMethod ở các file .asmx và .aspx hay dịch vụ web bất kỳ.

• Lớp mô hình thành phần và khung giao diện (Component Model và UI Framework): định nghĩa các thành phần, cơ chế liên kết các thành phần với nhau và các phương thức thực thi. Phần UI Framework xác định các kiểu thành phần giao diện cùng với hành vi (như kéo-thả).

• Các điều khiển và thành phần (Controls & Components): tập các thành phần xây dựng sẵn và các điều khiển dùng cho phát triển phía client như Timer (bộ định thời), Counter (bộ đếm), các điều khiển form thông thường, điều khiển gắn với dữ liệu (ListView) hay điều khiển bản đồ (dựa trên Virtual Earth).

• Lớp tương thích trình duyệt (Browser Compatibility): xử lý tương thích với các trình duyệt (hiện tại, Atlas có thể chạy trên IE, Safari và Firefox).

Thành phần server

Thành phần server của Atlas được xây dựng trên ASP.NET 2.0, cơ bản gồm các dịch vụ web ASP.NET và các điều khiển server. Các thành phần server này làm việc kết hợp với thư viện client của Atlas.

• Điều khiển server (Atlas Server Controls): thực hiện sinh mã client (mã lệnh JavaScript và mã khai báo XML) có những đặc tính Atlas. Các điều khiển server của Atlas tương tự như các điều khiển server của ASP.NET, có ích cho người có kinh nghiệm phát triển phía server. Ngoài các điều khiển thông thường như nút lệnh, ô text, ô chọn, liên kết… còn có những điều khiển Atlas đặc biệt để xử lý những hành vi ở client như rê và nhấn chuột… Tất cả những điều khiển này sẽ được tích hợp vào Visual Studio để cho phép làm việc ở màn hình thiết kế giống như các điều khiển server của ASP.NET.

• Cầu nối dịch vụ web (Web Services Bridge): cho phép mã client liên lạc (2 chiều: gửi và nhận dữ liệu) với dịch vụ web kiểu .asmx của ASP.NET (cũng như WebMethod được định nghĩa trên trang .aspx) và .svc của Indigo (công nghệ SOA mới nhất dự kiến ra mắt cùng với Windows Longhorn trong năm 2006) hay dịch vụ web bất kỳ.

• Cầu nối dịch vụ ứng dụng (Application Services Bridge): sử dụng Web Services Bridge để cung cấp những những dịch vụ ứng dụng ASP.NET như xác thực hay truy cập và cập nhật dữ liệu.

Thành phần client và server và mã khai báo

Mã khai báo là đặc tính thú vị của Atlas. Điều khiển server tạo ra mã khai báo và gửi đến client trong định dạng XML. Atlas Client Framework sẽ phân tích khai báo này để sinh mã lệnh (thể hiện và hành vi của trang) ngay tại trình duyệt (client) lúc thực thi. Phương thức này nhằm tránh việc tạo hàng đống mã lệnh JavaScript rồi nhúng vào trang trước khi gửi đi từ server. Bằng cách thực hiện việc này ở phía client, kích thước trang có thể giữ khá nhỏ và người phát triển không cần phải bận tâm đến những đặc trưng của từng trình duyệt ở client.

Microsoft dường như chú trọng đến kiểu lập trình khai báo này, tuy nhiên bạn vẫn có thể thực hiện kiểu mã lệnh JavaScript trực tiếp, nhưng lưu ý những tính năng hướng đối tượng hạn chế của JavaScript.

HIỆN THỰC

Atlas vẫn còn trong quá trình phát triển. Microsoft dự kiến sẽ ra mắt Atlas trong năm 2006 này như là thành phần bổ sung cho ASP.NET 2.0 và nó sẽ được tích hợp với Visual Studio 2005.

Tuy nhiên, ngay từ bây giờ bạn đã có thể làm quen với Atlas. Microsoft hiện đã có cung cấp file ASPNETAtlas.vsi để cài đặt dự án Atlas mẫu (Atlas Web Site Template, http://msdn.microsoft.com/asp.net/info/future/atlastemplate/) trên Visual Studio 2005 (http://msdn.microsoft.com/vstudio/) hay Visual Web Developer Express (http://msdn.microsoft.com/vstudio/express/vwd/). Dự án này có đủ mọi thứ cần thiết cho dự án web kiểu Atlas, bao gồm thư viện Atlas.

Hiện cũng đã có một số ứng dụng Atlas mẫu, bạn có thể tham khảo ở webblog của Nikhil Kothari (http://www.nikhilk.net) – kiến trúc sư phần mềm của Microsoft, người đã thuyết trình về Atlas tại PDC 2005. Bạn cũng có thể dễ dàng tìm thấy nhiều mẫu ứng dụng Atlas khác trên Internet.

Ngoài ra, hiện cũng có những giải pháp khác cho phép phát triển ứng dụng kiểu Ajax với ASP.NET 1.0 hay 2.0 như My Ajax.Net của Jason Diamon (http://jason.diamond.name/weblog/category/my-ajax-dot-net/) và Ajax.NET của Michael Schwarz (http://ajax.schwarz-interactive.de/csharpsample/).

CLIENT HAY SERVER??

Một trong những điểm mấu chốt của ứng dụng kiểu Ajax đó là giảm thiểu việc truyền thông giữa client và server. Vấn đề cần cân nhắc là gửi-nhận thông tin gì và tác vụ nào xử lý ở đâu? Việc này liên quan đến mô hình phát triển đặt trọng tâm phía server hay client.
Trong mô hình phát triển đặt trọng tâm phía client, ban đầu server gửi đến client thông tin khai báo “cách trình bày” cùng “cách thức ứng xử” của giao diện người dùng. Khai báo giao diện này thực thi ở client để xử lý hành vi tương tác của người dùng, gửi dữ liệu đến server và nhận dữ liệu (không phải mã HTML) đáp trả, và dùng dữ liệu này để sinh thể hiện và nội dung. Server đưa các tài nguyên khác đến giao diện người dùng thông qua các dịch vụ.
Mô hình này cho phép thực hiện hiệu quả các tình huống từ tính toán đến dữ liệu động ở client. Mô hình này cũng cho phép xử lý tức thời những hành vi của người dùng và có khả năng thực hiện những hiệu ứng thị giác như kéo-thả. Cái giá của giải pháp này gồm công sức viết mã lệnh client không nhỏ và việc chuyển luận lý giao diện từ server sang client dẫn đến yêu cầu xây dựng và học sử dụng các công cụ mới, mô hình thiết kế mới…
Trong mô hình phát triển đặt trọng tâm phía server, server sẽ gửi mã HTML đến client thay vì dữ liệu thuần tuý. Việc xử lý phía client đơn giản hơn nhiều, chủ yếu chịu trách nhiệm gửi yêu cầu rồi nhận mã HTML đáp trả và đặt vào đúng chỗ trong trang. Hầu hết việc xử lý tương tác và giao diện đều nằm ở server.
Trong khi một số người thích “đường lối” mới, nhưng một số người khác lại thích mô hình phát triển phía server quen thuộc. Có những tính năng bạn vẫn có thể thực hiện theo mô hình phát triển truyền thống, nhưng những tính năng như tương tác giao diện người dùng phải cần đến nền tảng phát triển kiểu Atlas – cho phép cân đối giữa mô hình client phong phú với mô hình phía server hiện hữu.

Theo pcworld.com.vn

Tham khảo:
http://atlas.asp.net/
http://www.nikhilk.net/

Công nghệ AJAX ẩn chứa những lỗ hổng nghiêm trọng

(Post 31/10/2006) Các ứng dụng AJAX xuất hiện ngày một nhiều đồng nghĩa với việc doanh nghiệp và người sử dụng phải đương đầu với những nguy cơ bảo mật mới. Tuy nhiên, các chuyên gia phát triển có vẻ không nhận thức đầy đủ về mối hiểm họa này.

“Thông thường, tấn công một ứng dụng qua lớp web dễ hơn nhiều so với việc cố xuyên qua tường lửa hoặc tìm đường vòng tránh các hệ thống chống xâm nhập”, Billy Hoffman, Trưởng nhóm nghiên cứu thuộc công ty bảo mật Spi Dynamics (Mỹ), cho hay.

Đối với người sử dụng, AJAX là phương pháp lập trình giúp website hoạt động nhanh và mang tính tương tác hơn. Google đã giới thiệu công cụ AJAX cho phép người dùng tích hợp kết quả tìm kiếm trực tiếp ngay trên trang web của họ. Các ứng dụng AJAX phổ biến khác là site chia sẻ ảnh Flickr và trang tin tức Digg.

Tuy nhiên, dịch vụ e-mail hỗ trợ tổ hợp công nghệ này của Yahoo đã gặp lỗi bảo mật nghiêm trọng hồi hè năm ngoái. Kẻ tấn công đã phát tán một thông điệp chứa mã độc để truy cập e-mail của nạn nhân, tải danh sách địa chủ và gửi thư rác từ chính tài khoản bị đột nhập.

Mối nguy hiểm dạng này còn được gọi là XSS (cross-site scripting) do chúng có thể mở rộng ra một vài dịch vụ khác. XSS đang nhanh chóng trở thành hình thức tấn công trực tuyến phổ biến nhất đối với hacker. Salesforce.com, PayPal và Google đều đã phải sửa lỗi bảo mật XSS trong các phần mềm của họ.

Trong khi đó, giới phát triển web thường không chú ý đến việc bảo mật các đoạn mã do họ thường là chuyên gia thiết kế đồ họa, còn các chuyên gia phần mềm tạo mã cho web lại hay tỏ ra chủ quan. Hơn nữa, rất nhiều chương trình hướng dẫn sử dụng AJAX chứa đầy lỗi cơ bản mà các nhà phát triển web không hề hay biết.

T.N. (theo VNUNet)