前后端分离实践（六）—— 前端与后端在生产环境中的分离部署

前后端分离实践系列文章总目录

        前后端分离也包括部署的分离，下面来简单说一下三层应用如何进行部署。Springboot应用可以打包成一个jar包直接上传到linux服务器上启动运行。Vue应用可以借助webpack打包工具将所有资源打包成一个dist文件夹，可以将dist目录中的文件放到nginx服务器的html目录下，通过访问nginx来访问静态资源。而Node应用的部署就相对比较麻烦一点，目前没有找到比较好的方式，只能使用svn将本地项目资源上传到服务器，然后再手动npm安装对应的依赖。下面我们来看看具体如何操作。

请注意：实现三层应用的分离部署需要一些前置条件，首先我们至少需要一台Linux虚拟机，然后这个虚拟机中要有对应的Java运行环境和Nginx服务器。

1、Linux：Centos7.0以上版本最小化安装，我的IP是192.168.138.134，请确保防火墙为关闭状态（暂统一工作目录为/root，即使用cd命令前往的目录，统一安装目录为/usr/local）

2、Java运行环境：JRE8以上版本

在linux下安装jdk8可以参考：在Linux下安装JDK8

3、Nginx：安装目录/usr/local/nginx，需要gcc编译环境

在linux下安装nginx可以参考：在linux下安装使用nginx并配置反向代理

目录

一、将Springboot应用打包成jar部署到Linux并运行

1、使用java –version查看jre版本确保有java运行环境

2、在Springboot项目的根pom文件中添加启动类的配置

3、将打包的Springboot应用jar包部署到Linux工作目录中

4、使用java命令启动Springboot应用

5、浏览器访问/api/hello接口

二、使用svn将Node应用部署到Linux上

1、安装svn

2、创建svn工作目录

3、在工作目录下创建一个资源仓库fbsep-node

4、修改svn相关配置

5、添加svn测试账号和密码

6、配置用户权限

7、在资源库fbsep-node中创建一个fbsep-node工作目录

8、启动svn服务器

9、使用客户端连接svn资源库

10、查看fbsep-node资源库的工作目录

11、将svn目录fbsep-node检出到本地与fbsep-node应用建立关联

12、检出完成后修改配置将fbsep-node中的node_modules忽略

13、将fbsep-node目录中的文件提交到svn服务器上

14、在linux上将fbsep-node项目检出到工作目录

三、在linux上搭建node环境并启动fbsep-node应用

1、下载linux环境安装包

2、上传并解压到/usr/local目录

3、进入到/usr/local将其重命名

4、配置nodejs环境变量

5、查看node版本号

6、安装cnpm

7、进入到fbsep-node项目中安装相关依赖

8、修改package.json文件

9、启动node应用

10、浏览器访问node应用

四、将Vue应用打包的dist目录中的文件部署到Nginx中

1、启动nginx查看nginx进程

2、修改fbsep-vue/src目录下main.js中的请求url

3、在cmd命令窗口打包fbsep-vue应用

4、将打包的dist目录中的文件上传到nginx中的html目录中

5、浏览器访问nginx

---

一、将Springboot应用打包成jar部署到Linux并运行

1、使用java –version查看jre版本确保有java运行环境

 

2、在Springboot项目的根pom文件中添加启动类的配置

<build>
    <plugins>
        <plugin>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-maven-plugin</artifactId>
            <!--配置jar启动的main方法路径-->
            <configuration>
                <mainClass>com.mengfei.fbsepjava.FbsepJavaApplication</mainClass>
            </configuration>
            <executions>
                <execution>
                    <goals>
                        <goal>repackage</goal>
                    </goals>
                </execution>
            </executions>
        </plugin>
    </plugins>
</build>

3、将打包的Springboot应用jar包部署到Linux工作目录中

 

4、使用java命令启动Springboot应用

 

5、浏览器访问/api/hello接口

访问地址：http://192.168.138.134:8080/api/hello

请注意： 如果无法访问请检查Linux防火墙是否关闭

二、使用svn将Node应用部署到Linux上

1、安装svn

命令：[root@localhost ~]# yum install -y subversion

2、创建svn工作目录

命令：[root@localhost ~]# mkdir /usr/local/svn

3、在工作目录下创建一个资源仓库fbsep-node

进入到工作目录：[root@localhost ~]# cd /usr/local/svn

创建资源仓库：[root@localhost svn]# svnadmin create fbsep-node

4、修改svn相关配置

进入配置文件目录：[root@localhost svn]# cd fbsep-node/conf/

打开配置文件：[root@localhost conf]# vim svnserve.conf

取消匿名访问：anon-access = none

授权用户有可写权限：auth-access = write

指定用户配置文件：password-db = passwd

指定用户权限配置文件：authz-db = authz

保存退出

5、添加svn测试账号和密码