TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN
KHOA CÔNG NGHỆ PHẦN MỀM
-----🙚🙘🕮🙚🙘-----

BÁO CÁO ĐỒ ÁN MƠN HỌC

Mơn: Đồ án 1
Đồ án: Xây dựng tiện ích ví điện tử trên Google Chrome
hỗ trợ quản lý tài sản của các địa chỉ trên nền tảng Ethereum

Giảng viên:
ThS. Nguyễn Tấn Toàn
Sinh viên thực hiện:

Trần Hoàng Anh – 19521214
Nguyễn Khánh Toàn – 19521029

Tp.HCM, tháng 6 năm 2022


Bài báo cáo

Pocketz

Mục lục
I.

Thông tin chung .................................................................................................................................... 3

II.

Phát biểu bài toán .................................................................................................................................. 3
1.

Giới thiệu đề tài ................................................................................................................................ 3

2.

Yêu cầu hệ thống .............................................................................................................................. 4
a.

Yêu cầu tính năng ......................................................................................................................... 4

b.

Yêu cầu phi tính năng ................................................................................................................... 4
Mơ hình Use-case ............................................................................................................................. 4

III.
1.

Sơ đồ Use-case .................................................................................................................................. 4

2.

Danh sách Use-case .......................................................................................................................... 5

3.

Đặt tả Use-case ................................................................................................................................. 5
Phân tích (sơ đồ lớp) ....................................................................................................................... 13


IV.
1.

Sơ đồ lớp (Mức phân tích) .............................................................................................................. 13
a.

Sơ đồ lớp ..................................................................................................................................... 13

b.

Danh sách các lớp đối tượng và quan hệ..................................................................................... 14

c.

Mô tả chi tiết từng lớp đối tượng ................................................................................................ 14

Thiết kế giao diện................................................................................................................................ 15

V.
1.

Danh sách các màn hình ................................................................................................................. 15

2.

Mơ tả chi tiết từng màn hình .......................................................................................................... 16

VI.


a.

Sign up ........................................................................................................................................ 16

b.

Sign in ......................................................................................................................................... 16

c.

Forget password .......................................................................................................................... 17

d.

Main layout ................................................................................................................................. 18

e.

Buy .............................................................................................................................................. 22

f.

SendTx ........................................................................................................................................ 23

g.

Add account ................................................................................................................................ 26

h.


Create account ............................................................................................................................. 26

i.

Add provider ............................................................................................................................... 27

j.

Account details............................................................................................................................ 28
Kết luận ........................................................................................................................................... 29

1.

Kết quả đạt được ............................................................................................................................ 29

2.

Hướng phát triển ............................................................................................................................ 29

3.

Link github và tài liệu tham khảo .................................................................................................... 29
1


Bài báo cáo

Pocketz

2



Bài báo cáo

Pocketz

I. Thông tin chung
Tên đề tài: Ứng dụng ví điện tử dạng tiện ích Google Chrome hỗ trợ quản lý tài
sản trên nền tảng Ethereum
• Mơi trường phát triển ứng dụng: Google Chrome
• Thơng tin nhóm
STT MSSV
Họ và tên
Điện thoại
Email
1
19521029 Nguyễn Khánh Tồn
0369346897
2
19521214 Trần Hồng Anh
0943993238
•

II. Phát biểu bài toán
1. Giới thiệu đề tài
-

-

Lý do thực hiện đề tài:

o Blockchain là một hệ thống cơ sở dữ liệu dạng chuỗi – khối cho phép lưu
trữ và truyền tải thơng tin một cách an tồn được liên kết với nhau nhờ các
thuật tốn mã hóa vơ cùng phức tạp. Năm 1991, hệ thống Blockchain đã
được mô tả vào bởi W. Scott Stornetta và cộng sự của ông là Stuart Haber.
Với mục đích ban đầu là ghi chú thời gian vào các tệp tài liệu để dễ quản lý
thông tin. Và các tệp dữ liệu này trở nên bất biến.
o Năm 2008, nền tài chính thế giới sụp đổ. Lần đầu tiên, khái niệm về hệ
thống tiền mặt điện tử ngang hàng-phi tập trung (khái niệm nguyên sơ của
hệ thống Blockchain). Khái niệm này được trình bày bởi một người hay
một nhóm ẩn danh có tên là Satoshi Nakamoto, tạo ra một giao thức mã
nguồn mở có tên là Bitcoin.
o Cho đến hiện nay, đã xuất hiện rất nhiều loại hình tiền kỹ thuật số trên thị
trường, phố biến nhất ở Việt Nam ngồi Bitcoin (BTC) cịn có Ethereum
(ETH), Binance Coin (BNB), Ripple (XRP), cũng như NFT-tài sản số ứng
dụng công nghệ blockchain
o Hiện nay, các loại tiền điện tử đang có giá trị cực lớn trên thị trường, cũng
như việc tiền điện tử cũng được nhiều nơi dùng làm đơn vị tiền tệ chính để
thanh tốn. Vì thế, nay nhóm em nghiên cứu, làm một ví điện tử dạng tiện
ích trên Google Chrome-web browser có tệp người dùng lớn nhất nước ta
để giúp quản lý số tiền hiện có, quản lý các giao dịch tiền tệ của các tài
khoản hiện có, cũng như giúp việc thực hiện các giao dịch trở nên dễ dàng
hơn.
o Nhóm quyết định chọn ethereum là vì đây là một nền tảng lớn
Tổng quan đề tài:
o Tìm hiểu về blockchain. Từ đó, áp dụng vào việc tạo một ví điện tử giúp
quản lý các tài sản trên nền tảng Ethereum
3


Bài báo cáo


Pocketz

2. Yêu cầu hệ thống
a. Yêu cầu tính năng
-

Các tính năng cơ bản của ví điện tử hiện thời như: tạo tài khoản, nhập tài khoản, …
Quản lý số dư trong tài khoản, quản lý hoạt động, mua, gửi tiền

b. u cầu phi tính năng
-

Giao diện đẹp

III.

Mơ hình Use-case

1. Sơ đồ Use-case

4


Bài báo cáo

Pocketz

2. Danh sách Use-case
STT


Ý nghĩa/Ghi chú

Tên Use-case

1

Tạo ví mới

2

Đăng nhập

3

Thêm tài khoản

4

Nhập tài khoản

5

Quên mật khẩu

6

Đổi tài khoản

7


Đổi mạng

8

Thêm mạng

9

Đổi tên tài khoản

10

Xuất khóa riêng tư

11

Gửi token

12

Mua token

13

Xem hoạt động

3. Đặt tả Use-case

User Case ID


UC_1

Name

Tạo ví mới

Goal

Tạo một ví mới để sử dụng

Actors

Người dùng

Pre-conditions
Postconditions

5


Bài báo cáo
Main Flow

Pocketz

1. Người dùng nhập mật khẩu mới
2. Người dùng xác nhận mật khẩu mới
3. Nhấn nút “Mở ví”
4. Ơ thoại hiển thị cụm mật khẩu bí mật xuất hiện

5. Bấm “Xác nhận” để hồn tất mở ví

Exception

Mật khẩu xác nhận khơng chính xác: hệ thống hiển thị thơng báo, quay lại
bước 2

Open Issues

User Case ID

UC_2

Name

Đăng nhập

Goal

Mở ví của bản thân

Actors

Người dùng

Pre-conditions

Người dùng đã tạo ví

Post-conditions

Main Flow

1. Người dùng nhập mật khẩu
2. Nhấn nút “Mở khóa”

Exception

Mật khẩu khơng chính xác: hệ thống hiển thị thơng báo, quay lại bước 2

Open Issues

User Case ID

UC_3

Name

Thêm tài khoản

Goal

Tạo một tài khoản ethereum

Actors

Người dùng
6


Bài báo cáo

Pre-conditions

Pocketz

Người dùng đã mở ví

Post-conditions
Main Flow

1. Người dùng ở trang chủ, mở menu ở góc phải màn hình
2. Chọn thêm tài khoản
3. Người dùng nhập tên tài khoản mới (nếu cần)
4. Người dùng bấm “Tạo”

Exception
Open Issues

User Case ID

UC_4

Name

Nhập tài khoản

Goal

Nhập một tài khoản Ethereum có sẵn

Actors


Người dùng

Pre-conditions

Người dùng đã mở ví

Postconditions
Main Flow

1. Người dùng ở trang chủ, mở menu ở góc phải màn hình
2. Chọn Nhập tài khoản
3. Người dùng nhập khóa riêng tư của tài khoản
4. Người dùng bấm “Xác nhận”

Exception

Khi người dùng nhập sai định dạng khóa riêng tư: hệ thống báo lỗi và quay lại
bước 3

Open Issues

User Case ID

UC_5

7


Bài báo cáo


Pocketz

Name

Quên mật khẩu

Goal

Đổi mật khẩu ví

Actors

Người dùng

Pre-conditions

Người dùng đang ở trang đăng nhập (mở ví)

Postconditions
Main Flow

1. Người dùng bấm vào dòng chữ quên mật khẩu
2. Nhập “Cụm mật khẩu bí mật”
3. Nhập mật khẩu mới
4. Xác nhận mật khẩu mới
5. Khơi phục tài khoản (ví)

Exception


-

Cụm mật khẩu bí mật khơng chính xác: hệ thống hiển thị thơng báo,
quay lại bước 2
Mật khẩu xác nhận khơng chính xác: hệ thống hiện thị thông báo, quay
lại bước 4

Open Issues

User Case ID

UC_6

Name

Đổi tài khoản

Goal

Đổi tài khoản mặc định

Actors

Người dùng

Pre-conditions

Người dùng đã mở ví

Post-conditions

Main Flow

1. Người dùng ở trang chủ, mở menu ở góc phải màn hình
2. Người dùng tìm kiếm tài khoản mình theo tên (nếu cần)
3. Bấm vào tài khoản mình cần chọn làm mặc định

8


Bài báo cáo

Pocketz

Exception
Open Issues

User Case ID

UC_7

Name

Đổi mạng

Goal

Đổi mạng mặc định

Actors


Người dùng

Pre-conditions

Người dùng đã mở ví

Post-conditions
Main Flow

1. Người dùng ở trang chủ, bấm vào Combobox ở góc giữa trên của app
2. Chọn mạng muốn đổi thành

Exception
Open Issues

User Case
ID

UC_8

Name

Thêm mạng

Goal

Thêm một mạng tùy chỉnh

Actors


Người dùng

Preconditions

Người dùng đã mở ví

Postconditions

9


Bài báo cáo
Main Flow

Pocketz

1. Người dùng ở trang chủ, mở menu ở góc phải màn hình
2. Nhập tên mạng
3. Nhập URL mạng mới
4. Nhập mã chuỗi của mạng
5. Nhập ký hiệu tiền tệ sử dụng
6. Nhập URL trình khám phá khối (nếu cần)

Exception

7. Nhấn nút “Lưu”
- Tên quá ngắn: hệ thống thông báo tên quá ngắn, quay lại bước 2
- URL không phù hợp: hệ thống thông báo URL không có tiền tố
http/https phù hợp, quay lại bước 3
- Mã chuỗi khác với RPC trả về: hệ thống thông báo khi mã chuỗi được

điền vào khác với phản hồi của RPC, quay lại bước 4
- Cảnh báo ký hiệu tiền tệ khác với RPC trả về: hệ thống đưa ra cảnh báo
khi ký hiệu được chọn khác với phản hồi của RPC (không bắt buộc)

Open Issues

User Case ID

UC_10

Name

Đổi tên tài khoản

Goal

Đổi tên tài khoản đang được xem chi tiết

Actors

Người dùng

Pre-conditions

Người dùng đã mở ví, đang mở chi tiết tài khoản lên

Postconditions
Main Flow

1. Người dùng nhấn vào icon chỉnh sửa để tiến hành chỉnh sửa tên tài

khoản
2. Nhập tên mới
3. Nhấn vào icon hoàn thành để xác nhận đổi tên

Exception
Open Issues

User Case ID

UC_11

Name

Xuất khóa riêng tư

Goal

Xuất ra khóa riêng tư của tài khoản đang được chọn
10


Bài báo cáo

Pocketz

Actors

Người dùng

Pre-conditions


Người dùng đã mở ví, đang mở chi tiết tài khoản lên

Postconditions
Main Flow

1. Người dùng nhấn vào “Xuất khóa riêng tư”
2. Nhập mật khẩu ví

Exception

3. Nhấn “Xác nhận” để lấy thơng tin khóa riêng tư
- Mật khẩu không đúng: hệ thống thông báo khi người dùng nhập sai
mật khẩu ví

Open Issues

User Case ID

UC_12

Name

Gửi token

Goal

Gửi token đến tài khoản khác

Actors


Người dùng

Pre-conditions

Người dùng đã mở ví

Postconditions
Main Flow

Exception

1. Người dùng nhấn “Gửi” ở trang chủ
2. Người dùng nhập địa chỉ tài khoản cần gửi đến hoặc chọn một tài
khoản của bản thân
3. Nhập số token cần gửi và loại token
4. Nhấn xác nhận số lượng cần gửi
5. Xác nhận phí gas phải chi trả
- Số tiền phải lớn hơn 0: hệ thống thông báo khi người dùng nhập số tiền
bé hơn 0

Open Issues

User Case ID

UC_13

Name

Mua token


Goal

Mua token vào tài khoản

Actors

Người dùng

11


Bài báo cáo
Pre-conditions

Pocketz

Người dùng đã mở ví

Post-conditions
Main Flow

1. Người dùng tại màn hình chính nhấn “Mua”
2. Người dùng chọn hình thức mua và nhấn vào

Exception
Open Issues

User Case ID


UC_14

Name

Xem hoạt động của tài khoản

Goal

Xem lịch sử giao dịch của tài khoản

Actors

Người dùng

Pre-conditions

Người dùng đã mở ví

Post-conditions
Main Flow

1. Người dùng tại màn hình chính nhấn “Hoạt động”
2. Người dùng chọn hoạt động trong danh sách để xem chi tiết

Exception
Open Issues

12



Bài báo cáo

IV.

Pocketz

Phân tích (sơ đồ lớp)

1. Sơ đồ lớp (Mức phân tích)
a. Sơ đồ lớp

13


Bài báo cáo

Pocketz

b. Danh sách các lớp đối tượng và quan hệ
STT

Tên lớp/quan hệ

Loại

1

accountETH

Lớp


2

listAccount

Lớp

3

walletAccount

Lớp

Ý nghĩa/Ghi chú

c. Mô tả chi tiết từng lớp đối tượng
-

Lớp accountETH

STT

Tên thuộc tính

1

provider

private


2

web3

private

3

pendingHash

private

4

setWallet

private

5

setPassword

private

6

wallet

private


7

create()

public

8

getBalance()

public

9

getLinkCheckAccountInEtherscan()

public

10

switchProvider()

public

11

getSelectedProvider()

public


12

setDefaultAccount()

public

13

getDefaultAccount()

public

14

sendTx()

public

15

getGasPrice()

public

16

calGasPrice()

public


17

getTransactionLogAccount()

public

18

getPendingTransaction()

public

19

addProvider()

public

-

Loại

Ràng buộc

Ý nghĩa/ghi chú

Lớp listAccount

STT


Tên thuộc tính

1

account

Loại

Ràng buộc

private
14

Ý nghĩa/ghi chú


Bài báo cáo

Pocketz

2

balances

private

3

txList


private

4

importAccount()

public

5

selectAccount()

public

6

removeAccount()

public

7

getSelectedAccount()

public

8

createAccount()


public

9

changeUsername()

public

10

getBalance()

public

11

getTxList()

public

-

Lớp walletAccount

STT

Tên thuộc tính

Loại


Ràng buộc

1

wallet

private

2

signup()

public

3

signin()

public

4

sighout()

public

5

getMnemonic()


public

6

setAccount()

public

Ý nghĩa/ghi chú

V. Thiết kế giao diện
1. Danh sách các màn hình
STT
1
2
3
4
5
6
7
8
9
10

Tên màn hình
Sign up
Sign in
Forget password
Main layout
Buy

SendTx
Add account
Create account
Add provider
Acc detail

Ý nghĩa/Ghi chú
Màn hình đăng kí
Màn hình đăng nhập
Màn qn mật khẩu
Màn hình chính
Màn hình mua
Màn hình gửi
Màn hình thêm tài khoản
Màn hình tạo tài khoản
Màn hình thêm mạng
Màn hình xem thơng tin chi tiết tài khoản

15


Bài báo cáo

Pocketz

2. Mơ tả chi tiết từng màn hình
a. Sign up

b. Sign in


16


Bài báo cáo

Pocketz

c. Forget password

17


Bài báo cáo

Pocketz

d. Main layout

18


Bài báo cáo

Pocketz

19


Bài báo cáo


Pocketz

20


Bài báo cáo

Pocketz

21


Bài báo cáo

Pocketz

e. Buy

22


Bài báo cáo

Pocketz

f. SendTx

23



Bài báo cáo

Pocketz

24