Do bản thân Signature đã bao gồm cả header và payload nên Signature có thể dùng để kiểm tra tính tồn vẹn của dữ liệu khi truyền tải.
1.4.3 Khi nào thì dùng JWT?
Authentication: Tình huống thường gặp nhất, khi user logged in, mỗi request tiếp đó đều kèm theo chuỗi token JWT, cho phép người dùng có thể truy cập đường dẫn, dịch vụ và tài nguyên được phép ứng với token đó. Single Sign On cũng là một chức năng có sử dụng JWT một cách rộng rãi, bởi vì chuỗi JWT có kích thước đủ nhỏ để đính kèm trong request và sử dụng ở nhiều hệ thống thuộc các domain khác nhau.
Information Exchange: JSON Web Token cũng là một cách hữu hiệu và bảo mật để trao đổi thông tin giữa nhiều ứng dụng, bởi vì JWT phải được ký (bằng cặp public / private key), bạn có thể chắc rằng người gửi chính là người mà họ nói rằng họ là (nói tóm tắt hơn là khơng hoặc khó để mạo danh bằng JWT), ngồi ra, chữ ký cũng được tính tốn dựa trên nội dung của header và nội dung payload, nhờ đó, bạn có thể xác thực được nội dung là nguyên bản, chưa được chỉnh sửa hoặc can thiệp. Tuy nhiên, một lưu ý hết sức quan trọng là do cấu trúc của JWT đơn giản nên JWT có thể dễ dàng bị decode, do vậy, bạn không nên dùng JWT để transfer các thông tin nhạy cảm.
1.5. ReactJS – thư viện của Javascript.
Năm 2013, Facebook “trình làng” một thư viện JavaScript mã nguồn mở mang tên “ReactJS”. Hiện nay, ReactJS đã “vượt mặt” hai đối thủ lớn thịnh hành nhất thời điểm ấy – Angular và Bootstrap.
ReactJS được Netflix, Airbnb, American Express, Facebook, WhatsApp, eBay, Instagram, … tin chọn. Đa số người dùng đánh giá ReactJS là thư viện JavaScript phổ biến nhất để xây dựng giao diện người dùng (UI).
Tăng độ “mượt mà” của trang web cũng như tối đa tốc độ, khả năng mở rộng cao và đơn giản – đây chính là mục đích cốt lõi của ReactJS.
Nhìn chung tất cả những tính năng hay sức mạnh của ReactJS thường xuất phát từ việc tập trung vào các phần riêng lẻ chính vì điểm này nên khi làm việc trên web thay vì nó sẽ làm việc trên tồn bộ ứng dụng của website thì ReactJS cho phép developer có chức năng phá vỡ giao diện của người dùng từ một cách phức tạp và biến nó trở thành các phần đơn giản hơn nhiều lần có nghĩa là render dữ liệu khơng chỉ được thực hiện ở vị trí server mà cịn có thể thực hiện ở vị trí Client khi sử dụng ReactJS.
1.5.2 Tính năng của ReactJS.
Sử dụng ReactJS, người dùng có thể:
Viết ứng dụng trực tiếp trên JavaScript.
Phá vỡ những cấu tạo UI phức tạp và biến chúng thành những component độc lập.
Chuyển các dữ liệu đã được tùy biến đến một UI component cụ thể.
Thay đổi trạng thái cho nhiều component (child) trên ứng dụng nhưng không ảnh hưởng tới component gốc (parent) đang ở trạng thái Stateful.
Biết chính xác khi nào cần render lại hoặc khi nào bỏ đi những phần tử của DOM chính.
1.5.3 Các khái niệm cơ bản liên quan đến ReactJS.
Theo ngôn ngữ công nghệ, ReactJS là một thư viện Javascript hỗ trợ xây dựng tầng Views ( chữ V trong mơ hình MVC – Model View Controller). Nhờ ReactJS, người dùng có thể xây dựng website hoàn toàn sử dụng Javascript (để thao tác với HTML), được tăng cường bởi Virtual-DOM.
1.5.3.1 Redux
Một ReactJS không sở hữu những module chuyên dụng để xử lý dữ liệu. Vì thế, ReactJS được thiết lập một cách độc lập. Hình thức chia nhỏ view thành các component nhỏ sẽ giúp chúng liên kết chặt chẽ với nhau hơn.
Sự liên kết và mối quan hệ giữa các component trong ReactJS cần được quan tâm đặc biệt là vì luồng dữ liệu một chiều từ cha xuống con là luồng dữ liệu duy nhất trong một reactJS việc sử dụng luồng dữ liệu một chiều này có một chút khó khăn cho những người mới tìm hiểu sử dụng và ứng dụng vô các dự án tuy nhiên bên cạnh mặt hạn chế vẫn có mặt nổi trội đó chính là ReactJS sẽ phát huy được hết tất cả chức năng vai trị của mình khi sử dụng cơ chế một chiều này vì nó sẽ làm cho các chức năng của view trở nên phức tạp hơn.
1.5.3.2 Virtual DOM
Đây là một định dạng dữ liệu JavaScript nhẹ được dùng để thể hiện nội dung của DOM (Document Object Model, tạm dịch: Mơ hình Đối tượng Tài liệu) tại một thời điểm nhất định nào đó.
ReactJS là Framework sử dụng Virtual-DOM. Vừa là Model, vừa là View, tại DOM, mọi sự thay đổi trên Model đã kéo theo sự thay đổi trên View và ngược lại. Hiểu đơn giản, dù không tác động trực tiếp vào các phần tử DOM ở View, bạn vẫn sẽ thực hiện được cơ chế Data-binding. Nhờ vậy, tốc độ ứng dụng tăng lên đáng kinh ngạc.
1.5.3.3 Component
Nếu các Framework khác dùng template thì ReactJS lại được xây dựng xung quanh các component. Sử dụng phương thức createClass (nhận một tham số mơ tả đặc tính), bạn sẽ dễ dàng tạo ra một component sở hữu đầy đủ đặc tính đó.
1.5.4 Lợi ích khi sử dụng ReactJS.
Lợi ích đầu tiên mà ReactJS đó chính là việc tạo ra cho chính bản thân nó một dom ảo, đây là nơi mà các component được tồn tại trên đó. Việc tạo ra dom như vậy giúp cải thiện hiệu suất làm việc rất nhiều, khi có tính tốn cần thay đổi hoặc cần cập nhật những gì lên Dom thì ReactJS đều tính tốn trước và việc cịn lại chỉ là thực hiện chúng lên Dom, làm như vậy sẽ giúp cho ReactJS tránh được những thao tác cần có trên một Dom mà khơng cần tốn thêm bất cứ chi phí nào.
Lợi ích thứ hai mà ReactJS đem lại đó chính là việc viết các đoạn code JS sẽ trở nên dễ dàng hơn vì nó sử dụng một cú pháp đặc biệt đó chính là cú pháp JSX nghĩa là cú pháp này cho phép ta trộn được giữa code HTML và Javascript. Ngoài ra ta cịn có thể đem đoạn code thêm vào trong hàm render mà không cần phải thực hiện việc nối chuỗi và đây được đánh giá
là một trong những đặc tính thú vị của ReactJS và việc chuyển đổi các đoạn HTML thành các hàm khởi động đều được thực hiện từ bộ biến đổi chính đó chính là JSX.
Có nhiều cơng cụ phát triển là lợi ích tiếp theo của ReactJS. Khi bạn bắt đầu một ReactJS bạn đừng quên cài đặt thêm ứng dụng mở rộng của Chrome chuyên dành cho ReactJS nhé vì nó sẽ giúp cho bạn debug code một cách dễ dàng hơn, khi bạn đã cài đặt nó xong bạn sẽ có một cái nhìn trực tiếp vào Virtual Dom và lúc đó cũng đồng nghĩa với việc là bạn đang xem một cây dom thông thường vậy. (adsbygoogle = window.adsbygoogle || []).push({});
Thân thiện với SEO: đây là một trong những điều đặc biệt và chỉ có mỗi ReactJS đây cũng chính là vấn đề lớn của các JS Frameworks vì hầu như các JS Frameworks khơng thân thiện với các cỗ máy tìm kiếm mặc dù đã được cải thiện nhiều. Cịn riêng đối với reactJS thì khá tự hào vì khơng nằm trong nhóm khơng thân thiện với SEO vì dưới sự hỗ trợ của các render và trả về trình duyệt dưới dạng web page khi mà bạn chạy ReactJS trên server và các Virtual Dom. Chính vì lý do này mà React có thể đáp ứng đầy đủ được tính SEO Friendly.
1.6. Kết luận
Spring Boot là một công cụ tuyệt vời giúp người dùng thiết lập và chạy các ứng dụng cấp doanh nghiệp một cách nhanh chóng mà khơng phải lo lắng về việc cấu hình ứng dụng một cách chính xác và an tồn. Ngoài ra, cộng đồng người dùng của Spring Boot rất lớn.
Mục tiêu chính của framework Spring Boot là giảm thời gian phát triển tổng thể và tăng hiệu quả bằng cách có thiết lập mặc định cho các bài kiểm tra đơn vị và tích hợp. Nếu người dùng muốn bắt đầu nhanh chóng với ứng dụng Java của mình, chúng ta có thể dễ dàng chấp nhận tất cả các giá trị mặc định và tránh hồn tồn cấu hình XML.
2.1Khảo sát hệ thống Website
2.1.1Thông tin nhân viên và người dùng.
- Cửa hàng có nhiều nhân viên, mỗi nhân viên có thơng tin bao gồm mã nhân viên để phân biệt, họ tên, giới tính, ngày sinh, địa chỉ, số điện thoại, email, password. - Khách hàng có thơng tin bao gồm mã khách hàng để phân biệt , họ, tên, giới tính,
ngày sinh, địa chỉ, số điện thoại, email, password.
- Mỗi nhân viên và khách hàng chỉ thuộc một quyền và một quyền có nhiều nhân viên và khách hàng khác nhau.
2.1.2 Thông tin sản phẩm
- Cửa hàng bán nhiều xe đạp, thông tin xe đạp bao gồm mã xe đạp để phân biệt các xe đạp khác, tên xe đạp, giá, số lượng, mơ tả, trạng thái, hình ảnh.
- Một xe đạp thuộc một loại xe (xe leo núi, xe đua,..).
- Khách hàng có thể đánh giá sản phẩm dựa trên các sản phẩm đã mua dựa trên đơn đặt hàng. Một khách hàng có thể đánh giá nhiều sản phẩm và một khách hàng chỉ đánh giá sản phẩm 1 lần.
2.1.3 Thông tin đơn nhập hàng
- Trong đơn đặt hàng có thơng tin mã đơn đặt hàng, ngày đặt hàng, trạng thái.
- Một đơn đặt hàng có thể đặt nhiều xe đạp khác nhau, một xe đạp có thể có nhiều đơn đặt hàng.
- Một đơn đặt hàng được đặt bởi 1 nhân viên và 1 nhân viên đặt được nhiều đơn đặt hàng.
2.1.4 Thông tin đơn mua hàng
- Khách hàng có thể mua hàng nhiều lần với nhiều đơn mua hàng khác nhau, đơn mua hàng có thơng tin bao gồm mã đơn hàng, ngày đặt, thông tin người nhận, địa chỉ, số điện thoại người nhận, trạng thái của đơn hàng( đang chờ xử lý, đang giao, đã giao và hủy) và một đơn đặt hàng thuộc 1 khách hàng.
- Một đơn mua hàng có thể có nhiều xe đạp khác nhau và 1 xe đạp có thể được mua với nhiều đơn mua hàng. Đơn đặt hàng được duyệt bởi một nhân viên.
2.2 Đối tượng của Website
Website được xây dựng phục vụ ba đối tượng chính là Admin ( Quản trị viên), Staff (Nhân viên) và Khách hàng (Người dùng) với các chứng năng sau :
-Xem, cập nhật, xóa thơng tin sản phẩm -Quản lí đơn nhập hàng
-Quản lí đơn đặt hàng
-Xem góp ý của khách hàng hoặc xóa các thơng tin đó từ khách hàng -Xem, thay đổi và xóa các thơng tin của khách hàng, nhân viên -Tạo tài khoản cho nhân viên
-Thống kê thu chi, thống kê sản phẩm tồn kho, sản phẩm bán chạy -Sao lưu và phục hồi dữ liệu
Nhân viên :
- Đăng nhập Website
- Xem, sửa và xóa thơng tin sản phẩm - Xem, sửa và xóa danh mục sản phẩm
- Xem cho tiết đơn hàng, thay đổi trạng thái đơn hàng - Xem, thay đổi và xóa các thơng tin của khách hàng - Xem và tạo đơn nhập hàng (adsbygoogle = window.adsbygoogle || []).push({});
- Thống kê thu chi, thống kê sản phẩm tồn kho, sản phẩm bán chạy Khách hàng :
Guest : Khách viếng thăm
Xem toàn bộ sản phẩm được bán và chi tiết các sản phẩm đó. Đăng ký tài khoản
User:
Đã có tài khoản
Có quyền đăng nhập, đăng xuất
Có quyền đổi mật khẩu và lấy lại mật khẩu khi quên mật khẩu Tìm kiếm sản phẩm
Đặt mua sản phẩm Xem lịch sử mua hàng.
2.3 Đặc điểm
Xây dựng một hệ thống bán xe đạp trực tuyến đơn giản, thân thiện, dễ sử dụng, cho phép khách hàng xem thông tin và đặt hàng qua mạng, người quản trị quản lý các thông tin về sản phẩm cũng như người dùng.
Website được thiết kế với:
dễ dàng hơn trong việc tìm kiếm.
Khách hàng có thể dễ dàng nhìn thấy thơng tin chi tiết các loại xe đạp mà họ quan tâm.
Khách hàng có thể tìm kiếm xe đạp mà họ quan tâm.
Khách hàng có thể chọn mua các loại xe đạp mà họ cần dựa trên khả năng tài chính và chức năng cần thiết bằng cách thêm vào giỏ hàng.
Có chức năng đăng ký, đăng nhập, đổi mật khẩu, quên mật khẩu Khách hàng có thể gửi ý kiến đánh giá sản phẩm.
Khách hàng có thể xem lại lịch sử mua hàng.
Khách hàng có thể thực hiện chọn phương thức thanh tồn và họ có thể thanh tốn bằng hình thức online qua ví paypal.
Các module:
Module sản phẩm :
Hiển thị thông tin và phân loại sản phẩm trong gian hàng ảo. Sản phẩm hiển thị lên website sẽ được hiển thị đầy đủ thông tin về sản phẩm đó như: hình ảnh, tên sản phẩm, giá,...
Module tìm kiếm:
Khi khách hàng đã có định hướng về sản phẩm cụ thể, họ có thể sử dụng chức năng tìm kiếm và tồn bộ thơng tin những sản phẩm có liên quan đến từ khóa mà khách hàng tìm kiếm sẽ được hiển thị. Nó giúp tiết kiệm tối đa thời gian và giảm các thao tác phức tạp.
Module giỏ hàng:
Khi tham khảo đầy đủ thông tin về sản phẩm khách hàng có thể đặt mua sản phẩm ngay tại Website thông qua chức năng giỏ hàng mà không cần phải đến địa điểm giao dịch, giỏ hàng được làm mô phỏng như giỏ hàng trong thực tế có thể thêm, bớt sản phẩm đã mua. Khi chọn đặt hàng thì khách hàng phải ghi đầy đủ các thơng tin cá nhân, thông tin này được hệ thống lưu trữ và xử lý.
Module đăng ký tài khoản và đăng nhập hệ thống:
Mỗi khách hàng giao dịch tại Website sẽ được quyền đăng ký một tài khoản riêng. Tài khoản này sẽ được sử dụng khi hệ thống yêu cầu. Một tài khoản do khách hàng đăng ký sẽ lưu trữ các thông tin cá nhân của khách hàng.
Module quản lý sản phẩm, đơn hàng:
Người quản trị có thể cập nhật thơng tin các mặt hàng, loại hàng, quản lí thơng tin đơn hàng.
3.1 Sơ đồ phân rã chức năng (BFD) (adsbygoogle = window.adsbygoogle || []).push({});
Hình 3.1 : Sơ đồ phân rã chức năng (BFD)
3.2 Mơ hình use case tổng qt