宝塔部署SpringBoot、Vue项目到公网服务器,配置域名访问

宝塔环境

宝塔Linux测试版 7.8.26,正式版还没有集成SpringBoot部署

打包SpringBoot

我是多模块单启动项目所以要小配置一下,除了项目根目录的pom.xml文件和启动类模块里的pom.xml文件需要留着build配置,其他模块的pom.xml里的build都删掉

先根目录的pom.xml文件

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.6.0</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>cn.vxpay</groupId>
    <artifactId>AnRanUtils</artifactId>
    <version>0.0.1-SNAPSHOT</version>

    <packaging>pom</packaging>

    <name>AnRanUtils</name>

    <description>
        黯然工具箱
    </description>

    <properties>
        <java.version>1.8</java.version>
    </properties>

    <!-- 子模块 -->
    <modules>
        <module>ar-common</module>
        <module>ar-qrcode</module>
        <module>ar-admin</module>
    </modules>


    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-devtools</artifactId>
            <scope>runtime</scope>
            <optional>true</optional>
        </dependency>
        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <optional>true</optional>
        </dependency>

    </dependencies>

    <build>
        <plugins>
            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-compiler-plugin</artifactId>
                <version>3.1</version>
                <configuration>
                    <source>${java.version}</source>
                    <target>${java.version}</target>
                </configuration>
            </plugin>
            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-surefire-plugin</artifactId>
                <version>2.19.1</version>
                <configuration>
                    <skipTests>true</skipTests>    <!--默认关掉单元测试 -->
                </configuration>
            </plugin>
        </plugins>
    </build>

</project>

 

 

然后是启动类的模块,我的启动模块在admin里,所以再admin的pom.xml里配置一下build,指定一下全局唯一入口,配置把依赖其他两个模块都打包进jar里

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>cn.vxpay</groupId>
        <artifactId>AnRanUtils</artifactId>
        <version>0.0.1-SNAPSHOT</version>
        <relativePath>../pom.xml</relativePath>
    </parent>
    <groupId>cn.vxpay</groupId>
    <artifactId>ar-admin</artifactId>
    <name>ar-admin</name>
    <version>0.0.1-SNAPSHOT</version>
    <description>
        web启动
    </description>
    <dependencies>
        <!-- spring-boot-devtools -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-devtools</artifactId>
            <optional>true</optional> <!-- 表示依赖不会传递 -->
        </dependency>
        <!-- 公共模块 -->
        <dependency>
            <groupId>cn.vxpay</groupId>
            <artifactId>ar-common</artifactId>
            <version>0.0.1-SNAPSHOT</version>
        </dependency>
        <!-- 二维码模块 -->
        <dependency>
            <groupId>cn.vxpay</groupId>
            <artifactId>ar-qrcode</artifactId>
            <version>0.0.1-SNAPSHOT</version>
        </dependency>
    </dependencies>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <version>2.1.1.RELEASE</version>
                <configuration>
                    <fork>true</fork> <!-- 如果没有该配置,devtools不会生效 -->
                    <!-- 指定该Main Class为全局的唯一入口 -->
                    <mainClass>cn.vxpay.ArAdminApplication</mainClass>
                </configuration>
                <executions>
                    <execution>
                        <goals>
                            <!-- 可以把依赖的包都打包到生成的Jar包中 -->
                            <goal>repackage</goal>
                        </goals>
                    </execution>
                </executions>
            </plugin>
        </plugins>
    </build>

</project>

 

 

其他的两个模块不需要有build这个配置,删掉就好了。

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>cn.vxpay</groupId>
        <artifactId>AnRanUtils</artifactId>
        <version>0.0.1-SNAPSHOT</version>
        <relativePath>../pom.xml</relativePath>
    </parent>
    <groupId>cn.vxpay</groupId>
    <artifactId>ar-common</artifactId>
    <name>ar-common</name>
    <version>0.0.1-SNAPSHOT</version>
    <packaging>jar</packaging>

    <description>
        公共模块
    </description>

    <dependencies>
        <!-- fastjson -->
        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>fastjson</artifactId>
            <version>1.2.76</version>
        </dependency>
        <!-- hutool -->
        <dependency>
            <groupId>cn.hutool</groupId>
            <artifactId>hutool-all</artifactId>
            <version>5.6.7</version>
        </dependency>
    </dependencies>
</project>

 

 

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>cn.vxpay</groupId>
        <artifactId>AnRanUtils</artifactId>
        <version>0.0.1-SNAPSHOT</version>
        <relativePath>../pom.xml</relativePath>
    </parent>
    <groupId>cn.vxpay</groupId>
    <artifactId>ar-qrcode</artifactId>
    <name>ar-qrcode</name>
    <version>0.0.1-SNAPSHOT</version>
    <packaging>jar</packaging>
    <description>
        二维码模块
    </description>
    <dependencies>
        <!-- 公共模块 -->
        <dependency>
            <groupId>cn.vxpay</groupId>
            <artifactId>ar-common</artifactId>
            <version>0.0.1-SNAPSHOT</version>
        </dependency>
        <!-- 二维码 -->
        <dependency>
            <groupId>com.google.zxing</groupId>
            <artifactId>core</artifactId>
            <version>3.4.0</version>
        </dependency>
        <dependency>
            <groupId>com.google.zxing</groupId>
            <artifactId>javase</artifactId>
            <version>3.4.0</version>
        </dependency>
        <!--常用工具类 -->
        <dependency>
            <groupId>org.apache.commons</groupId>
            <artifactId>commons-lang3</artifactId>
            <version>3.9</version>
        </dependency>
    </dependencies>

</project>

 

 

然后打包,package

打包后的文件会在admin模块的那个里面

打包好之后打包vue

打包Vue

打开Vue项目,输入npm run build 就可以打包了

打包好之后会有一个dist文件夹,这个就是打包好的vue

部署Vue

宝塔添加网站,域名就是你要用使用的

然后把SpringBoot打包的jar包,和Vue打包的dist文件夹丢进这个目录里

设置这个域名访问Vue前端,网站目录设置这个dist文件夹,这就部署好前端了

部署SpringBoot

部署SpringBoot的话也是很简单,添加java项目,然后jar路径选到上传的那个jar文件,然后端口的话我设置成8000(多少都可以,默认的也行),然后提交就行

再点设置,域名管理,添加个域名,然后点外网映射,开启外网映射就可以了

这样也就部署好了后端了

访问前端

浏览器访问看看:

报错404,没有这个后端的接口,请求不到,原因是nginx没有配置反向代理

上篇文章有写配置跨域那个,就是下图这个,前端每个请求都加了一个/api的路径,现在来配置一下nginx

配置Nginx反向代理

配置nginx加一段代码,里面的两个api就是用来匹配前端请求的api前缀,proxy_pass后面的就是SpringBoot项目的域名

    location /api {
      rewrite ^.+api/?(.*)$ /$1 break;
      proxy_pass http://arapi.a0w.cn/;
    }

 

然后点保存就可以了,再通过域名访问一下前端就发现可以用了,点方格跳转也是可以的,然后里面的表单提交也是没问题的。

完成

 

 

版权声明:
作者:黯然gg
链接:https://3zi.cn/archives/616
来源:阿龙爱吃肉
文章版权归作者所有,未经允许请勿转载。

THE END
分享
二维码
< <上一篇
下一篇>>
文章目录
关闭
目 录