企业级分布式后台管理系统架构设计

Posted 2023-03-15 振洋702

首先介绍一下背景：

本次是为企业设计一个应用平台，前端使用vue实现，包含多个前端系统，包含单点登录。后台是基于spring cloud的微服务架构。数据库使用mysql。使用nginx作为前端入口。

首先从前端开始说起：

把系统拆分成多个前端应的目的，主要是因为客户的业务系统较多，且各个业务模块之间，功能相对独立。因此，为了方便开发和后期维护，把前端拆分成了多个系统。另外一个方面，作为一款产品，系统可以按不同模块组合的方式，适应多中不同行业的应用场景。

废话好多啊~~赶紧上干货：

首先需要给每个vue前端项目设置一个前缀，也就是统一路由。

路由配置代码：

export default new Router(
  mode: "history", // 去掉url中的#
  scrollBehavior: () => ( y: 0 ),
  routes: constantRoutes,
  base: "/myApp"
);

有了这个配置还不够，需要配置vue打包的路径：

在vue.config.js里加上：

publicPath: process.env.NODE_ENV === "production" ? "/myApp/" : ""

这样vue就可以直接打包了。

下面是nginx的配置：

location /myApp/
            root   html/;
            index  index.html index.htm;
           try_files $uri $uri/ /myApp/index.html;

这样就可以把多个vue项目在一个nginx上部署起来了。

后台部分未完待续。。。