入门

Docker安装

拉取镜像

  1. $ docker pull nginx:latest

查看本地镜像：

  1. $ docker images

image.png

运行容器

  1. $ docker run --name nginx-test -p 8080:80 -d nginx

参数说明：

  • —name nginx-test：容器名称。
  • -p 8080:80： 端口进行映射，将本地 8080 端口映射到容器内部的 80 端口。
  • -d nginx： 设置容器在在后台一直运行。

    安装成功

    最后我们可以通过浏览器可以直接访问 8080 端口的 nginx 服务：
    image.png

部署项目

挂载

我们可以看到的是我们每次修改nginx的配置文件需要复制出来，修改，然后复制回去。这样来说甚是麻烦。
我们可以通过挂载的方式来解决来回cp的问题。
我们把前面创建的nginx-test的default.conf放到一个文件夹里面。
比如:我们把default.conf 存放在~/home/nginx/default.conf
image.png
然后我们启动：（需要删除前面创建的容器，或者name跟前面的不一样也行）

  1. $ docker run -d -p 8080:80 -v ~/home/nginx/default.conf:/etc/nginx/conf.d/default.conf --name nginx-test nginx

说明：

  • -v 创建一个挂载， ~/home/nginx/default.conf:/etc/nginx/conf.d/default.conf 前面是宿主机的路径 后面的 是容器中的路径。

我们的default.conf配置文件是放在容器外部的，default.conf文件内容如下所示。

  1. server {
  2.     listen       80;
  3.     listen  [::]:80;
  4.     server_name  localhost;
  6.     #access_log  /var/log/nginx/host.access.log  main;
  8.     location / {
  9.         root   /usr/share/nginx/html;
  10.         index  index.html index.htm;
  11.     }
  13.     #error_page  404              /404.html;
  15.     # redirect server error pages to the static page /50x.html
  16.     #
  17.     error_page   500 502 503 504  /50x.html;
  18.     location = /50x.html {
  19.         root   /usr/share/nginx/html;
  20.     }
  22.     # proxy the PHP scripts to Apache listening on 127.0.0.1:80
  23.     #
  24.     #location ~ \.php$ {
  25.     #    proxy_pass   http://127.0.0.1;
  26.     #}
  28.     # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
  29.     #
  30.     #location ~ \.php$ {
  31.     #    root           html;
  32.     #    fastcgi_pass   127.0.0.1:9000;
  33.     #    fastcgi_index  index.php;
  34.     #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
  35.     #    include        fastcgi_params;
  36.     #}
  38.     # deny access to .htaccess files, if Apache's document root
  39.     # concurs with nginx's one
  40.     #
  41.     #location ~ /\.ht {
  42.     #    deny  all;
  43.     #}
  44. }

添加静态文件index.html。

在home文件下新建index.html文件。

  1. <!DOCTYPE html>
  2. <html lang="en">
  3.   <head>
  4.     <meta charset="UTF-8" />
  5.     <link rel="icon" href="/favicon.ico" />
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  7.     <title>简历</title>
  8.   </head>
  9.   <body>
  10.   <h1>hello nginx -刘正星</h1>
  11.   </body>
  12. </html>

我们想，如果我们将我们的静态文件夹存放在宿主机上，然后做一个挂载放在容器里这个路径，那么我们是不是修改宿主机上面的 静态文件，对应的容器的静态文件也会进行修改。
这个就是实现了我们前端页面用nginx显示的需求吗。
image.png
运行如下命令：

  1.  $ docker run -d -p 8080:80 -v ~/home/nginx/default.conf:/etc/nginx/conf.d/default.conf -v ~/home:/usr/share/nginx/html --name nginx-test nginx

image.png
image.png

通过浏览器访问测试一下。
image.png

参考文章： https://blog.csdn.net/datouniao1/article/details/106442387 同一台机器多项目部署 https://zhuanlan.zhihu.com/p/69555541

问题

单页应用页面刷新404问题

原因

原因是因为web单页面开发模式，只有一个index.html入口，其他路径是前端路由去跳转的，nginx没有对应这个路径，当然就是404了。

解决方案

  1. location / {
  2.     root   /usr/nginx/app/dist/;
  3.     index  index.html;
  4.     try_files  $uri $uri/ /index.html;
  5. }

总结

在配置中加上try_files，意思跟翻译差不多，“尝试读取文件”。u r i 这 个 是 n g i n x 的 一 个 变 量 ， 存 放 着 用 户 访 问 的 地 址 , 例 如 h t t p : / / l o c a l h o s t : 8200 / c h o o s e S i z e 那 么 uri 这个是nginx的一个变量，存放着用户访问的地址,例如http://localhost:8200/chooseSize 那么uri这个是nginx的一个变量，存放着用户访问的地址,例如http://localhost:8200/chooseSize那么uri就是/chooseSize；u r i / 代 表 访 问 的 是 一 个 目 录 例 如 h t t p : / / l o c a l h o s t : 8200 / c h o o s e S i z e / 那 么 uri/ 代表访问的是一个目录 例如http://localhost:8200/chooseSize/ 那么uri/代表访问的是一个目录例如http://localhost:8200/chooseSize/那么uri/就是/chooseSize/；最后/index.html就是我们首页的地址。
最终上面的意思是如果第一个存在，直接返回；不存在的话读取第二个，如果存在，读取返回；如果还是不存在，就会fall back到 try_files 的最后一个选项 /index.html,发起一个内部 “子请求”，也就是相当于 nginx 发起一个 HTTP 请求http://localhost:8200/index.html，再通过前端路由到/chooseSize
[

](https://zhuanlan.zhihu.com/p/69555541)

Nginx配置详解

nginx配置

image.png

普通安装

参考：https://www.runoob.com/linux/nginx-install-setup.html

常用命令

  1. /usr/local/webserver/nginx/sbin/nginx                      # 启动
  2. /usr/local/webserver/nginx/sbin/nginx -s reload            # 重新载入配置文件
  3. /usr/local/webserver/nginx/sbin/nginx -s reopen            # 重启 Nginx
  4. /usr/local/webserver/nginx/sbin/nginx -s stop              # 停止 Nginx
  5. /usr/local/webserver/nginx/sbin/nginx -t                   # 检查配置文件nginx.conf的正确性
  6. /usr/local/webserver/nginx/sbin/nginx -v                   # 查看nginx版本

Nginx同一个server部署多个静态资源目录

一般情况，有时候业务需求，需要在一个server下面不同目录部署两个不同的项目。
比如 http://domain:port/admin 匹配的是 admin 项目
比如 http://domain:port/react 匹配的是 react 项目

我们在nginx.conf里面写一个新的server；

  1. server {
  2.   listen 6002;
  3.   server_name **.**.**.**;
  4.   gzip on;
  6.   location /admin {
  7.     alias /projects/admin/;
  8.     #指定主页
  9.     index index.html;
  10.     #自动跳转
  11.     autoindex on;   
  12.   }
  14.   location /react {
  15.     alias /projects/react/;
  16.     #指定主页
  17.     index index.html;
  18.     #自动跳转
  19.     autoindex on;   
  20.   }
  22. }


复制代码然后关闭 nginx

  1. [root]# nginx -s stop


复制代码重启 nginx

  1. [root]# nginx -c /etc/nginx/nginx.conf


复制代码总结：
这里需要注意的就是location中的路径匹配问题，root和 alias的区别；

错误写法，会报404

  1. # 错误写法，会报404
  2. location /admin {
  3.     root /projects/admin/;
  4.     #指定主页
  5.     index index.html;
  6.     #自动跳转
  7.     autoindex on;   
  8. }
  10. location /react {
  11.     root /projects/react/;
  12.     #指定主页
  13.     index index.html;
  14.     #自动跳转
  15.     autoindex on;   
  16. }
  18. # 当你访问 http://***/admin
  19. # root ==> 实际指向的是 http://***/admin/projects/admin/, 这个时候肯定找不到index.html
  20. # alias ==> 实际指向的是 http://***/admin, 可以在/projects/admin/找到index.html

jsnu
default.conf

  1. # For more information on configuration, see:
  2. #   * Official English Documentation: http://nginx.org/en/docs/
  3. #   * Official Russian Documentation: http://nginx.org/ru/docs/
  5. user nginx;
  6. worker_processes auto;
  7. error_log /var/log/nginx/error.log;
  8. pid /run/nginx.pid;
  10. # Load dynamic modules. See /usr/share/doc/nginx/README.dynamic.
  11. include /usr/share/nginx/modules/*.conf;
  13. events {
  14. worker_connections 1024;
  15. }
  17. http {
  18. log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
  19. '$status $body_bytes_sent "$http_referer" '
  20. '"$http_user_agent" "$http_x_forwarded_for"';
  22. access_log  /var/log/nginx/access.log  main;
  24. sendfile            on;
  25. tcp_nopush          on;
  26. tcp_nodelay         on;
  27. keepalive_timeout   65;
  28. types_hash_max_size 2048;
  30. include             /etc/nginx/mime.types;
  31. default_type        application/octet-stream;
  33. # Load modular configuration files from the /etc/nginx/conf.d directory.
  34. # See http://nginx.org/en/docs/ngx_core_module.html#include
  35. # for more information.
  36. include /etc/nginx/conf.d/*.conf;
  38. server {
  39. listen       80;
  40. listen  [::]:80;
  41. server_name  localhost;
  43. #access_log  /var/log/nginx/host.access.log  main;
  45. location / {
  46. root   /usr/share/nginx/html;
  47. index  index.html index.htm;
  48. try_files  $uri $uri/ /index.html;
  49. }
  50. #error_page  404              /404.html;
  52. # redirect server error pages to the static page /50x.html
  53. #
  54. error_page   500 502 503 504  /50x.html;
  55. location = /50x.html {
  56. root   /usr/share/nginx/html;
  57. }
  59. # proxy the PHP scripts to Apache listening on 127.0.0.1:80
  60. #
  61. #location ~ \.php$ {
  62. #    proxy_pass   http://127.0.0.1;
  63. #}
  65. # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
  66. #
  67. #location ~ \.php$ {
  68. #    root           html;
  69. #    fastcgi_pass   127.0.0.1:9000;
  70. #    fastcgi_index  index.php;
  71. #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
  72. #    include        fastcgi_params;
  73. #}
  75. # deny access to .htaccess files, if Apache's document root
  76. # concurs with nginx's one
  77. #
  78. #location ~ /\.ht {
  79. #    deny  all;
  80. #}
  81. }
  83. # Settings for a TLS enabled server.
  84. #
  85. #    server {
  86. #        listen       443 ssl http2 default_server;
  87. #        listen       [::]:443 ssl http2 default_server;
  88. #        server_name  _;
  89. #        root         /usr/share/nginx/html;
  90. #
  91. #        ssl_certificate "/etc/pki/nginx/server.crt";
  92. #        ssl_certificate_key "/etc/pki/nginx/private/server.key";
  93. #        ssl_session_cache shared:SSL:1m;
  94. #        ssl_session_timeout  10m;
  95. #        ssl_ciphers PROFILE=SYSTEM;
  96. #        ssl_prefer_server_ciphers on;
  97. #
  98. #        # Load configuration files for the default server block.
  99. #        include /etc/nginx/default.d/*.conf;
  100. #
  101. #        location / {
  102. #        }
  103. #
  104. #        error_page 404 /404.html;
  105. #            location = /40x.html {
  106. #        }
  107. #
  108. #        error_page 500 502 503 504 /50x.html;
  109. #            location = /50x.html {
  110. #        }
  111. #    }
  113. }

代理规则

  1. location /api/ {
  2. proxy_pass http://49.234.54.97:8088;  #项目启动地址
  3. }

实际请求 http://49.234.54.97:8088/api/xxx

  1. location /api/ {
  2. proxy_pass http://49.234.54.97:8088/;  #项目启动地址
  3. }

实际请求 http://49.234.54.97:8088/xxx

nginx——尚硅谷

最小配置

worker_processes

worker_processes 1; 默认为1，表示开启一个业务进程

worker_connections

worker_connections 1024; 单个业务进程可接受连接数

include mime.types;

include mime.types; 引入http mime类型

default_type application/octet-stream;

default_type application/octet-stream; 如果mime类型没匹配上，默认使用二进制流的方式传输。

sendfile on;

sendfile on; 使用linux的 sendfile(socket, file, len) 高效网络传输，也就是数据0拷贝。
未开启sendfile
image.png
开启：
image.png##

keepalive_timeout 65;

keepalive_timeout 65;

server

image.png
虚拟主机配置

  1. server {
  2.   listen 80; #监听端口号
  3.   server_name localhost; #主机名
  4.   location / { #匹配路径
  5.     root html; #文件根目录
  6.     index index.html index.htm; #默认页名称
  7.   }
  8.   error_page 500 502 503 504 /50x.html; #报错编码对应页面
  9.   location = /50x.html {
  10.     root html;
  11.   }
  12. }

简版配置

  1. worker_processes auto;
  3. events {
  4. worker_connections 1024;
  5. }
  7. http {
  8.   sendfile            on;
  10.   keepalive_timeout   65;
  12.   include             /etc/nginx/mime.types;
  13.   default_type        application/octet-stream;
  15.   #虚拟主机vhost
  17.   server {
  18.     listen 80; #监听端口号
  19.     server_name localhost;#主机名
  20.     location / { #匹配路径
  21.       root html; #文件根目录
  22.       index index.html index.htm; #默认页名称
  23.     }
  24.     error_page 500 502 503 504 /50x.html; #报错编码对应页面
  25.     location = /50x.html {
  26.       root html;
  27.     }
  28.   }
  29. }