Lập trình với XML cho DB2, Phần 3: Lập trình với XML ở phía khách pps

Lập trình với XML cho DB2, Phần 3: Lập trình với XML ở phía khách Hardeep Singh, Kiến trúc sư các công nghệ nâng cao, IBM Tóm tắt: Hãy tìm hiểu cách để mở rộng mô hình XML nhằm tạo ra các trình khách đầy đủ (rich client) bằng cách sử dụng dữ liệu XML được chuyển đến từ máy chủ ứng dụng của bạn. Hãy khám phá cách sử dụng HTML động (DHTML) để biểu diễn XML, XPath để dẫn hướng trong XML và mô hình đối tượng tài liệu (DOM) để sửa đổi và tuần tự hóa XML trở lại máy chủ ứng dụng. Giới thiệu Sự phổ biến ngày một tăng của Web 2.0 phần lớn là nhờ tính linh hoạt của các thế hệ trình duyệt web hiện nay. Các trình duyệt này sử dụng Ajax để giao tiếp với máy chủ để trao đổi dữ liệu XML và sau đó sử dụng DHTML để dẫn hướng XML và trình bày nó cho người dùng. Các tính năng trình duyệt cho phép chúng được sử dụng như là các trình khách đầy đủ trong các ứng dụng dựa trên web. Các công nghệ cơ sở đã sản sinh một số công nghệ và sáng kiến mới để đáp ứng sự phổ biến ngày càng tăng của Web 2.0. Các thư viện trình trợ giúp như Dojo và Sarissa đã được tạo ra nhằm làm cho việc sử dụng XML ít khó khăn hơn, và các hỗ trợ cho Đồ họa véc tơ co giãn được (Scalable Vector Graphics -SVG) cũng đã tăng thêm. Các trình tiện ích (widget) nhúng được như Google và Yahoo Maps, các phương thức chia sẻ và tích hợp dữ liệu như nguồn cấp dữ liệu RSS và Atom, và mẫu hình phát triển mới bằng cách sử dụng hỗn hợp dữ liệu đã được phát triển để đáp ứng các nhu cầu ngày càng tăng của văn hóa Web 2.0. Như hình 1 minh hoạ, chất keo chung để kết dính tất cả các công nghệ là XML. XML trong nguồn cấp dữ liệu làm cho có thể xuất bản và xử lý các cấu trúc dữ liệu phức tạp trên web. Giao diện lập trình ứng dụng DOM (API) trong DHTML và sự hỗ trợ XPath trong Sarissa cho phép điều hướng XML một cách có hiệu quả để đọc và viết ở phía máy khách. Hình 1. Kiến trúc hướng Web Ghi chú : Trong thế giới Web 2.0, nơi mà các nguồn dữ liệu được xem như là nguồn cấp dữ liệu và dịch vụ, thì trình điều khiển cơ sở dữ liệu được mở rộng để hỗ trợ các cuộc gọi REST, SOAP và FEED. Một khi vấn đề bảo đảm an ninh được giải quyết, thì bạn có thể truy cập trực tiếp các thường trình của cơ sở dữ liệu bằng cách sử dụng các cuộc gọi SOAP hoặc REST không chỉ từ máy chủ ứng dụng, mà còn từ một trình khách web, mà không cần phải tạo ra các ánh xạ không cần thiết. Trong bài tiếp theo, tôi sẽ tạo một mẫu trình điều khiển (driver) SOAP cho DB2. Sử dụng mô hình XML ở phía khách Vì nhiều công nghệ xung quanh XML là chung cho các máy chủ ứng dụng và trình duyệt, nên bạn cũng có thể mở rộng mô hình dữ liệu XML được trình bày trong bài viết đầu tiên tới phía máy khách. Trong bài viết này, bạn hãy tìm hiểu cách để mở rộng mô hình XML nhằm tạo ra các trình khách đầy đủ bằng cách sử dụng dữ liệu XML được chuyển đến từ các máy chủ ứng dụng. Hãy khám phá cách làm thế nào sử dụng DHTML để biểu diễn XML, sử dụng XPath để dẫn hướng XML và DOM để sửa đổi và tuần tự hóa XML trở lại máy chủ ứng dụng. Tương tự như lớp bao bọc DOM mà bạn đã tạo ra trong máy chủ ứng dụng, bạn sẽ tạo ra một lớp bao bọc DOM cho phía máy khách. Lớp bao bọc này không chỉ tách biệt việc trực quan hóa của JavaScript và mã logic nghiệp vụ khỏi các API DOM, mà còn làm cho mã lệnh rất giống với mã Java trong tầng máy chủ ứng dụng. Để đạt được điều này, bạn sẽ sử dụng thư viện nguồn mở Sarissa, nó cung cấp các API XPath cho mã JavaScript chạy trong trình duyệt. Mã của lớp bao bọc có sẵn trong bài viết này (xem phần Tài nguyên). <script type="text/javascript" src="sarissa/sarissa.js"></script> <script language="javascript" type="text/javascript" src="xmlparse.js"></script> Kịch bản Các phần sau xây dựng trên các ví dụ về bảo hiểm được tạo ra trong các bài viết trước của loạt bài này (xem phần Tài nguyên). Các chức năng sau được trình khách web cung cấp. 1. Cho phép người dùng xem và chỉnh sửa tên và họ trong hồ sơ của họ. 2. Tính toán mức bảo hiểm cho mỗi mục bảo hiểm dựa vào nhà cung cấp bảo hiểm mà người sử dụng lựa chọn. Điều quan trọng cần lưu ý: Mã trong bài viết này và các bài viết trước đây chỉ nhằm mục đích giải thích. Chỉ có phần giải thích sự liên quan của mô hình XML là được mã hóa đầy đủ. Các phần còn lại của logic được viết bằng mã giả với giả định rằng người đọc có thể ngoại suy ra mã lệnh tiêu chuẩn dự kiến cho chức năng đó. Bài viết tiếp theo thảo luận về một kịch bản hoàn chỉnh sẽ được mã hóa đầy đủ. Cho phép người sử dụng xem và chỉnh sửa tên của mình Lấy thông tin của khách hàng từ máy chủ ứng dụng và trình bày nó cho phía khách để sửa đổi. Mã JavaScript của trình khách Lớp profilediv được sử dụng để xuất bản chuỗi ký tự HTML được tạo ra từ dữ liệu XML cho người sử dụng. <div class="profilediv" id="profilediv"></div> ID của khách hàng (cid) được nhập vào khi người dùng đăng nhập vào trang web. ID của khách hàng này được chuyển tới hàm getCustomerInfo khi người sử dụng chọn Cập nhật bản lược kê từ phía khách. Trình khách gửi yêu cầu HTTP đến máy chủ bằng cách sử dụng API XMLHttpRequest mà thư viện Sarissa cung cấp. Là một phần của yêu cầu, hàm Callback cũng được định nghĩa. Hàm customerInfoCallback này được gọi ra khi đáp ứng đến từ máy chủ. Liệt kê 1 cho thấy cách để lấy thông tin của khách hàng: Liệt kê 1. Máy khách yêu cầu thông tin khách hàng <script> function getCustomerInfo(cid) { var xmlhttpObj= new XMLHttpRequest(); var addr=hosturl+"?cmd= getuserprofile&msg="+cid; var xmlhttpObj= new XMLHttpRequest(); xmlhttpObj.open('GET', addr, true); xmlhttpObj.onreadystatechange = function() { customerInfoCallback(xmlhttpObj); }; xmlhttpObj.send(""); } Mã Java của máy chủ ứng dụng Liệt kê 2 cho thấy những gì xảy ra trong máy chủ ứng dụng khi nó nhận được yêu cầu HTTP từ các trình khách. Trước tiên máy chủ sẽ kiểm tra xem các yêu cầu HTTP đó là POST hay là GET, và sau đó, dựa trên thông tin này, nó lấy ra câu lệnh và các giá trị dữ liệu từ các thông số của cuộc gọi HTTP. Liệt kê 2. Máy chủ ứng dụng lấy ra các thông tin của khách hàng public void service( HttpServletRequest _req, HttpServletResponse _res) throws ServletException, IOException { String cmd, msgtext, returnvalue; if(_req.getMethod().equalsIgnoreCase("POST")) { String message = getPostBody(_req.getReader()); XMLParse msgxml=new XMLParse(message); cmd= msgxml.getValue("//request/@cmd"); msgtext= msgxml.toString("/request/*"); } else { cmd= _req.getParameter("cmd"); msgtext= _req.getParameter("msg"); } } Vì rằng câu lệnh là để lấy lược kê thông tin của người dùng, nên máy chủ ứng dụng truy cập vào thông tin khách hàng từ cơ sở dữ liệu và trả lại nó cho trình khách. Liệt kê 3 chỉ cho thấy câu lệnh SQL cần thiết để lấy thông tin, với mong đợi rằng độc giả đã hiểu cách sử dụng các API Java Database Connectivity (JDBC) để kết nối với cơ sở dữ liệu và nhận kết quả truy vấn. Vì thông tin khách hàng được lưu trữ trong cơ sở dữ liệu như là một tài liệu XML, nên bạn không cần thực hiện bất kỳ chuyển đổi nào đối với dữ liệu để gửi lại cho trình khách. Xin lưu ý rằng kiểu nội dung của dữ liệu được trả về được đặt là XML trong phần đầu của đáp ứng HTTP. Liệt kê 3. Đáp ứng của máy chủ ứng dụng if(cmd.equalsIgnoreCase("getuserprofile")) { //returnvalue= select CUSTXML from customer_table where customerid =msgtext } _res.setContentType("text/xml"); _res.getWriter().write(returnvalue); _res.setHeader("Cache-Control", "no-cache"); Mã Java của trình khách Khi trình khách nhận được phản hồi từ máy chủ ứng dụng, thì hàm được định nghĩa trong sự kiện callback được gọi ra. Liệt kê 4 cho thấy yêu cầu lấy UserInfo. Xin lưu ý rằng UserInfo được khai báo là một biến toàn cục, bởi vì nó được sửa đổi khi bạn gửi các bản cập nhật họ và tên mà người sử dụng thực hiện. Liệt kê 4. Yêu cầu lấy UserInfo var userinfo=null; function customerInfoCallback (xmlhttp) { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { Vì rằng giá trị trả về từ máy chủ là XML, nên bạn chuyển trực tiếp nó cho hàm tạo của lớp bao bọc DOM của bạn. userinfo= new xmlparse(xmlhttp.responseXML, false); Tiếp theo, bạn trích ra họ và tên từ XML bằng cách sử dụng XPath. var firstname = userinfo.getValue("/Customer/@firstname",null); var lastname = userinfo.getValue("/Customer/@lastname",null); Liệt kê 5 cho thấy cách sử dụng DHTML để tạo ra một giao diện người dùng đồ họa (GUI) cho việc sửa đổi tên người dùng và chèn nó vào thẻ div là profilediv mà bạn đã khai báo trong trang HTML của mình. Liệt kê 5. DHTML tạo ra một giao diện người dùng đồ họa var htmlstr="<table class='inputtable'><tr>"; htmlstr+='<td>firstname:</td><td><input id="fname" value="'+firstname+'"/></td>'; htmlstr+='<td>lastname:</td><td><input id="lname" value="'+lastname+'"/></td>'; htmlstr+='<tr><td/><td><input type="button" value="save" onClick="javascript:updateCustomer()"/></td>'; htmlstr+='</tr></table>'; document.getElementById("profilediv").innerHTML=htmlstr; } } Sau khi bạn đã thực hiện những sửa đổi, hãy nhấp chuột vào nút Save để gọi hàm updateCustomer. Các UserInfo của DOM chứa các thông tin khách hàng được cập [...]... { profileUpdated(xmlhttpObj); }; xmlhttpObj.setRequestHeader('content-type', 'text /xml' ); xmlhttpObj.send(msg); } Mã Java của máy chủ ứng dụng Dữ liệu XML về khách hàng từ yêu cầu gửi tới được phân tích cú pháp bằng cách sử dụng lớp bao bọc DOM Vì customerid là một thuộc tính trong lược kê ban đầu của khách hàng được gửi đến trình khách, nên không cần phải gửi tham số phụ chứa ID khách hàng trong yêu... dữ liệu XML trả về được phân tách cú pháp bằng cách sử dụng lớp bao bọc DOM Liệt kê 12 cho thấy cách để làm điều này: Liệt kê 12 XML được phân tích cú pháp bằng cách sử dụng lớp bao bọc DOM function itemsPurchasedCallback (xmlhttp) { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { var itemInfo= new xmlparse(xmlhttp.responseXML, false); Đầu tiên bạn hãy trích xuất tên người dùng từ XML đã trả... chuyển đổi, và cập nhật, vì nếu bản chất XML của dữ liệu được duy trì, thì sau đó nó có thể sử dụng các công nghệ dựa trên XML như XPath, DOM và XQuery để thao tác dữ liệu Đây là mô hình dữ liệu XML cho lập trình và trong thế giới đầy thách thức của tích hợp dữ liệu nghiệp vụ, nó cũng có thể là thuốc chữa bách bệnh Mục lục  Giới thiệu  Sử dụng mô hình XML ở phía khách  Kịch bản  Mô hình dữ liệu đối... customerXML trong Phần 1: Liệt kê 6, lặp lần lượt qua từng hạng mục, tính toán chi phí bảo hiểm và bổ xung nó vào mục thông tin Hãy thay thế các dòng 9-11 trong mã gốc bằng các dòng sau: Liệt kê 11 Thay thế cho các dòng 9-11 XMLParse insurancexml=new XMLParse(insurancestr); customerXML.find("/Customer/Items/item",true); String currency= insurancexml.getValue("//rate/@currency"); for(int i=0; customerXML.currentFind.getLength()>i;i++)... cầu Liệt kê 8 cho thấy cách để trích xuất customerid từ XML và sử dụng nó để tạo ra lệnh SQL cập nhật cho cơ sở dữ liệu Dữ liệu lược kê của khách hàng từ yêu cầu HTTP được chuyển như một tham số đến câu lệnh cập nhật, không cần có thay đổi gì Liệt kê 8 Tạo một lệnh SQL cập nhật else if(cmd.equalsIgnoreCase("updateuserprofile")) { XMLParse custxml=new XMLParse(msgtext); String cid= custxml.getValue("/Customer/@customerid");... trang cho trình khách trong tầng ứng dụng và điền dữ liệu vào trong phần thích hợp của trang web (cách tiếp cận ASP/JSP) Sau đó đưa ra nhiều API để chấp nhận bất kỳ sửa đổi nào của người sử dụng đối với dữ liệu Các vấn đề với cách tiếp cận này là:  Nó hòa lẫn mã của trình khách và của máy chủ ứng dụng, tạo ra một kiến trúc cẩu thả;  Nó đòi hỏi phải tạo ra và viết tư liệu giải thích thêm nhiều API để trình. .. API để trình khách chuyển trở lại bất kỳ thay đổi dữ liệu đáng kể nào 2 Tạo ra một cấu trúc dữ liệu có thể được gửi cho trình khách dưới dạng chuỗi ký tự Định dạng được chấp nhận nhất để biểu diễn một cấu trúc dữ liệu đã tuần tự hóa như vậy là XML Vấn đề với cách làm này là:  Bây giờ bạn phải viết thêm mã lệnh để thực hiện việc tuần tự hóa  Nếu dữ liệu được cập nhật từ máy khách là XML, thì sau đó... dụng để diễn giải XML đã sửa đổi trở lại thành đối tượng dữ liệu của ứng dụng Một câu hỏi hiển nhiên nảy sinh là: Nếu bạn phải dùng đến mô hình dữ liệu XML để giao tiếp với trình khách, thì tại sao không sử dụng nó trong chính tầng ứng dụng? Bạn vẫn còn cần thao tác các thông tin mà bạn đã nhận như là một kết quả với dịch vụ trang web về mức bảo hiểm Vì rằng các thông tin này ở dạng XML, nên đầu tiên... Liệt kê 9 cho thấy quá trình này: Liệt kê 9 Trình khách lựa chọn URL function itemsPurchased(url,cid) { var msg=' '; var xmlhttpObj= new XMLHttpRequest(); xmlhttpObj.open('POST', hostname, true); xmlhttpObj.onreadystatechange = function() { temsPurchasedCallback (xmlhttpObj); }; xmlhttpObj.setRequestHeader('content-type',... custxml=? where customerid=cid //stmt.setString(1,msgtext); } Hãy lưu ý sự tương tự trong mã ứng dụng được sử dụng để điều hướng các XML trong cả trình khách lẫn máy chủ Cũng lưu ý rằng máy chủ ứng dụng trong cả hai yêu cầu HTTP đã hành động một cách đơn giản như là một người trung gian giữa trình khách và cơ sở dữ liệu - không có dữ liệu nào được thao tác trong trao đổi này Tính toán mức bảo hiểm cho . Lập trình với XML cho DB2, Phần 3: Lập trình với XML ở phía khách Hardeep Singh, Kiến trúc sư các công nghệ nâng cao, IBM Tóm tắt: Hãy tìm hiểu cách để mở rộng mô hình XML nhằm tạo ra các trình. mẫu trình điều khiển (driver) SOAP cho DB2. Sử dụng mô hình XML ở phía khách Vì nhiều công nghệ xung quanh XML là chung cho các máy chủ ứng dụng và trình duyệt, nên bạn cũng có thể mở rộng. rộng mô hình dữ liệu XML được trình bày trong bài viết đầu tiên tới phía máy khách. Trong bài viết này, bạn hãy tìm hiểu cách để mở rộng mô hình XML nhằm tạo ra các trình khách đầy đủ bằng cách