October 22, 2021
code review

Build a Website on Google Cloud Platform Series – Phần 4: Up Database lên Cloud Storage & truy xuất dữ liệu

Phần 3, chúng ta đã thay đổi tên miền của website bằng 1 tên miền miễn phí của Freenom. Nhưng đó chỉ là web tĩnh, bài này mình sẽ hướng dẫn các bạn up database lên Google Cloud Storage của Google, và truy xuất dữ liệu từ database, hiển thị lên web. Xong bài này, các bạn có thể deploy một trang web hoàn chỉnh.

Ở phần 3, chúng ta đã deploy trang web này, nhưng phần login khi click vào thì chưa có gì. Các bạn có thể xem source project mình share ở phần trước, trang index.html. Khi nhấn vào login không làm gì cả. Các bạn đừng vào trang appengine.ga nhá, vì mình đã làm phần login và deploy rồi.

Để truy xuất database thì chúng ta cần tạo 1 database, ở đây mình dùng MySQL. Database của mình chỉ đơn giản như thế này.

database tên “demodb”, có 1 table là “user” như hình. Giờ mình sẽ export cái database này để up lên GCS.
Cách export nó hơi khác một tý nhé.

các bạn chú ý phần mình gạch đỏ, làm theo giống vậy nhá. Tiếp tục kéo xuống

Rồi nhấn “Go

Vậy là chúng ta đã có 1 database. Quay lại trang index.html để xử lý sự kiện khi nhấn vào login.

Các bạn thấy phần mình bôi đen, Login không có làm gì cả.

Bay giờ mình tạo ra 1 trang login.php. Khi click vào chữ login nó sẽ chuyển tới trang login.php

Trang login.php của mình như thế này

nó cần 1 file login.js và chỉnh sửa css 1 chút trong file style.css để trông đẹp hơn

đây là trang login.js, các bạn kéo thả vào file vào editer nhá. Bạn nào không biết mở Editer từ đâu thì chịu khó xem lại máy phần trước.

Các bạn thay thế file style.css lúc trước bằng file này style.css này.

style.css mới trông như thế này.

Giờ chúng ta deploy xem khi click vào chữ login nó ra cái gì

gõ lệnh “gcloud app deploy” rồi nhấn “enter”.

nhấn Y để tiếp tục.

Giờ refresh lại trang web, nhấn login thì nó sẽ ra trang này.

Nhấn nút login sẽ có popup như hình.

Giờ mình muốn ô Email là user_email và password là user_password trong database.

Giờ chúng ta tiến hành up database lên GCS.

Nói sơ lược 1 chút cách để có thể truy xuất được database từ GCS.

Bạn cần tạo 1 bucket trong Storage, up load file database.sql lên đó.

Tạo 1 instance trong Cloud SQL và import database.sql từ đường dẫn của bucket Storage. Trong trang web bạn theo đường link của Cloud SQL để tới database. Bay giờ tiến hành cụ thể.

Các bạn vào Storage, chọn “Enable billding” để bật thanh toán cái đã.

popup hày hiện lên bạn cứ chọn “Set Account”.

giờ tạo 1 bucket. Mình chọn tên là demo_db.

sau đó chọn upload file, chọn demodb.sql mà bạn đã export lúc trước.

như này là đã upfile thành công.

Nhấn menu bên trái, chọn SQL để tạo instance cho SQL.

chọn next.

chọn “Choose Second Generation” cái này google nó khuyến cáo nên dùng.

Bạn nhập tên instance , mình nhập demodb.

bạn có thể tùy chỉnh các thông số khác bên dưới, mình để mặc định.

Bên dưới có phần “root password” bạn dùng password gì thì nhập vào, không thì tick vào ô “no password” như mình. Rồi nhấn submit

tạo thành công.

Nhấn vào “import” để import database từ đường dẫn bucket.

bạn nhấn vào Browser, nhìn cây thư mục ẩn trong khung, chắc các bạn cũng hiểu nó chị import được từ bucket thôi.

các bạn chọn bucket, 2 bucket bên dưới là của hệ thống nha các bạn, cứ kệ nó đi.

sau đó chọn database của mình trong bucket đó

giờ thì nhấn “import”. Sau khi tạo instance thành công, bạn click vào instance vừa tạo

dòng gạch đỏ bên dưới là link để bạn truy cập vào database lát nữa sẽ dùng, bây giờ bạn click vào Access Control phía trên để tạo user

sau đó bạn nhấn vào “user” và “create user account” sẽ có popup như hình, bạn nhập username và password, cái này lát nữa cần dùng để truy cập database nên các bạn đặt xong thì nhớ nhé.

Tạo xong sẽ như này. root là mặc định, lúc khởi tạo mình chọn là no password. Vậy là up database và cấu hình xong, giờ connect – lấy dữ liệu.

Bạn chỉnh sửa file login.php lại như thế này

Bạn chú ý những thông tin mà mình gạch đỏ.

Ở phần host: “:/cloudsql/” là bắt buộc nha bạn, phía sau là đường dẫn liên kết trong SQL, mình đã chỉ ở phần tạo instance trước đó.

xong thì các bạn deploy, refesh trang web và vào phần login

Email là user_email trong database của mình, pass thì bị ẩn rồi.

Series tiếp theo mình sẽ hướng dẫn các bạn tạo một ứng dụng web sử dụng Cloud Vision API. Đây là bộ API Machine Learning của Google, hứa hẹn mang đến nhiều đột phát trong năm 2017 này.

Chúc các bạn thành công với Google Cloud Platform.

Build a Website on Google Cloud Platform Series:

Pham Van Tuyen

Anh Tuyen Pham là Tổng giám đốc của Cloud Ace Việt Nam và là GDG Cloud HCM Chapter Lead. Anh là diễn giả quen thuộc tại các sự kiện do Google tổ chức tại Việt Nam như Kubernetes Vietnam, Google Cloud Next Extended. Anh đã có các chứng chỉ của Google Cloud như Google Cloud Architect và Data Engineer.

View all posts by Pham Van Tuyen →