網站部屬

發表於 更新於 分類於 Disqus：
文章字數： 15k 所需閱讀時間 ≈ 13 分鐘

常用主機

  • AWS
  • Digital Ocean
  • GCP
  • Linode

AWS 網站部屬

建立虛擬主機

  1. 選擇區域,再點選使用 EC2
  1. 選擇機器,有標註 Free Tier eligible為提供免費之機器,選擇 Ubuntu Server 20.04 LTS
  1. 選擇機器Type(Free Tier eligible 為免費),選擇 t2.micro,再點選 “Next: Configure Instance Details”
  1. Configure 機器,不需變動,直接點選 “Next:Add Storage”
  1. 設定儲存記憶體,直接點選 “Next:Add Tags”
  1. 設定 Tags,不用設定,直接點選 “Configure Security Group”
  1. 設定 使用 port,default 為 SSH TCP port:22, 新增 HTTP TCP port:80,點選 “Review and Launch”,再選 Launch
  1. 選擇/新建 SSH key
    新建: 選擇 “Create a new key pair”,填入Key pair name,點選 Download Key Pair,下載 SSH key,最後點選 “Launch Instances” 啟動機器
  1. 點選 “View Instances”,然後輸入新建 Instance 的 Nanme
  1. ssh 登入命令,點選 instance 再點選 Connect 即可看到 ssh 登入 command
  1. ssh 登入,進入 command line 輸入視窗,將 ssh key copy 到 command line 的目錄下,執行前一步查到的 command,即可登入

安裝

安裝 lamp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
# 更新軟體
# 更新軟體的最新資訊及列表 : sudo apt update
# 更新目前已安裝的軟體到最新版本 : sudo apt upgrade 
# 更新目前已安裝的軟體(可以聰明的解決相依性的問題, 如果有相依性問題, 需要 安裝/移除 新的 Package, 就會試著去 安裝/移除 它) : sudo apt dist-upgrade
sudo apt update && sudo apt upgrade && sudo apt dist-upgrade 
# 安裝 tasksel(含 安裝軟件包之軟體)
sudo apt install tasksel
# 列出可安裝之任務
tasksel --list-tasks
# 透過 tasksel 安裝 lamp-server
sudo tasksel install lamp-server
# check apache 是否正常
curl http://localhost
# 使用 telnet text port 80
telnet 127.0.0.1 80
	Trying 127.0.0.1...
	Connected to 127.0.0.1.
	Escape character is '^]'.
安裝 phpmyadmin
1
sudo apt install phpmyadmin

按 space 選擇 apache2,再用 tab 選到 ok

選 Yes mapping database to phpadmin

輸入 phpmyadmin 註冊到資料庫的密碼

使用 browser 開啟 http://public_ip/phpmyadmin/ 即可用帳號 phpmyadmin 登入
(public_ip 填入實際ip)

設定 database
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
# mysql version
mysql --version
# 進入 mysql 
sudo mysql
# 查 user
mysql> SELECT user,authentication_string,plugin,host FROM mysql.user;
+------------------+------------------------------------------------------------------------+-----------------------+----
| user             | authentication_string                                                  | plugin                | hos
+------------------+------------------------------------------------------------------------+-----------------------+----
[V@L/N(.S+[gvM/2PeLoCrXt5q1NOKLFJR6F4ItguIdyxM6Px6lot6 | caching_sha2_password | localhost |
| mysql.infoschema | $A$005$THISISACOMBINATIONOFINVALIDSALTANDPASSWORDTHATMUSTNEVERBRBEUSED | caching_sha2_password | loc
| mysql.session    | $A$005$THISISACOMBINATIONOFINVALIDSALTANDPASSWORDTHATMUSTNEVERBRBEUSED | caching_sha2_password | loc
| mysql.sys        | $A$005$THISISACOMBINATIONOFINVALIDSALTANDPASSWORDTHATMUSTNEVERBRBEUSED | caching_sha2_password | loc
Kd262Q%*OQHik@|HFSXTBukSEcHmTHrSomDLHSlTUHTaIaP4ZHpWCCHXw8 | caching_sha2_password | localhost |
| root             |                                                                        | auth_socket           | loc
+------------------+------------------------------------------------------------------------+-----------------------+----
6 rows in set (0.00 sec)
mysql> SELECT user,plugin,host FROM mysql.user;
+------------------+-----------------------+-----------+
| user             | plugin                | host      |
+------------------+-----------------------+-----------+
| debian-sys-maint | caching_sha2_password | localhost |
| mysql.infoschema | caching_sha2_password | localhost |
| mysql.session    | caching_sha2_password | localhost |
| mysql.sys        | caching_sha2_password | localhost |
| phpmyadmin       | caching_sha2_password | localhost |
| root             | auth_socket           | localhost |
+------------------+-----------------------+-----------+
6 rows in set (0.00 sec)
mysql>
# 設定權限: 密碼強度控制、拒絕遠端 root 登入 等等的安全性設
sudo mysql_secure_installation
	Securing the MySQL server deployment.
	Connecting to MySQL using a blank password.
	VALIDATE PASSWORD COMPONENT can be used to test passwords
	and improve security. It checks the strength of password
	and allows the users to set only those passwords which are
	secure enough. Would you like to setup VALIDATE PASSWORD component?
	# 設定密碼強度
	Press y|Y for Yes, any other key for No: n
	# 輸入密碼
	Please set the password for root here.
	New password:
	Re-enter new password:
	By default, a MySQL installation has an anonymous user,
	allowing anyone to log into MySQL without having to have
	a user account created for them. This is intended only for
	testing, and to make the installation go a bit smoother.
	You should remove them before moving into a production
	environment.
	# 移除匿名 user?
	Remove anonymous users? (Press y|Y for Yes, any other key for No) : Y
	Success.
	Normally, root should only be allowed to connect from
	'localhost'. This ensures that someone cannot guess at
	the root password from the network.
  # disable remote root?
	Disallow root login remotely? (Press y|Y for Yes, any other key for No) : N
	... skipping.
	By default, MySQL comes with a database named 'test' that
	anyone can access. This is also intended only for testing,
	and should be removed before moving into a production
	environment.
	# 移除 test database
	Remove test database and access to it? (Press y|Y for Yes, any other key for No) : N
	... skipping.
	Reloading the privilege tables will ensure that all changes
	made so far will take effect immediately.
	# 更新權限 table
	Reload privilege tables now? (Press y|Y for Yes, any other key for No) : Y
	Success.
	All done!
# 設定 mysql 登入要使用密碼
sudo mysql
# 更改 root password
mysql> ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY 'rootpassword';
	Query OK, 0 rows affected (0.00 sec)
# Reload 權限設定 
mysql> FLUSH PRIVILEGES;
Query OK, 0 rows affected (0.00 sec)

# login mysql by root
sudo mysql -u root -p
mysql>

# 使用 browser 開啟 http://public_ip/phpmyadmin/ 即可用帳號 root 登入
change apache root folder
1
2
3
4
5
6
7
8
9
10
11
12
13
# change apache root folder
sudo vi /etc/apache2/sites-available/000-default.conf
// --- 更改前
DocumentRoot /var/www/html
// --- 更改後
DocumentRoot /var/www
# 更改目錄權限,及建立軟連結
sudo chown -R ubuntu:ubuntu /var/www
ln -s /var/www ./www
echo "Hello World..." > /var/www/index.html
# restart
sudo service apache2 restart
# open browser check work well

執行 FileZilla, 新增站台, 選擇協定為 SFTP, 設定IP, 設定使用者,選擇 ssh key 檔案,點選連線

選擇信任主機

SFTP 連線後,即可將必要的檔案傳入

建立 user 和 資料庫

建立 user 

1
2
3
4
5
6
7
8
9
10
11
sudo mysql -u root -p
mysql> CREATE USER 'robert'@'localhost' IDENTIFIED BY 'userpassword';
Query OK, 0 rows affected (0.02 sec)

mysql> GRANT ALL ON robert.* TO robert@localhost;
Query OK, 0 rows affected (0.01 sec)

mysql> FLUSH PRIVILEGES;
Query OK, 0 rows affected (0.00 sec)

mysql>

建立資料庫

匯入已有之資料庫

設定 Elastic IP(彈性IP) - 關機重開不會更改IP

  1. 選擇 Elastic IPs, 再點選 Allocate Elastic IP address
  1. 點選 Allocate
  1. 再選擇 Actions, Associate IP address
  1. 點選 Associate 即 設定完成,開 browser 看是否執行正常

設定 Domain name - DoDaDDy

  1. 設定 domain name 對應 ip

VSCode SFTP 同步 Server Code

  1. VSCode 安裝 SFTP FTP sync
  1. Setup Config

Ctrl + shift + P or F1 –> SFTP:Config –> 設定 sftp.json 內容

sftp.json 內容

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
{
	"name": "robert_apache_new",
  "host": "35.72.2.117",
  "protocol": "sftp",
  "port": 22,
  "username": "ubuntu",
  "remotePath": "/home/ubuntu/www/blog3",
	"uploadOnSave": false,
	"secure": true,
	"privateKeyPath": "../robert_aws_apache.pem",
	"syncMode": "update",
	"debug": true,
	"watcher": {
		"files": "**/*",
		"autoUpload": true,
		"autoDelete": true
	},
	"ignore": [
		"\\.vscode",
		"\\.git",
		"\\.DS_Store",
		"conn.php",
		"*.bak"
	]
}

sftp.json 內容 mutiple Context
mutiple Context 僅能 link 最後一個, name也不能重複
所以要使用時,copy 到最後,改一下 name 即可

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
[
	{
		"name": "robert_apache_new",
		"host": "35.72.2.117",
		"protocol": "sftp",
		"port": 22,
		"username": "ubuntu",
		"remotePath": "/home/ubuntu/www/blog3",
		"uploadOnSave": false,
		"secure": true,
		"privateKeyPath": "../robert_aws_apache.pem",
		"syncMode": "update",
		"debug": true,
		"watcher": {
			"files": "**/*",
			"autoUpload": true,
			"autoDelete": true
		},
		"ignore": [
			"\\.vscode",
			"\\.git",
			"\\.DS_Store",
			"conn.php",
			"*.bak"
		]
	},
	{
		"name": "robert_apache3",
		"host": "54.238.250.158",
		"protocol": "sftp",
		"port": 22,
		"username": "ubuntu",
		"remotePath": "/home/ubuntu/www/blog2",
		"uploadOnSave": false,
		"secure": true,
		"privateKeyPath": "../demo_apache.pem",
		"syncMode": "update",
		"debug": true,
		"watcher": {
			"files": "**/*",
			"autoUpload": true,
			"autoDelete": true
		},
		"ignore": [
			"\\.vscode",
			"\\.git",
			"\\.DS_Store",
			"conn.php",
			"*.bak"
		]
	},
	{
		"name": "robert_null",
		"host": "127.0.0.1",
		"protocol": "sftp",
		"port": 22,
		"username": "ubuntu",
		"remotePath": "/",
		"uploadOnSave": false,
		"secure": true,
		"privateKeyPath": "",
		"syncMode": "update",
		"debug": true
	},
	{
		"name": "robert_apache3_",
		"host": "54.238.250.158",
		"protocol": "sftp",
		"port": 22,
		"username": "ubuntu",
		"remotePath": "/home/ubuntu/www/blog2",
		"uploadOnSave": false,
		"secure": true,
		"privateKeyPath": "../demo_apache.pem",
		"syncMode": "update",
		"debug": true,
		"watcher": {
			"files": "**/*",
			"autoUpload": true,
			"autoDelete": true
		},
		"ignore": [
			"\\.vscode",
			"\\.git",
			"\\.DS_Store",
			"conn.php",
			"*.bak"
		]
	}
]
  1. 同步 remote Servet

Ctrl + shift + P or F1 –> SFTP:Sync Local -> remote

選擇 server

OUTPUT 會顯示 SFTP 執行內容

安裝 #2 - 個別安裝

安裝 apache2
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
# 更新軟體
sudo apt update && sudo apt upgrade && sudo apt dist-upgrade 
# insatll apache
sudo apt install apache2
# start apache
sudo service apache2 start
# change apache root folder
sudo vi /etc/apache2/sites-available/000-default.conf
// --- 更改前
DocumentRoot /var/www/html
// --- 更改後
DocumentRoot /var/www
# 更改目錄權限,及建立軟連結
sudo chown -R ubuntu:ubuntu /var/www
ln -s /var/www ./www
echo "Hello World..." > /var/www/index.html
# restart
sudo service apache2 restart
# open browser check work well
安裝 php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
# install
sudo apt install php-fpm libapache2-mod-php php-curl php-imagick php-mysql php-gd php-mbstring php-xml
# php version
php -v
# add /var/www/phpinfo.php
vi ./www/phpinfo.php

<?php
  phpinfo();
?>
# restart
sudo service apache2 restart
# open browser phpinfo.php ceck work well
# 檢查是否有 imagick、curl、mysqli、pdo_mysql、gd、mbstring 功能
安裝 MySQL
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
# Install MySQL
sudo apt install mysql-server
# Run the security script 
sudo mysql_secure_installation
# Creating MySQL User 
sudo mysql
mysql> CREATE USER 'robert'@'localhost' IDENTIFIED BY 'passwrod';
Query OK, 0 rows affected (0.02 sec)

# 更改 root password Password Plugin to mysql_native_password for remote login
mysql> ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY 'passwrod';
Query OK, 0 rows affected (0.01 sec)

# 授予 user 權限
mysql> GRANT ALL  ON robert.* TO 'robert'@'localhost';
Query OK, 0 rows affected (0.01 sec)

# create database - 特別要用反引號
mysql> CREATE DATABASE `robert`;
Query OK, 1 row affected (0.01 sec)

# free previous command cache 
mysql> FLUSH PRIVILEGES;
Query OK, 0 rows affected (0.00 sec)

mysql> exit
Bye
檢查 MySQL 安裝結果
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
# chec mysql status
ubuntu@ip-172-31-35-217:~$ systemctl status mysql.service
● mysql.service - MySQL Community Server
     Loaded: loaded (/lib/systemd/system/mysql.service; enabled; vendor preset:>
     Active: active (running) since Thu 2021-07-22 06:54:12 UTC; 52min ago
   Main PID: 36133 (mysqld)
     Status: "Server is operational"
      Tasks: 38 (limit: 1160)
     Memory: 333.2M
     CGroup: /system.slice/mysql.service
             └─36133 /usr/sbin/mysqld

# use comand mysqladmin tool dump version
sudo mysqladmin -p -u robert version
	Enter password:
	mysqladmin  Ver 8.0.25-0ubuntu0.20.04.1 for Linux on x86_64 ((Ubuntu))
	Copyright (c) 2000, 2021, Oracle and/or its affiliates.
	Oracle is a registered trademark of Oracle Corporation and/or its
	affiliates. Other names may be trademarks of their respective
	owners.
	Server version          8.0.25-0ubuntu0.20.04.1
	Protocol version        10
	Connection              Localhost via UNIX socket
	UNIX socket             /var/run/mysqld/mysqld.sock
	Uptime:                 55 min 19 sec
	Threads: 2  Questions: 20  Slow queries: 0  Opens: 159  Flush tables: 3  Open ta
	bles: 78  Queries per second avg: 0.006
install phpMyAdmin
1
2
# install phpMyAdmin 相關 package
sudo apt install phpmyadmin php-mbstring php-zip php-gd php-json php-curl

按 space 選擇 apache2,再用 tab 選到 ok

選 Yes mapping database to phpadmin

輸入 phpmyadmin 註冊到資料庫的密碼

1
2
3
4
# enable mbstring PHP extension, 
sudo phpenmod mbstring
# restart apache2
sudo systemctl restart apache2

使用 browser 開啟 http://public_ip/phpmyadmin/ 即可用帳號 phpmyadmin 登入
(public_ip 填入實際ip)

可使用 .htaccess 增加 phpMyAdmin 安全性(有必要再來研究)

其他 app 連至 MySQL

Inbound Rules 新增 HTTP TCP port:3306
mask bind-address(允許連線主機)
1
2
3
4
5
sudo vi /etc/mysql/mysql.conf.d/mysqld.cnf
# --- 原來
bind-address          = 127.0.0.1
# --- 修改後
# bind-address          = 127.0.0.1
root localhost 改成 %
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
sudo mysql -u root -p
Enter password:

mysql> SELECT user,plugin,host FROM mysql.user;
	+------------------+-----------------------+-----------+
	| user             | plugin                | host      |
	+------------------+-----------------------+-----------+
	| debian-sys-maint | caching_sha2_password | localhost |
	| mysql.infoschema | caching_sha2_password | localhost |
	| mysql.session    | caching_sha2_password | localhost |
	| mysql.sys        | caching_sha2_password | localhost |
	| phpmyadmin       | caching_sha2_password | localhost |
	| robert           | caching_sha2_password | localhost |
	| root             | mysql_native_password | localhost |
	+------------------+-----------------------+-----------+
	7 rows in set (0.00 sec)

mysql> use mysql;
	Reading table information for completion of table and column names
	You can turn off this feature to get a quicker startup with -A
	Database changed

mysql> update user set host ='%'where user ='root' and host ='localhost';
	Query OK, 1 row affected (0.01 sec)
	Rows matched: 1  Changed: 1  Warnings: 0

mysql> SELECT user,plugin,host FROM mysql.user;
	+------------------+-----------------------+-----------+
	| user             | plugin                | host      |
	+------------------+-----------------------+-----------+
	| root             | mysql_native_password | %         |
	| debian-sys-maint | caching_sha2_password | localhost |
	| mysql.infoschema | caching_sha2_password | localhost |
	| mysql.session    | caching_sha2_password | localhost |
	| mysql.sys        | caching_sha2_password | localhost |
	| phpmyadmin       | caching_sha2_password | localhost |
	| robert           | caching_sha2_password | localhost |
	+------------------+-----------------------+-----------+
	7 rows in set (0.00 sec)

mysql> flush privileges;
	Query OK, 0 rows affected (0.01 sec)

mysql> quit
	Bye
1
2
# restart mysql
sudo systemctl restart mysql
heidisq port 3306 setting

logs 查詢

  1. apache2 log
1
less -m -N /var/log//apache2/error.log

AWS 部署和託管 React 應用程式

建立新的 React 應用程式

1
2
3
npx create-react-app react-todos
cd react-todos
npm start

初始化 GitHub 儲存庫

  • 建立 GitHub 儲存庫

  • 初始化 git, 並將程式推送至 GitHub

    1
    2
    3
    # git 已自動 init
    git remote add origin https://github.com/hot5656/react-todos.git
    git push -u origin master

使用 AWS Amplify 部署應用程式

  • AWS Amplify –> Deliver –> Get started

  • select GitHub

  • 驗證完後, 選擇正確的 repository

  • 接受預設的建置設定，然後選取 Next

  • 檢閱最終詳細資訊，然後選取 Save and Deploy (儲存並部署)

  • AWS Amplify 主控台現在將在 https://…amplifyapp.com 建立您的源代碼並部署您的應用程式

  • 選擇 link 即可看到執行畫面

更新應用程式

  • 程式更動後 push 到 github

    1
    2
    3
    git add .
    git commit -m "update for todos"
    git push -u origin master

  • 在 AWS Amplify 即可檢視更新的應用程式

DevTools 可看到原始 source, 應該要另外處理