一、拉取镜像，创建容器
🍀1、拉取 nginx 镜像
docker pull nginx:1.17.8
🍀2、查看所有镜像
docker images
🍀3、根据镜像创建和运行 nginx 容器
docker run \ --name nginx \ -p 80:80 \ -d \ nginx:1.17.8
🖊
docker run：运行并创建容器🖊
\：命令换行符（用于增加可读性）🖊
--name：给创建的 Nginx 容器 起个名字🖊
-p：p 指代的英文是【port】；该参数用于做宿主机端口和容器内端口的映射；【:】左边是宿主机端口，【:】右边是容器内端口🖊
-d：d 指代的英文是【detach】；该参数用于让容器后台运行🖊
nginx:1.17.8：镜像名
🍀4、查看所有容器
docker ps -a
二、修改展示页面
🍀1、宿主机创建 nginx 相关的目录（用于和容器内的目录做挂载）
mkdir /home/local/nginx/www mkdir /home/local/nginx/logs mkdir /home/local/nginx/conf
🍀2、拷贝 Nginx 容器内部的默认配置文件到本地目录 /home/local/nginx/conf 中
docker cp \ f322a35a5f37:/etc/nginx/nginx.conf \ /home/local/nginx/conf
🍀3、删除运行中的容器
docker rm -f f322a35a5f37
🍀4、在 www 文件夹放入 index.html 文件（下面是示例）
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>HelloWorld</title> <link rel="icon" href="./favicon.ico" type="image/x-icon"> <style> #words-content { width: 999px; background: #f2f2f2; margin: 18px auto; text-align: center; font-size: 28px; ont-family: "楷体", KaiTi, STKaiti, KaiTi_GB2312, serif; padding: 18px; transition: 1s all; } #words-content:hover { border-radius: 22px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); } .deleted { text-decoration: line-through; font-size: 22px; } .green { color: #68be1f; } #title { font-size: 39px; font-weight: 700; margin-bottom: 20px; color: #0078d7; } </style> </head> <body> <div id="words-content"> <div id="title">你好！世界</div> <div> <i>我们日夜忙碌，我们追逐名利，我们行色匆匆，我们看重得失...</i> </div> <div style="margin: 18px 0"> 我们越来越<span class="deleted">孤独</span>， 越来越<span class="deleted">寂寞</span>， 越来越<span class="deleted">幸苦</span>。 <div>生活中百分百会有<span class="deleted">困难</span>！</div> </div> <div id="encourage"> <div>始终坚信你是<span class="green">最棒的</span>！</div> <div>始终坚信你会<span class="green">成功</span>！</div> <div>You will be extraordinarily <span class="green">lucky</span>！👍</div> <div>Everything around you will be extremely <span class="green">nice</span>！👍</div> <div>You will lead a <span class="green">handsome</span> life everyone longs to have！👍</div> </div> </div> </body> </html>
🍀5、创建并影响容器，同时宿主机目录和容器内目录挂载
docker run \ --name nginx \ -p 80:80 \ -d \ -v /home/local/nginx/www:/usr/share/nginx/html \ -v /home/local/nginx/conf/nginx.conf:/etc/nginx/nginx.conf \ -v /home/local/nginx/logs:/var/log/nginx \ nginx:1.17.8
三、基本配置
🍀1、在 www 目录创建两个目录（每个目录代表一个前端项目）
🍀2、修改 hosts 文件，把域名和宿主机IP进行绑定
vim /etc/hosts
🍀3、修改 conf 目录中的 nginx.conf 文件
user nginx; worker_processes 1; error_log /var/log/nginx/error.log warn; pid /var/run/nginx.pid; events { worker_connections 1024; } http { include /etc/nginx/mime.types; default_type application/octet-stream; log_format main '$remote_addr - $remote_user [$time_local] "$request" ' '$status $body_bytes_sent "$http_referer" ' '"$http_user_agent" "$http_x_forwarded_for"'; access_log /var/log/nginx/access.log main; sendfile on; #tcp_nopush on; keepalive_timeout 65; # gzip on; include /etc/nginx/conf.d/*.conf; # 配置aboutme.gqok.xyz服务 server { listen 80; server_name aboutme.gqok.xyz; root /usr/share/nginx/html/aboutme.gqok.xyz; location / { root /usr/share/nginx/html/aboutme.gqok.xyz; index index.html index.htm index.php; } } # 配置test.gqok.xyz服务 server { listen 80; server_name test.gqok.xyz; root /usr/share/nginx/html/test.gqok.xyz; location / { root /usr/share/nginx/html/test.gqok.xyz; index index.html index.htm index.php; } } }
四、配置反向代理
# 配置test.gqok.xyz服务 server { listen 80; server_name test.gqok.xyz; root /usr/share/nginx/html/test.gqok.xyz; location / { root /usr/share/nginx/html/test.gqok.xyz; index index.html index.htm index.php; if (!-e $request_filename) { # 配置反向代理 proxy_pass http://gqok.xyz:9527; } } }
