我们平常写的项目通常只能在本机上运行，要想项目能被远程访问就不得不谈到项目部署的知识，接下来我通过实际操作的操作让大家来上线一个vue+springBoot项目。
1.在windows上将vue部署到nginx服务器上
介绍nginx
Nginx是一款高性能的Web服务器和反向代理服务器，具有许多显著的特点和优势，使其在各种应用场景中都能发挥出色。
首先，Nginx的设计重点在于高并发、高性能和低内存消耗。它采用异步、非阻塞的事件驱动架构，能够高效地处理大量并发连接，尤其是对于静态文件请求，效率极高。同时，在保持高性能的同时，Nginx对系统资源特别是内存的占用率较低，使得在相同的硬件条件下能提供更高的服务能力。
其次，Nginx作为反向代理服务器，功能强大且灵活。它可以将客户端的请求转发到多个后端服务器，实现负载均衡、缓存和安全性等功能。Nginx提供了丰富的负载均衡策略，如轮询、加权轮询、IP哈希等，可以根据需要选择合适的策略。同时，它还可以根据配置实现HTTP、HTTPS、TCP等多种协议的负载均衡，并支持会话持久化、健康检查等功能。
此外，Nginx对静态内容处理非常出色，可以快速地处理请求和发送静态内容，如HTML、图片、CSS、JavaScript等。这使得Nginx在提供静态资源服务方面效率很高，可以快速的响应大量的静态请求，减轻其他动态服务器的负担。
同时，Nginx的配置非常灵活，管理员可以根据需要进行各种配置和优化，以满足不同的需求。例如，它可以配置为缓存一些响应结果，降低后端服务器的负载，提高数据的访问速度，平衡访问压力等。
最后，Nginx具有广泛的应用场景，不仅可以用于静态文件服务、反向代理和负载均衡，还可以作为缓存服务器、访问控制和安全工具等。其性能优异、高可靠性、丰富的模块化支持和简单易用等优势，使其在互联网应用中得到了广泛的应用。
总的来说，Nginx是一款功能强大、性能卓越、配置灵活的Web服务器和反向代理服务器，适用于各种需要处理大量并发连接和提供高效服务的场景。
nginx下载与安装
nginx官网：nginx news
进入官网点击download
下载Stable version 版本
我这里用的是老版本1.18.0
下载后进行解压
之后打开vscode将完成的前端vue项目打包
打包完成后会在你的前端工程目录下生成一个dist文件夹将这个文件夹复制到nginx目录下的html中
之后打开nginx的配置文件nginx.conf 进行修改
将注释删除 后：
#user nobody;
worker_processes 1;#error_log logs/error.log;
#error_log logs/error.log notice;
#error_log logs/error.log info;#pid logs/nginx.pid;events {worker_connections 1024;
}http {include 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 logs/access.log main;sendfile on;#tcp_nopush on;#keepalive_timeout 0;keepalive_timeout 65;#gzip on;#监听localhist：8080 前端项目server {listen 80;server_name localhost;location / {# 换成自己的地址root B:/workspace/project-02/nginx-1.18.0/html/dist;index index.html index.htm;}error_page 500 502 503 504 /50x.html;location = /50x.html {# 换成自己的地址root B:/workspace/project-02/nginx-1.18.0/html}}}把root后换成自己的地址
location / {root B:/workspace/project-02/nginx-1.18.0/html/dist;index index.html index.htm;}error_page 500 502 503 504 /50x.html;location = /50x.html {root B:/workspace/project-02/nginx-1.18.0/html}之后启动nginx就可以正常的访问部署的前端项目了
注意每次更改完配置文件要执行修改重装载命令。
1. 找到nginx的安装目录，在目录上cmd进入黑窗口；
2. 启动
start nginx
3.配置文件nginx.conf修改重装载命令
nginx -s reload nginx负载均衡和反向代理
反向代理的配置方式
location /api/{proxy_pass http://localhost:8090/;}
表示以/api/开头的请求会被转发到http://localhost:8090/ 这个地址
- 匹配
/a：- 当配置为匹配
/a时，它将只匹配那些URI精确为/a的请求。 - 这意味着，如果客户端请求
/a，这个规则会被触发。 - 但是，如果客户端请求
/a/（带有末尾的斜杠），或者/a/something（带有额外的路径组件），那么这个规则不会被触发。
- 当配置为匹配
- 匹配
/a/：- 当配置为匹配
/a/时，它通常匹配以/a/开头的请求URI，但是否匹配取决于具体的服务器配置和使用的匹配类型（例如，精确匹配、前缀匹配、正则表达式匹配等）。 - 在某些上下文中，
/a/可能只匹配精确为/a/的请求，而不匹配/a或/a/something。 - 在其他上下文中，
/a/可能作为前缀匹配，意味着它会匹配所有以/a/开始的请求，如/a/,/a/b,/a/b/c等。 - 如果服务器配置使用的是精确匹配，并且没有特别的指令来处理末尾的斜杠，那么
/a/可能只会匹配/a/而不会匹配/a。
- 当配置为匹配
举个例子：
-
如果一个客户端请求
http://yourdomain.com/api/somepath，Nginx会将这个请求转发到http://localhost:8090/somepath。 -
如果
proxy_pass指令是proxy_pass http://localhost:8090;（没有末尾的斜杠），那么同样的请求http://yourdomain.com/api/somepath会被转发到http://localhost:8090/api/somepath。
反向代理的优先级
//优先级最高
location = /api/{
}
//优先级次高
location ^~/api/{
}
//优先级第三高
//使用正则表达式进行匹配//最后如果优先级一样高，写在前面的优先级高负载均衡的配置方式
http { upstream backend { server backend1.example.com; server backend2.example.com weight=2; server backend3.example.com; } server { listen 80; location / { proxy_pass http://backend; }
}
}2.将项目上线到云服务器
服务器请自己提前准备，可以购买网上的云服务器，安装操作系统为centos 7
docker 安装
详细的docker请看： Docker-CSDN博客
在这里就简单的讲一下docker的安装
1.卸载旧版
首先如果系统中已经存在旧的Docker，则先卸载：
yum remove docker \docker-client \docker-client-latest \docker-common \docker-latest \docker-latest-logrotate \docker-logrotate \docker-engine2.配置Docker的yum库
首先要安装一个yum工具
yum install -y yum-utils安装成功后，执行命令，配置Docker的yum源：
yum-config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repo3.安装Docker及其相关组件
最后，执行命令，安装Docker
yum install -y docker-ce docker-ce-cli containerd.io docker-buildx-plugin docker-compose-plugin4.启动和校验
# 启动Docker
systemctl start docker# 停止Docker
systemctl stop docker# 重启
systemctl restart docker# 设置开机自启
systemctl enable docker# 执行docker ps命令，如果不报错，说明安装启动成功
docker ps使用docker自定义java项目镜像
相将java项目打包
Dockerfile是一个用来构建Docker镜像的文本文件
内容为：
# 基础镜像
FROM openjdk:11.0-jre-buster
# 设定时区
ENV TZ=Asia/Shanghai
RUN ln -snf /usr/share/zoneinfo/$TZ /etc/localtime && echo $TZ > /etc/timezone
# 拷贝jar包
COPY interfaceGroup.jar /app.jar
# 入口
ENTRYPOINT ["java", "-jar", "/app.jar"]之后将jar包和Dockerfile移入服务器的root目录中
进入root目录，执行命令
docker build -t project-interface .输入
docker images 来检查镜像是否创建成功创建
创建容器
docker run -d --name project-interface -p 8090:8090 --network aynu project-interface注意我们的java容器以及后续的mysql容器等等，一定要在同一个网络下，这样他们才能用过容器名来进行访问（因此我们的后端项目的yml中连接mysql的url为jdbc:mysql://mysql:3306/interface）
之后执行
docker logs -f project-interface
来查看他的日志
看到spring表示运行成功。
使用docker将nginx和前端项目部署到服务器
根据我们在windows上将前端项目部署到nginx上的操作，准备好一个文件夹nginx ,
里面包含前端的打包资源和nginx.conf
将这个文件夹复制到服务器的root目录下
执行命令完成下载nginx镜像并创建nginx容器
docker run -d \--name nginx \-p 8080:8080 \-v /root/nginx/html:/usr/share/nginx/html \-v /root/nginx/nginx.conf:/etc/nginx/nginx.conf \--network aynu \
nginx输入
docker ps来检查容器是否正常运行
如果没有正常运行就输入
docker logs nginx来查看他的日志文件进行纠错
使用docker安装mysql
在服务器的root目录下创建一个文件夹mysql
其目录结构为：
conf下有一个mysql的配置文件
文件内容为
[client]
default_character_set=utf8mb4
[mysql]
default_character_set=utf8mb4
[mysqld]
character_set_server=utf8mb4
collation_server=utf8mb4_unicode_ci
init_connect='SET NAMES utf8mb4'init下有一个初始化的sql脚本，自己导出自己的sql脚本放进去即可
执行命令
docker run -d \--name mysql \-p 3306:3306 \-e TZ=Asia/Shanghai \-e MYSQL_ROOT_PASSWORD=1234 \-v /root/mysql/data:/var/lib/mysql \-v /root/mysql/conf:/etc/mysql/conf.d \-v /root/mysql/init:/docker-entrypoint-initdb.d \--network aynu\mysql:5.7.24输入
docker ps来检查容器是否正常运行
如果没有正常运行就输入
docker logs mysql
查看他的日志文件进行纠错
使用docker安装redis
docker run --name redis --network aynu -p 6379:6379 -e REDIS_PASSWORD=123456 -d redis redis-server --appendonly yes设置安全组
如果以上操作都完成了，依然访问不到，保证自己配置没有出错的前提下请按照一下步骤进行排查：
- 安全组规则：确保您的阿里云服务器安全组规则允许外部流量访问8080端口。您需要在安全组规则中添加一条入站规则，以允许来自外部的TCP流量访问该端口。（先设置8080的安全组，然后设置网卡开放8080端口）
- 防火墙设置：检查您的阿里云服务器上的防火墙设置，确保没有阻止外部访问8080端口的规则。您需要添加一条规则来允许外部访问该端口。（或者直接关闭防火墙）
这样部署就完成了。
