Nginx配置详解

mango1698

已于 2024-09-09 09:52:16 修改

阅读量2.5w

点赞数 37

分类专栏：服务器文章标签： nginx linux 网络

于 2024-07-26 09:30:14 首次发布

本文链接：https://blog.csdn.net/weixin_45682053/article/details/140706788

版权

服务器专栏收录该内容

3 篇文章

订阅专栏

文章目录

1. Nginx安装

进入到/usr/local目录下，执行命令：

yum install -y nginx

通过如下命令启动nginx服务

systemctl start nginx

通过如下命令，设置nginx开启自启动

systemctl enable nginx

nginx默认占用80端口。

访问ip:80，可以看到如下页面

这个页面默认目录为/usr/share/nginx/html。

2. Nginx配置

2.1 配置文件简介

修改配置之前，一般我们都需要备份一下我们的配置文件，以防改错了。

nginx的配置文件在/etc/nginx目录下，配置文件名称为nginx.conf。nginx.conf.default为nginx的默认配置文件，相当于一个初始文件的备份文件。

可以通过如下命令，删除配置文件中的注释以及换行。

grep -Ev '#|^$' nginx.conf > nginx.conf

去除多余内容后，剩下的内容如下：

worker_processes  1;
events {
    worker_connections  1024;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;
    server {
        listen       80;
        server_name  localhost;
        location / {
            root   html;
            index  index.html index.htm;
        }
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }
}

目前我们可以删除第8行、第9行、17-20行的内容，只保留如下：

worker_processes  1;
events {
    worker_connections  1024;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    server {
        listen       80;
        server_name  localhost;
        location / {
            root   html;
            index  index.html index.htm;
        }
    }
}

这就是nginx的最小配置项。

修改保存配置文件后，我们想让配置文件生效，需要重启nginx服务。

systemctl restart nginx
ps -ef|grep nginx # 查看nginx进程

nginx -t # 检测配置文件是否存在错误

当工作进程出现问题或者被杀死后，nginx管理进程会自动创建新的工作进程。如果杀死nginx管理进程，相当于停止了nginx服务。

2.2 配置文件详解

worker_processes：表示只启动几个工作进程，具体值为多少，一般根据CPU核数来定，如果CPU为八核，那么此处值就填8。
events
- worker_connections：连接数量，每个进程可以处理多少连接。一般就保持默认，1024。
http
- include：nginx能够识别出的文件类型，指定一个文件，这个文件中存储了nginx能够识别出的文件类型，默认为nginx.conf同一目录下的mime.types文件。
  
  如果nginx不能够识别A文件，那么nginx也会将A文件返回给浏览器，浏览器如果可以识别便会解析，如果浏览器也无法识别，则会让用户下载文件。
  
  如果B文件类型是nginx能够识别的，但是浏览器无法识别，浏览器就会尝试以txt文档的格式进行展示该文件。
- default_type：如果文件无法被nginx识别出，也就是文件类型没有在include指定的文件中定义指定，那么nginx就会以default_type指定的类型返回数据。application/octet-stream指nginx以8进制数据流的方式将数据返回给浏览器。一般默认即可。
- server 该部分就是针对网站代码的配置，如果我们需要配置多个网站，可以复制配置多个server。
  - listen：指定访问该网站的端口号，默认为80。
  - server_name：配置域名。
  - location：匹配以什么开头的URI，默认为/，表示匹配所有请求。如配置了/user，那么请求ip:端口/user/xx就会匹配到该路由。
    - root：指定项目的目录。可以填写绝对路径，也可以填写相对路径。填写相对路径是，默认根路径为/usr/share/nginx。
    - index：指定了当请求是一个目录时，Nginx应该返回哪个文件作为默认文件。
    - proxy_pass：指定请求转发到后端的路径。

2.3 路由匹配问题

location /api {  
    root   /codewei;  
    index  index.html index.htm;  
}

当我们按照如上配置时。当请求 http://ip:81/api 时，Nginx会做以下几件事：

匹配到location /api块。
根据root指令，知道应该在文件系统的/codewei目录下查找文件。
因为请求的是/api，所以Nginx会在/codewei目录下查找名为api的文件或目录。如果找到名为api的目录，Nginx会进一步在这个目录中查找index指令指定的文件（index.html或index.htm）。

如果我们的意图是让http://ip:81/api直接访问/codewei目录下的index.html文件，而不是/codewei/api/index.html，我们应该使用alias指令而不是root指令，如下所示：

location /api {  
    alias   /codewei/;  # 注意这里的斜杠，它表示/codewei目录  
    index   index.html index.htm;  
}

使用alias指令后，Nginx就会知道/api请求实际上应该对应到文件系统中的/codewei/目录，而不是/codewei/api目录。这样，当你访问http://ip:81/api时，Nginx就会提供/codewei/目录下的index.html文件。

2.4 对于 root后的路径是否要以/结尾的问题

在Nginx的配置中，使用root指令时，目录路径的末尾是否加/（斜杠）是有区别的。这主要影响到Nginx如何拼接请求的路径和root指定的目录路径。

如果你的root指令后面没有加/，Nginx会将其视为一个相对路径的起点，并将请求的URI路径完整地附加在这个起点后面。例如：

location /api {  
    root   /codewei;  
    index  index.html index.htm;  
}

对于请求http://ip:81/api/some/path，Nginx会在/codewei目录下查找api/some/path这个路径。注意，这里包括了api部分，因为root后面没有加/。

然而，如果你的root指令后面加了/，Nginx会将其视为一个绝对路径的起点，并且只会将请求URI中location匹配之后的部分附加在这个起点后面。例如：

location /api {  
    root   /codewei/;  
    index  index.html index.htm;  
}

对于同样的请求http://ip:81/api/some/path，Nginx现在会在/codewei/目录下查找some/path这个路径。注意，这里不包括api部分，因为root后面加了/。

3. 部署SpringBoot+Vue

3.1 后端项目

后端仅一个Controller，无其他内容。

@RestController
@RequestMapping("/user")
@CrossOrigin(origins = "*")
public class NginxController {

    @GetMapping("/getName")
    public String getName(){
        return "小明";
    }

    @GetMapping("/getAgeById/{id}")
    public String getAgeById(@PathVariable("id") Integer id){
        return String.valueOf(id);
    }
}

后端配置文件application.yaml

server:
  port: 8080

使用maven build进行打包。

将打包好的jar包上传到服务器，使用nohup java -jar xxx.jar &运行项目。

3.2 前端项目

前端页面

<template>
  <div>
    <button @click="getName">获取名字</button>
    <button @click="getAgeById">根据ID获取年龄</button>
    <div style="text-align: center;font-weight: 600;" v-cloak>{{result}}</div>
  </div>
</template>

<script>
import {getAgeById, getName} from "@/api/user";

export default {
  data() {
    return {
      result:""
    }
  },
  methods: {
    getName(){
      getName().then((response) => {
        this.result = response.data;
      })
    },
    getAgeById(){
      getAgeById(23).then((response) => {
        this.result = response.data;
      })
    }
  }
}
</script>

axios配置

import axios from "axios";

const request = (option) => {
    const instance = axios.create({
        baseURL: "/api",    // 注意此处！
    });
    return instance(option);
};
export default request;

请求api

import request from '@/util/request'

export function getName() {
    return request({
        url: '/user/getName',
        method: 'get'
    })
}

export function getAgeById(id) {
    return request({
        url: '/user/getAgeById/'+ id,
        method: 'get'
    })
}

vue.config.js配置

module.exports = {
  publicPath: '/',
  outputDir: "dist",
  devServer: {
    port: 80,
    proxy: {
      '/api': {
        target: "http://localhost:8080",
        changOrigin: true,
        ws: true,
        secure: false,
        pathRewrite: {
          '^/api': ''
        }
      }
    }
  }
}

使用npm run build进行打包。会生出一个dist目录。

3.3 nginx配置

将前端打包好的dist目录上传到服务器。

如上图，我上传到了/home目录下。注意该地址，配置nginx时需要使用。

nginx配置

worker_processes  1;
events {
    worker_connections  1024;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    server {
        listen       80;   # 访问 ip:80 即可访问
        server_name  localhost;
        location / {
            root /home/dist;   # 刚刚打包好的dist的目录
            index index.html index.htm;
        }
        location /api/ {   # 注意 / 结尾
            proxy_pass http://localhost:8080/;  # 引文后端项目跑在同一个主机上，所以使用lcoalhost 注意 / 结尾
            proxy_redirect off;
            proxy_set_header Host $host;
            proxy_set_header X-real-ip $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
         }
    }
}

此时，我们访问http://ip:80即可访问到前端项目。

4. Nginx各种代理配置

来源：https://blog.csdn.net/mingongge/article/details/139364019

4.1 基础配置说明

# 进程数量
worker_processes 1;
 
events {
  # 最大连接数量
  worker_connections 1024;
}
 
http {
  include mime.types;
  default_type application/octet-stream;
  sendfile on;
  keepalive_timeout 65;

4.2 演示如何强制http跳转https

server {
  listen 80;
  server_name test.com;
 
  # http强制跳转到https
  rewrite ^(.*)$ https://$server_name$1 permanent;
}

4.3 演示如何配置微信支付的校验文件

server {
  listen 80;
  server_name localhost;
 
  # 默认根路径
  location / {
    root index.html;
  }
  # 微信支付校验文件，可以直接配置访问名称
  location ^~/MP_verify_2g3uEjrB5B2LIbNl.txt {
    alias /home/MP_verify_2g3uEjrB5B2LIbNl.txt;
  }
  # 微信支付校验文件，也可以通过正则配置
  location ~^/MP_verify_[a-zA-Z0-9]*\.(txt)$ {
    root /home/;
    rewrite ^/home/(.txt)$ /home/$1 last;
  }
}

4.4 演示root和alias两种配置静态资源的区别

server {
  listen 80;
  server_name localhost;
 
  # 用root方式，location中的路径会拼加到root的地址后面
  # 请求路径为：http://localhost:8080/files/index.jpg    实际访问为：/home/files/index.jpg
  location ~^/files/ {
    root /home/;
    index index.html index.htm;
  }
  # 用alias方式，location中的路径不会拼加到alias的地址后面
  # 这请求路径为：http://localhost:8080/files/index.jpg    实际访问为：/home/index.jpg
  location ~^/files/ {
    alias /home/;
    index index.html index.htm;
  }
}

4.5 演示请求后台接口代理配置

server {
  listen 8080;
  server_name localhost;
 
#################### 第一种场景（代理地址不加斜杠） ####################
  # 请求路径为：http://127.0.0.1:8080/api/getUser   实际代理为：http://127.0.0.1:8000/api/getUser
  location ^~/api/ {
    proxy_pass http://127.0.0.1:8000;
    proxy_set_header Host $http_host; #后台可以获取到完整的ip+端口号
    proxy_set_header X-Real-IP $remote_addr; #后台可以获取到用户访问的真实ip地址
  }
  # 请求路径为：http://127.0.0.1:8080/api/getUser   实际指向为：http://127.0.0.1:8000/api/getUser
  location ^~/api {
    proxy_pass http://127.0.0.1:8000;
    proxy_set_header Host $http_host; #后台可以获取到完整的ip+端口号
    proxy_set_header X-Real-IP $remote_addr; #后台可以获取到用户访问的真实ip地址
  }
 
#################### 第二种场景（代理地址+斜杠） ####################
  # 请求路径为：http://127.0.0.1:8080/api/getUser   实际代理为：http://127.0.0.1:8000/getUser
  location ^~/api/ {
    proxy_pass http://127.0.0.1:8000/;
    proxy_set_header Host $http_host; #后台可以获取到完整的ip+端口号
    proxy_set_header X-Real-IP $remote_addr; #后台可以获取到用户访问的真实ip地址
  }
  # 请求路径为：http://127.0.0.1:8080/api/getUser   实际代理为：http://127.0.0.1:8000//getUser
  location ^~/api {
    proxy_pass http://127.0.0.1:8000/;
    proxy_set_header Host $http_host; #后台可以获取到完整的ip+端口号
    proxy_set_header X-Real-IP $remote_addr; #后台可以获取到用户访问的真实ip地址
  }
 
#################### 第三种场景（代理地址+后缀） ####################
  # 请求路径为：http://127.0.0.1:8080/api/getUser   实际代理为：http://127.0.0.1:8000/user/getUser
  location ^~/api {
    proxy_pass http://127.0.0.1:8000/user;
    proxy_set_header Host $http_host; #后台可以获取到完整的ip+端口号
    proxy_set_header X-Real-IP $remote_addr; #后台可以获取到用户访问的真实ip地址
  }
  # 请求路径为：http://127.0.0.1:8080/api/getUser   实际代理为：http://127.0.0.1:8000/usergetUser
  location ^~/api/ {
    proxy_pass http://127.0.0.1:8000/user;
    proxy_set_header Host $http_host; #后台可以获取到完整的ip+端口号
    proxy_set_header X-Real-IP $remote_addr; #后台可以获取到用户访问的真实ip地址
  }
 
#################### 第四种场景（代理地址+后缀+斜杠） ####################
  # 请求路径为：http://127.0.0.1:8080/api/getUser   实际代理为：http://127.0.0.1:8000/user/getUser
  location ^~/api/ {
    proxy_pass http://127.0.0.1:8000/user/;
    proxy_set_header Host $http_host; #后台可以获取到完整的ip+端口号
    proxy_set_header X-Real-IP $remote_addr; #后台可以获取到用户访问的真实ip地址
  }
  # 请求路径为：http://127.0.0.1:8080/api/getUser   实际代理为：http://127.0.0.1:8000/user//getUser
  location ^~/api {
    proxy_pass http://127.0.0.1:8000/user/;
    proxy_set_header Host $http_host; #后台可以获取到完整的ip+端口号
    proxy_set_header X-Real-IP $remote_addr; #后台可以获取到用户访问的真实ip地址
  }
}

4.6 演示前端项目如何部署nginx

server {
  listen 8090;
  server_name localhost;
 
  # 默认访问
  # 部署路径：/home/web/my_demo
  # 访问路径为：http://localhost:8090/
  location / {
    try_files $uri $uri/ /index.html;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header Host $http_host;
    root /home/web/my_demo/;
    index index.html index.htm;
  }
 
  # 带前缀的访问
  # 部署路径：/home/web/my_demo
  # 访问路径为：http://localhost:8090/my_demo/
  # 如果location路径最后没有配置斜杠，则浏览器输入访问地址后，路径最后会自动拼一个斜杠
  location ^~/my_demo/ {
    try_files $uri $uri/ /my_demo/index.html;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header Host $http_host;
    root /home/web/;
    index index.html index.htm;
  }
}
}