Võ Văn Hải's blog

Chỉ có một điều tuyệt đối đó là mọi thứ đều tương đối…

RichFaces: Logon và Registration application

1. Giới thiệu

Logon và Registration là 1 trong những modul thương được  yêu cầu  trong bất kỳ project nào. Bài viết này sẽ hướng dẫn bạn cách làm thế nào  để hiện thực chức năng này trong dự án JSF của bạn. Ví dụ trong bài viết này sử dụng RichFaces làm nền tảng để phát triển. Tôi chọn RichFaces bởi vì nó cung cấp 1 thư viện lớn các components cực kỳ “phờ-rồ” và cực “xì-tin” để có thể phát triển bất kỳ ứng dụng web nào. Vả lại RichFaces cũng đặt nền tảng trên AJAX : mode hiện nay.

Trong ứng dụng này, trang Logon xuất hiện trước đề người dùng có thể điền thông tin đăng nhập và như vậy thì sau khi đăng nhập thành công, người sử dụng có thể làm những công việc tiếp theo. Các công việc này như là hiệu chỉnh thông tin profile của mình, đổi mật khẩu và logout. Nếu người sử dụng không thể đăng nhập, ví dụ như quên password chẳng hạn, họ có thể dùng chức năng ‘Forgot Password” trong trang Login để được cung cấp lại password thông qua email của họ. Nếu như 1 người sử dụng chưa có tài khoản, họ có thể đăng ký 1 tài khoản mới thông qua chức năng “Register Here”. Trang này sẽ yêu cầu người sử dụng điền vào các thông tin yêu cầu và submit những thông tin này. Một email sẽ được gửi đến hộp mail của người dùng. Sau khi logon thành công, user cũng có thể thay đổi mật khẩu của mình.

2. Các chức năng của ứng dụng:

  1. User Login
  2. User Registration
  3. Retrieve password to the registered email id
  4. Edit User Profile Information
  5. Change User Password
  6. User Logout

3. Yêu cầu phần mềm

Ở đây tôi dùng Eclipse Ganymede để phát triển ứng dụng, bạn có thể download tại đây. Cách cấu hình làm thế nào để làm việc cùng RichFaces trên Eclipse, bạn có thể tham khảo ở đây.

Application server ở đây tôi sử dụng là JBoss AS. Bạn có thể download tại đây.

Ngoài ra, để gửi được mail, bạn cần phải có gói javamail.jar, tuy nhiên trong JBoss AS có sẵn gói javamail trong thư mục%JBOSS_HOME%\server\default\lib.

4. Các bước phát triển ứng dụng:

Để hiểu ứng dụng này 1 cách dễ dàng, chúng ta chia quá trình phát triển ra thành các bước sau. Mỗi bước sẽ chỉ cho bạn cách phát triển từng phần của ứng dụng từ việc tạo database, phát triển tầng presentation qua các trang JSP, tạo managed bean và thực thi ứng dụng.

  1. Tạo database cho ứng dụng
  2. Tạo Logon & Registration project với Eclipse
  3. Thiết kế các trang JSP
  4. Tạo managed beans
  5. Tạo resource bundle (properties file)
  6. Đăng ký các managed bean và định nghĩa các navigation rules
  7. Cấu hình web config
  8. Thực thi ứng dụng

5. Kiến trúc project của ứng dụng
https://vovanhai.files.wordpress.com/2008/11/logreg_002.png
6. Giao diện thực thi ứng dụng

Bạn nên chạy trên FireFox để có được kết quả thực thi tốt nhất

https://vovanhai.files.wordpress.com/2008/11/logreg_04.png

sau khi đăng nhập thành công với user vovanhai

https://vovanhai.files.wordpress.com/2008/11/logreg_051.png

Đăng ký thành viên mới

https://vovanhai.files.wordpress.com/2008/11/logreg_06.png

Thông báo các validation khi dữ liệu không hợp lệ
https://vovanhai.files.wordpress.com/2008/11/logreg_07.png

Hiệu chỉnh thông tin user

https://vovanhai.files.wordpress.com/2008/11/logreg_081.png

Đăng ký user thành công
https://vovanhai.files.wordpress.com/2008/11/logreg_09.png

Hiệu chỉnh thông tin thành công
https://vovanhai.files.wordpress.com/2008/11/logreg_10.png

Chức năng quên mật khẩu
https://vovanhai.files.wordpress.com/2008/11/logreg_11.png

Thông báo nếu email không có trong databse
https://vovanhai.files.wordpress.com/2008/11/logreg_12.png

thông báo gửi password thành công
https://vovanhai.files.wordpress.com/2008/11/logreg_13.png

Đổi mật khẩu
https://vovanhai.files.wordpress.com/2008/11/logreg_14.png
https://vovanhai.files.wordpress.com/2008/11/logreg_15.png

Đổi mật khẩu thành công
https://vovanhai.files.wordpress.com/2008/11/logreg_16.png

Đăng xuất thành công

https://vovanhai.files.wordpress.com/2008/11/logreg_17.png

Bài viết có tham khảo từ trang http://www.roseindia.net

3 Responses to “RichFaces: Logon và Registration application”

  1. TuanNA said

    Một ví dụ rất hay và đầy đủ, cảm ơn thầy rất nhiều. Nếu có thời gian thầy viết thêm vài bài tutorial về Spring và Hibernate. Em đang cần 1 bài viết chi tiết về cách tạo 1 project kết hợp cả Hibernate, Spring và Struts2 mong thầy giúp đỡ

  2. Hong Lieu said

    Em cảm ơn Thầy Hải rất nhiều ạ.Em đang làm Đồ Án Chuyên Ngành về JSF và blog của thầy là bài học đầu tiên của em.
    Em học được rất nhiều từ những bài viết của thầy.
    Em xin cảm ơn thầy lần nữa.

  3. RobertPync said

    陽明農地開發
    桃園大溪景點推薦
    農地買賣
    大溪老街特色
    歪仔歪休閒農庄

    宜蘭觀光農場
    農園
    桃園農園
    關西農地
    大溪老地方

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: