├── README.md ├── server ├── README.md ├── myweb │ ├── db │ │ └── db.sql │ ├── docker-compose.yml │ ├── web-image │ │ └── Dockerfile │ └── www │ │ ├── config.php │ │ ├── index.php │ │ ├── login.php │ │ └── robots.txt └── nginx_conf └── static ├── external.html ├── index.html ├── inline.html ├── internal.html ├── mycss.css └── myjs.js /README.md: -------------------------------------------------------------------------------- 1 | # 網頁安全課程 2 | 3 | 1. /static 目標：可利用 github puge 完成靜態網站(包含 HTML、CSS、JavaScript) 4 | - [其中 CSS 與 JavaScript 要用三種方式引入](https://fei3363.github.io/WebSecurityCourse/static/index.html) 5 | - 引入檔案 6 | - 放入 HTML 7 | - 在 tag 中直接撰寫 8 | 2. /server 目標：可利用　PHP、MySQL、docker、docker-compose 建立動態網站 9 | -------------------------------------------------------------------------------- /server/README.md: -------------------------------------------------------------------------------- 1 | # 部屬 SQL injection LAB 2 | 3 | ## 安裝 docker 4 | - 可以參考 https://docs.docker.com/engine/install/ubuntu/#install-using-the-repository 5 | 6 | - use root 7 | ``` 8 | apt-get update 9 | apt-get install ca-certificates curl gnupg lsb-release 10 | curl -fsSL https://download.docker.com/linux/ubuntu/gpg | gpg --dearmor -o /usr/share/keyrings/docker-archive-keyring.gpg 11 | echo \ 12 | "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/docker-archive-keyring.gpg] https://download.docker.com/linux/ubuntu \ 13 | $(lsb_release -cs) stable" | tee /etc/apt/sources.list.d/docker.list > /dev/null 14 | apt-get update 15 | apt-get install docker-ce docker-ce-cli containerd.io 16 | docker run hello-world 17 | ``` 18 | - use sudo 19 | ``` 20 | sudo apt-get update 21 | sudo apt-get install \ 22 | ca-certificates \ 23 | curl \ 24 | gnupg \ 25 | lsb-release 26 | curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /usr/share/keyrings/docker-archive-keyring.gpg 27 | echo \ 28 | "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/docker-archive-keyring.gpg] https://download.docker.com/linux/ubuntu \ 29 | $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null 30 | sudo apt-get update 31 | sudo apt-get install docker-ce docker-ce-cli containerd.io 32 | sudo docker run hello-world 33 | ``` 34 | 35 | ## 安裝 docker-compose 36 | ``` 37 | curl -L "https://github.com/docker/compose/releases/download/1.29.2/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose 38 | chmod +x /usr/local/bin/docker-compose 39 | docker-compose --version 40 | ``` 41 | 42 | ## 建立網站資料夾 43 | - 如專案資料夾內的檔案 44 | ``` 45 | . 46 | ├── db 47 | │ └── db.sql 48 | ├── docker-compose.yml 49 | ├── web-image 50 | │ └── Dockerfile 51 | └── www 52 | ├── config.php 53 | ├── index.php 54 | ├── login.php 55 | └── robots.txt 56 | ``` 57 | 58 | ## 執行 docker-compose 59 | - 確認資料夾有 docker-compose.yml 60 | ``` 61 | $ ls 62 | db docker-compose.yml web-image www 63 | ``` 64 | - 利用 docker-compose 執行 65 | - `up` 執行 66 | - `-d` 在背景執行 67 | - `--build` 進行編譯 68 | ``` 69 | $ docker-compose up -d --build 70 | ``` 71 | 72 | 73 | ## 外網掛域名的步驟 74 | 75 | ### 編輯 nginx 76 | ``` 77 | apt install nginx -y 78 | vim /etc/nginx/sites-enabled/website 79 | vim docker-compose.yml 80 | add hostname: test.fei.works 81 | service nginx restart 82 | ``` 83 | 84 | ### 設定 domain 85 | - A 紀錄 IP 86 | 87 | ### 安裝 cret 88 | - https://certbot.eff.org/ 89 | - https://certbot.eff.org/instructions?ws=nginx&os=ubuntufocal 90 | 91 | ``` 92 | snap install core;snap refresh core 93 | snap install --classic certbot 94 | ln -s /snap/bin/certbot /usr/bin/certbot 95 | certbot --nginx 96 | ``` 97 | -------------------------------------------------------------------------------- /server/myweb/db/db.sql: -------------------------------------------------------------------------------- 1 | SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO"; 2 | SET time_zone = "+08:00"; 3 | 4 | CREATE TABLE `users` ( 5 | `id` int(11) NOT NULL auto_increment, 6 | `username` varchar(64) NOT NULL, 7 | `password` varchar(64) NOT NULL, 8 | PRIMARY KEY (id) 9 | ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4; 10 | 11 | INSERT INTO `users` (`id`, `username`, `password`) VALUES ("1", "admin", "123456"); 12 | INSERT INTO `users` (`id`, `username`, `password`) VALUES ("2", "nqgr", "abcdef"); 13 | INSERT INTO `users` (`id`, `username`, `password`) VALUES ("3", "ombz", "qazwsx"); 14 | INSERT INTO `users` (`id`, `username`, `password`) VALUES ("4", "pgid", "edcrfv"); 15 | INSERT INTO `users` (`id`, `username`, `password`) VALUES ("5", "fsfw", "tgbyhn"); -------------------------------------------------------------------------------- /server/myweb/docker-compose.yml: -------------------------------------------------------------------------------- 1 | version: "2" 2 | services: 3 | web: 4 | build: ./web-image 5 | ports: 6 | - "8080:80" 7 | volumes: 8 | - ./www:/var/www/html/ 9 | links: 10 | - db 11 | networks: 12 | - default 13 | hostname: test.fei.works 14 | db: 15 | image: mysql:5.7 16 | environment: 17 | MYSQL_DATABASE: myDb 18 | MYSQL_USER: user 19 | MYSQL_PASSWORD: PASSWORD_test 20 | MYSQL_ROOT_PASSWORD: ROOT_PASSWORD_test 21 | volumes: 22 | - ./db:/docker-entrypoint-initdb.d 23 | networks: 24 | - default 25 | hostname: test.fei.works 26 | phpmyadmin: 27 | image: phpmyadmin/phpmyadmin 28 | links: 29 | - db:db 30 | ports: 31 | - 8082:80 32 | hostname: test.fei.works 33 | environment: 34 | MYSQL_USER: user 35 | MYSQL_PASSWORD: PASSWORD_test 36 | MYSQL_ROOT_PASSWORD: ROOT_PASSWORD_test -------------------------------------------------------------------------------- /server/myweb/web-image/Dockerfile: -------------------------------------------------------------------------------- 1 | FROM php:7.0.30-apache 2 | RUN docker-php-ext-install mysqli -------------------------------------------------------------------------------- /server/myweb/www/config.php: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /server/myweb/www/index.php: -------------------------------------------------------------------------------- 1 |
2 | 3 | 4 | 5 | 6 |
-------------------------------------------------------------------------------- /server/myweb/www/login.php: -------------------------------------------------------------------------------- 1 | '; 19 | echo '登入成功'; 20 | }else{ 21 | echo '登入失敗'; 22 | } 23 | } 24 | catch (Exception $e) { 25 | echo 'Caught exception: ', $e->getMessage(), '
'; 26 | echo 'Check credentials in config file at: ', $Mysql_config_location, '\n'; 27 | } 28 | ?> -------------------------------------------------------------------------------- /server/myweb/www/robots.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/fei3363/WebSecurityCourse/9fe1826b7b95aad6d222968250c02aaad566e706/server/myweb/www/robots.txt -------------------------------------------------------------------------------- /server/nginx_conf: -------------------------------------------------------------------------------- 1 | server { 2 | server_name feifei.work; 3 | location / { 4 | proxy_pass http://localhost:8080; 5 | proxy_set_header Host $host; 6 | proxy_set_header X-Real-IP $remote_addr; 7 | proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; 8 | } 9 | } -------------------------------------------------------------------------------- /static/external.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 網頁安全課程-靜態網站-引入檔案 6 | 7 | 8 | 9 | 10 | 11 |

引入檔案

12 |

本頁面示範引入 css 檔案與 js 檔案的方式

13 |

可使用檢視原始碼查看內容

14 |

css 改變顏色，js 則會在 console 印出 Hello Fei!

15 |

請開啟開發者工具才能看到 console

16 | 回首頁 17 | 18 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /static/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 網頁安全課程-靜態網站 6 | 7 | 8 | 9 | 10 |

靜態網站製作

11 |

任務

12 |

可利用 GitHub page 完成靜態網站(包含 HTML、CSS、JavaScript)

13 | 18 |

參考連結

19 | 27 |

解答

28 | 33 | 34 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /static/inline.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 網頁安全課程-靜態網站-在 tag 中直接撰寫 6 | 7 | 8 | 9 | 10 |

在 tag 中直接撰寫

11 |

本頁面示範在 tag 中直接撰寫 css 與 js 的方式

12 |

可使用檢視原始碼查看內容

13 |

css 改變顏色，js 則會在需要點選按鈕

14 | 15 | 回首頁 16 | 17 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /static/internal.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 網頁安全課程-靜態網站-放入 HTML 6 | 19 | 20 | 21 | 22 | 23 |

放入 HTML

24 |

本頁面示範放在 HTML 中使用 style 標籤與 script 標籤

25 |

可使用檢視原始碼查看內容

26 |

css 改變顏色，js 則會在載入頁面後彈出 Hello Fei!

27 |

請開啟開發者工具才能看到 console

28 | 回首頁 29 | 30 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /static/mycss.css: -------------------------------------------------------------------------------- 1 | body {background-color: powderblue;} 2 | h1 {color: blue;} 3 | p {color: red;} -------------------------------------------------------------------------------- /static/myjs.js: -------------------------------------------------------------------------------- 1 | console.log("Hello Fei!"); --------------------------------------------------------------------------------