Ứng dụng web động: Tạo JSP để sử dụng các lớp pureQuery mới dùng Rational Application Developer
Bây giờ bạn có tất cả các lớp này để phát triển ứng dụng Web động của bạn hiệu quả hơn trong thời gian ít hơn. Trong phần này bạn sẽ tạo ra năm tệp JSP mới để gộp cả ứng dụng Webcủa bạn, tiếp đến là triển khai và kiểm tra trên WebSphere Application Server.
Bạn đang xem trước 20 trang tài liệu Ứng dụng web động: Tạo JSP để sử dụng các lớp pureQuery mới dùng Rational Application Developer, để xem tài liệu hoàn chỉnh bạn click vào nút DOWNLOAD ở trên
Tạo JSP để sử dụng các lớp pureQuery mới dùng Rational Application
Developer
Bây giờ bạn có tất cả các lớp này để phát triển ứng dụng Web động của bạn hiệu
quả hơn trong thời gian ít hơn. Trong phần này bạn sẽ tạo ra năm tệp JSP mới để
gộp cả ứng dụng Web của bạn, tiếp đến là triển khai và kiểm tra trên WebSphere
Application Server.
Trang đăng nhập
Để tạo trang đăng nhập cho phép người dùng của bạn đăng nhập:
1. Nhấn chuột trái vào danh mục WebContent và chọn New > Web Page.
Hình 29. Tạo một trang Web mới
2. Cửa sổ New Web Page (Trang Web Mới) mở ra. Định rõ các chi tiết của
trang Web mới của bạn.
Hình 30. Cấu hình một trang Web mới
3. Đặt tên tệp tin này là login.jsp.
4. Hãy chắc chắn là giá trị của trường danh mục là /wealth/WebContent/.
5. Chọn JSP cho Template.
6. Nhấn Finish để tạo tệp tin.
7. Quay lại và lặp lại các Bước 1-6, nhưng thay vì tạo ra login.jsp, hãy tạo bốn
tệp này: welcome.jsp, logout.jsp, securities.jsp, realestate.jsp.
Bạn sẽ tìm hiểu thêm về từng tệp JSP này và mã hóa chúng trong phần sau của
phần này.
Tốt! Giờ hãy tiếp tục và bắt đầu mã hóa JSP!
Mã hóa các tệp JSP
Bắt đầu với trang login.jsp và thay đổi mẫu được tạo cho bạn, như trong Hình 6.
Ví dụ 6. Mã hóa trang đăng nhập
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN">
<jsp:useBean id="users"
class="com.ibm.ds.users.UsersDataImpl"
scope="page" />
<%@page language="java" contentType="text/html;
charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
login
<meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1">
<meta name="GENERATOR" content="Rational
Application Developer">
Login
<!-- database connection will be made using URL:
jdbc:db2://localhost:50000/WEALTH
on users table. Success takes the user to the welcome
page. -->
<%
String userid = request.getParameter("userid");
String password = request.getParameter("password");
if((userid != null && !userid.equals("")) &&
(password != null && !password.equals(""))){
Data d =
SampleUtil.getData("jdbc:db2://localhost:50000/WEALTH",
"",
"");
users.setData(d);
Users u = users.getUsers(userid);
if(u != null && u.getPassword().equals(password)){
session.setAttribute("userid", userid);
response.sendRedirect("welcome.jsp");
}
else{
out.println("Error logging in.");
}
}
else if(request.getParameter("login") != null)
out.println("You must enter a userid and
password.");
%>
userid:
Password: <input name="password"
type="password"/>
Chú ý trên dòng thứ hai. Tại đây bạn vừa xác định lớp
UsersDataImpl cho ứng dụng bằng JSP của bạn. Chú ý cách nó được sử dụng
trong mã trình JSP trong phạm vi các thẻ . Tiếp theo, không kém phần
quan trọng là ba câu lệnh nạp, tiếp đến là mọi thứ trong phạm vi các thẻ
....
Trước tiên hãy xem biểu mẫu được tạo phía dưới nơi bạn nhập các trường cho mật
khẩu và định danh người dùng, bằng nút Login (Đăng nhập). Khi trình biểu mẫu,
bạn lấy các trường và kiểm tra tính hợp lệ của chúng. Sau đó, bạn kết nối với cơ sở
dữ liệu sử dụng lớp tiện ích pureQuery đã được tạo ra.
(pureQuery.example.SampleUtil). Sau đó bạn đặt giá trị dữ liệu (có chứa kết nối
tới cơ sở dữ liệu) trong biến người dùng (bean được thông báo ở đầu trang). Bây
giờ bạn có thể chạy các truy vấn trên cơ sở dữ liệu sử dụng các lớp pureQuery.
Truy vấn đầu tiên bạn thực iện sử dụng mã trình pureQuery là một truy vấn tìm
nạp tên người sử dụng phù hợp từ cơ sở dữ liệu. Nếu mật khẩu được trả lại phù
hợp, bạn đặt biến phiên, định danh người dùng, cho định danh người dùng được
cấp và chuyển hướng người dùng sang trang welcome.jsp. Nếu không xác nhận
được, bạn sẽ nhận được kết quả là không đăng nhập được, và nếu các giá trị định
danh người dùng và mật khẩu không hợp lệ, bạn khai báo như vậy với đầu ra.
Xem một trang đăng nhập.
Hình 31. Trang đăng nhập
Sau khi đăng nhập, bạn sẽ được gửi đến trang welcome.jsp, trang mà bây giờ bạn
sẽ xác định.
Trang chào mừng
Trang chào mừng giống như trang đích đến cho máy khách của công ty quản lý tài
sản của bạn. Do vậy mà, nó là một tệp tin khá đơn giản, nên hãy xác định nó như
trong Ví dụ 7.
Ví dụ 7. Xác định trang Web welcome.jsp
<!DOCTYPE HTML PUBLIC "-
//W3C//DTD HTML 4.01
Transitional//EN">
<%@page language="java"
contentType="text/html; charset=ISO-
8859-1"
pageEncoding="ISO-8859-1"%>
welcome
<meta http-equiv="Content-Type"
content="text/html; charset=ISO-8859-
1">
<meta name="GENERATOR"
content="Rational Application
Developer">
<!-- If userid session variable is not null
then the user is logged in. -->
<%
String userid =
(String)session.getAttribute("userid");
if(userid == null){
response.sendRedirect("login.jsp");
}
%>
Welcome <% out.print(userid);
%>!
See your <a
href="securities.jsp">securities
See your real
estate
logout
Hãy chắc chắn là biến phiên định danh người dùng có tồn tại, và nếu không có
biến đó, hãy đưa người dùng trở lại trang Web login.jsp. Mặt khác, thực thi mã
trình tiếp tục tại ví trí trang chào mừng người dùng, và hiển thị ba liên kết: Một
đến trang chứng khoán, một liên kết khác đến trang bất động sản, và một liên kết
khác đến trang đăng xuất. Hãy kiểm tra thực thi này trong Hình 32.
Hình 32. Trang chào mừng
Tốt rồi. Bây giờ hãy tiếp tục và xác định trang đăng xuất.
Trang đăng xuất
Trang đăng xuất xóa biến phiên định danh người dùng, khóa các truy cập thêm vào
hệ thống. Xác định trang này, như trong Ví dụ 8.
Ví dụ 8. Xác định trang Web đăng xuất
<!DOCTYPE HTML PUBLIC "-
//W3C//DTD HTML 4.01
Transitional//EN">
<%@page language="java"
contentType="text/html;
charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
logout
<meta http-equiv="Content-Type"
content="text/html; charset=ISO-
8859-1">
<meta name="GENERATOR"
content="Rational Application
Developer">
<!-- Logging out by resetting the
userid session variable to false. -->
<%
String userid =
(String)session.getAttribute("userid");
if(userid != null){
session.setAttribute("userid",
null);
response.sendRedirect("login.jsp");
}
%>
Không có gì được hiển thị nếu người dùng không được đăng nhập, nhưng nếu
người dùng được đăng nhập (định danh người dùng không hợp lệ), biến phiên định
danh người dùng được đặt là không hợp lệ, và người dùng được chuyển hướng lại
trang đăng nhập. Do đó bây giờ hãy thử nhấn liên kết đăng xuất từ trang chào
mừng, bạn sẽ được đưa trở lại trang đăng nhập.
Hình 33. Quay lại trang đăng nhập
Tiếp theo bạn sẽ mã hóa trang bất động sản nên khách có thể xem và nhập các tài
sản bất động sản của họ.
Trang bất động sản
Để tạo một trang bất động sản cho người dùng có thể xem tài sản bất động sản của
họ và nhập các tài sản mới, hãy xác định trang Web realstate.jsp, như trong Ví dụ
9.
Ví dụ 9. Xác định trang Web bất động sản
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN">
<jsp:useBean id="realestate"
class="com.ibm.ds.realestate.RealestateDataImpl"
scope="page" />
<%@page language="java" contentType="text/html;
charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
realestate
<meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1">
<meta name="GENERATOR" content="Rational
Application Developer">
<!-- Here we login to the database again to fetch all real
estate holdings in the
realestate table, same database connection URL as before.
-->
Your realestate holdings
Address
CityZip
StateValue
<%
String userid = (String)session.getAttribute("userid");
if(userid == null){
response.sendRedirect("login.jsp");
}
Data d =
SampleUtil.getData("jdbc:db2://localhost:50000/WEALTH",
"",
"");
realestate.setData(d);
Iterator i = realestate.getRealestates(userid);
Realestate curr = null;
double total = 0;
while(i.hasNext()){
curr = (Realestate) i.next();
out.println(""+curr.getAddress()+"
"+curr.getCity()+
""+curr.getZip()+"
"+curr.getState()+
"$"+curr.getPropertyValue()+"
");
total += curr.getPropertyValue().doubleValue();
}
if(total > 0)
total = Math.round(total*100.0)/100.0;
%>
Total value: $
Enter new real estate:
<%
String address = request.getParameter("address");
String city = request.getParameter("city");
String zip = request.getParameter("zip");
String state = request.getParameter("state");
String value = request.getParameter("value");
if(request.getParameter("create") != null){
if(!address.equals("") && !city.equals("") &&
!zip.equals("") && !state.equals("") &&
!value.equals("")){
realestate.createRealestate(new BigDecimal(value),
address, city, zip, state, userid);
response.sendRedirect("realestate.jsp");
}
else
out.println("You must fill in all fields.");
}
%>
Address:
City:
Zip:
State:
Value: $
back
Trang này rất giống trang login.jsp nơi bạn vừa khai bean bất động sản ở đầu
trang, cùng với một vài câu lệnh nạp của các lớp bạn sẽ sử dụng thông qua trang
Web JSP này.
Bắt đầu tại đầu thẻ , mở đầu của một bảng được cài đặt để hiển thị tất cả
tài sản bất động sản. Tại đây bạn kết nối lại với cơ sở dữ liệu và hãy chú ý đây là
nơi bạn sử dụng các câu lệnh pureQuery mới mà bạn đã tạo ra trong lớp
realestateData.java bằng cách truy vấn cơ sở dữ liệu trên định danh người dùng chỉ
để truy lục một danh sách các bản ghi phù hợp. Những thứ này sau đó được hiển
thị cho trình duyệt trong phạm vi bảng, tiếp đến là một giá trị tổng của các tài sản
bất động sản của người dùng.
Cuối cùng, cài đặt một biểu mẫu để lấy đầu vào cho các tài sản bất động sản. Việc
nhập theo dữ liệu hợp lệ vào biểu mẫu này gọi chức năng
realestate.createRealestate() của bean bất động sản. Sau khi thêm thành công bản
ghi bất động sản mới, người dùng được chuyển hướng trở lại cũng trang đó. Nếu
nhập dữ liệu không hợp lệ, nó sẽ được thông báo bằng một câu lệnh đầu ra.
Đăng nhập vào hệ thống sử dụng "hilbilly", và sau đó xem trang Web bất động
sản, như trong Hình 34.
Hình 34. Trang Web bất động sản
Nhấn Create để chạy mã trình và thêm bản ghi bất động sản mới vào hệ thống.
Hình 35. Nhập một bản ghi bất động sản mới
Bản ghi được thêm thành công, và tất cả được cập nhật
Tiếp đến bạn sẽ chuyển sang trang chứng khoán nơi bạn sẽ truy vấn Yahoo!
Finance API.
Trang chứng khoán
Hiện giờ bạn đang ở trang cuối cùng, nơi người dùng sẽ có thể nhìn thấy các giá
trị bị trì hoãn của tài sản chứng khoán. Xác định trang này, như trong Ví dụ 10.
Ví dụ 10. Xác định trang Web chứng khoán
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN">
<jsp:useBean id="securities"
class="com.ibm.ds.securities.SecuritiesDataImpl"
scope="page" />
<%@page language="java" contentType="text/html;
charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
securities
<meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1">
<meta name="GENERATOR" content="Rational
Application Developer">
<!-- Here we login to the database to fetch all securities
in the securities table,
same database URL as before. -->
Your stock and options holdings
Sybmol
DescriptionQuantity*
TypeCurrent price**
Total value
Quote date
<%
String userid = (String)session.getAttribute("userid");
if(userid == null){
response.sendRedirect("login.jsp");
}
Data d =
SampleUtil.getData("jdbc:db2://localhost:50000/WEALTH",
"",
"");
securities.setData(d);
Iterator i = securities.getSecuritiess(userid);
Securities curr = null;
double total = 0;
while(i.hasNext()){
curr = (Securities) i.next();
String str =
""+
curr.getSymbol()+"&f=nd1l1";
URL url = new URL(str);
URLConnection conn = url.openConnection();
DataInputStream in =
new DataInputStream ( conn.getInputStream ( ) ) ;
BufferedReader br = new BufferedReader(new
InputStreamReader(in));
String line = null;
if(br.ready())
line = br.readLine();
String company = line.substring(line.indexOf('"')+1,
line.indexOf('"', line.indexOf('"')+1));
String date = line.substring(line.indexOf("\",\"")+3,
line.indexOf("\",", line.indexOf("\",\"")+4));
String price = line.substring(line.indexOf("\",",
line.indexOf("\",\"")+4)+2);
int multQuantity = curr.getQuantity();
if(curr.getSecuritytype().equals("option"))
multQuantity = curr.getQuantity()*100;
float totalValue =
Float.parseFloat(price)*multQuantity;
totalValue =
(float)(Math.round(totalValue*100.0)/100.0);
out.println(""+curr.getSymbol()+"
"+company+
""+curr.getQuantity()+""+
curr.getSecuritytype()+"$"+price+
"$"+totalValue+""+date+"
");
total += totalValue;
}
if(total > 0)
total = Math.round(total*100.0)/100.0;
%>
Total value: $
* # of contracts for options** Delayed quotes,
as retrieved from Yahoo! Finance™
back
Bỏ qua các đặc điểm giống với trang Web bất động sản, tại đây bạn truy vấn cơ sở
dữ liệu cho tất cả chứng khoán của người dùng này, và thiết đặt một bảng để hiển
thị chúng. Tiếp đến đối với mỗi chứng khoán, bạn truy vấn Yahoo! Finance API
bằng các thiết lập URL kết nối với trang Web, và lấy nhanh các kết quả vào biến
dòng bằng lệnh gọi tới dòng = br.readLine();. Ba dòng tiếp theo phân tích các kết
quả thành ba biến. Hãy chú ý rằng nếu securityType bằng với "quyền chọn", số
lượng để điện toán giá trị của chứng khoán được nhân với 100 (vì mỗi hợp đồng
quyền chọn đều có 100 chứng khoán).
Xem hình ảnh đầu tiên của trang chứng khoán khi hoạt động trong Hình 36 (được
đăng nhập với người dùng tên tyler).
Hình 36. Trang Web chứng khoán
Giống như một người chuyên nghiệp, bạn vừa hoàn thành xong mã trình! Bây giờ
là lúc để thử và triển khai trên WebSphere Application Server!
Triển khai và kiểm tra trên WebSphere Application Server
Để chạy ứng dụng của bạn trên WebSphere Application Server, vẫn còn một vài
bước cuối cùng để chuẩn bị ứng dụng của bạn.
1. Nhấn chuột phải vào login.jsp trong cửa sổ Project Explorer và chọn Run
As > Run on Server.
Hình 37. Chạy trên WebSphere Application Server
2. Cửa sổ Run on Server mở ra.
Hình 38. Xác định một máy chủ mới
3. Chọn Mannually define a new server (Xác định thủ công một máy chủ
mới) và chọn WebSphere v6.1 Server dưới danh mục IBM. Nếu mọi thứ
có vẻ ổn rồi, nhấn Next.
4. Cửa sổ WebSphere Server Settings mở ra.
Hình 39. Cấu hình các cài đặt máy chủ WebSphere
5. Giữ nguyên mặc định và nhấn Next.
6. Cửa sổ Add and Remove Projects (Thêm và Gỡ các Dự án) mở ra. Hãy
chắc chắn là dự án wealthEAR được liệt kê dưới các dự án Configured.
Hình 40. Thêm và gỡ các dự án
7. Nhấn Next.
Hình 41. Chọn các tác vụ
8. Thế là xong rồi, vì thế hãy nhấn Finish.
Máy chủ nên khởi động bây giờ. Mở một trình duyệt và xem trang đăng nhập tại
địa chỉ URL sau:
Bây giờ bạn đã có một ứng dụng Rational Application Developer hoàn chỉnh thực
sự với kinh nghiệm của Data Studio.
Tóm tắt
Bạn vừa hoàn thành thành công bài hướng dẫn này và thành thạo việc sử dụng hỗ
trợ pureQuery cho các trang Web JSP của mình. Bạn vừa cài đặt Rational
Application Developer với Data Studio, tạo thành công một Dynamic Web Project
được kích hoạt pureQuery (Dự án Web động được kích hoạt pureQuery), sinh mã
trình pureQuery từ các bảng cơ sở dữ liệu của bạn, và viết năm trang Web JSP để
minh họa cho tính năng của chúng.
Hãy chắc chắn là quay trở lại để xem tiếp Phần 2, phần mà bạn sẽ học cách kiểm
tra ứng dụng Web dựa trên Java của bạn để tìm ra các khiếm khuyết và sửa chúng
với sự trợ giúp của AppScan!
