nginx下载安装上线vue+springboot项目

安装教程来源于此博客

1.删除nginx

1.先查看是否启动了 nginx 服务

ps -ef | grep nginx

2.如果启动了杀死所有的nginx

 killall nginx

3.删除nginx相关文件

   usr/local/nainx路径下的文件

4.卸载相关依赖

   yum remove nginx

 2.下载依赖

#一次安装4个插件
yum -y install gcc pcre pcre-devel zlib zlib-devel openssl openssl-devel

#一次安装如果有问题，可以试一下分开安装（上面命令执行成功了就无需执行以下命令了）
 	#安装 nginx 需要先将官网下载的源码进行编译，编译依赖 gcc 环境
yum install gcc-c++
 	#pcre是一个perl库，包括perl兼容的正则表达式库，nginx的http模块使用pcre来解析正则表达式，所以需要安装pcre库
yum install -y pcre pcre-devel
 	#zlib库提供了很多种压缩和解压缩方式nginx使用zlib对http包的内容进行gzip，所以需要安装
yum install -y zlib zlib-devel
 	#nginx 不仅支持 http 协议，还支持 https（即在ssl协议上传输http），所以需要在 Centos 安装 OpenSSL 库
yum install -y openssl openssl-devel

3.安装nginx

进入 usr/local 里面创建 nginx 文件夹，方便后期删除干净

#进入usr下的local目录
cd usr/local
#在local目录下创建 mysql 文件夹
mkdir nginx
#进入nginx目录
cd nginx

通过 wget 下载 nginx 安装包

wget https://nginx.org/download/nginx-1.21.6.tar.gz

解压 并进入解压后的目录

#解压
tar xvf nginx-1.21.6.tar.gz
#进入解压后的目录
cd nginx-1.21.6

配置（带有https模块）【需要进入解压后的目录】

./configure --prefix=/usr/local/nginx --with-http_stub_status_module --with-http_ssl_module

编译和安装【需要进入解压后的目录】

#编译
make
#安装
make install

启动、关闭 nginx 服务（在sbin目录下）

###启动服务
#需要先进入sbin目录下
cd /usr/local/nginx/sbin
#启动nginx服务
./nginx

###关闭服务
#需要先进入sbin目录下
cd /usr/local/nginx/sbin
#关闭nginx服务
./nginx -s stop

4.vue项目上线

1.在本地打包好dist文件传到服务器

2.配置nginx

查看是否一致（不一致会出现403）

ps aux | grep "nginx: worker process" | awk '{print $1}'

这样表示一致， 不一致在/usr/local/nginx/conf/nginx.conf最前面加上

然后就可以通过id地址+端口号访问vue

5.springboot项目

打包后端pow.xml配置中加上

<build>
    <plugins>
        <plugin>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-maven-plugin</artifactId>
            <!--这里写上main方法所在类的路径-->
            <configuration>
                <mainClass>com.kob.backend.BackendApplication</mainClass>
            </configuration>
            <executions>
                <execution>
                    <goals>
                        <goal>repackage</goal>
                    </goals>
                </execution>
            </executions>
        </plugin>
    </plugins>
</build>

来源于acwing

后端链接加上前缀 /api

前后端分离跨域代码

package com.home.backend.config.utils;

import org.springframework.context.annotation.Configuration;

import javax.servlet.*;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@Configuration
public class CorsConfig implements Filter {
    @Override
    public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) res;
        HttpServletRequest request = (HttpServletRequest) req;

        String origin = request.getHeader("Origin");
        if(origin!=null) {
            response.setHeader("Access-Control-Allow-Origin", origin);
        }

        String headers = request.getHeader("Access-Control-Request-Headers");
        if(headers!=null) {
            response.setHeader("Access-Control-Allow-Headers", headers);
            response.setHeader("Access-Control-Expose-Headers", headers);
        }

        response.setHeader("Access-Control-Allow-Methods", "*");
        response.setHeader("Access-Control-Max-Age", "3600");
        response.setHeader("Access-Control-Allow-Credentials", "true");

        chain.doFilter(request, response);
    }

    @Override
    public void init(FilterConfig filterConfig) {

    }

    @Override
    public void destroy() {
    }
}

 打包好的jar包传到服务器

安装 jdk

查询jdk可用版本

 　yum -y list java*
 
 　或者
 
 　yum search java | grep -i --color JDK

安装jdk1.8的命令

yum  install  -y  java-1.8.0-openjdk.x86_64

java -version查看是否安装成功

配置nginx

加上这个 地址是后端端口号

（记得重新加载nginx）

安装tmux

# centos
sudo yum install tmux
# ubuntu
sudo apt-get install tmux

 在tmux中启动 

java -jar XXXXX

启动成功到此结束！！

补充：

vue中route是需要配置重定向路由

（前端URL改成后端服务器地址！）