一个Web应用系统前后端有两种协同方式：服务端渲染：服务端直接生成网页，浏览器获取完整网页，其中包含数据。前后端分离：浏览器获取HTML页面，然后与后端通信获取数据。两者对比，各有优缺点：数据量，相对于服务端渲染，前后端分离只传输数据，而服务端渲染会传输更大的数据数据量大于传输量。体会：相比服务端渲染，前后端分离需要多一个数据渲染过程。所以前后端分离可能会造成首屏渲染问题。耦合：前后端分离传输数据。前端只负责请求和渲染数据，数据由后端提供。服务器端渲染传输包含数据的HTML，也就是说，服务器端渲染必须做所有事情。交互控制：网页之间存在跳转交互，前后端分离，完全由前端控制。SEO：前后端分离通常采用SPA方式，对网络爬虫不友好。前后端分离的逻辑是，前端人员只关心前端页面和功能的实现，后端人员只对外提供API接口，之后与前端约定好数据格式，前后端开发人员可以各干各的，互不干扰。.前端人员只需要根据后端人员提供的API接口获取数据并展示在前端即可，而后端人员只需要将数据封装起来并根据约定的数据格式。RDS快速开发系统前后端分离介绍后端系统为标准的Thinkphp项目，前端系统为标准的Vue项目。ui目录下的内容如下：项目配置无论是下载得到的源码还是gitclone，都需要作为依赖安装。因为在前端之后分离了前端，即前端是一个独立的项目（vue项目），后端也是一个独立的项目（thinkphp项目），所以需要分别为他们的项目安装依赖.前端依赖安装//进入项目目录cduiyarninstallornpminstall后端依赖安装//进入项目目录composerinstall数据库配置首先创建数据库，假设项目数据库为my_rds://使用命令行或者数据库客户端执行以下命令CREATEDATABASEmy_rdsDEFAULTCHARACTERSETutf8mb4;导入数据库定义文件使用数据库客户端导入data.sql文件默认项目根目录下没有环境配置文件。需要创建环境配置文件：touch.env//文件内容APP_DEBUG=true[APP]DEFAULT_TIMEZONE=Asia/Shanghai[LANG]default_lang=zh-cn[DATABASE]type=mysqlhostname=127.0.0.1database=database_nameusername=usernamepassword=passwordhostport=3306charset=UTF8prefix=cd_配置文件中设置的数据库登录信息需要与实际服务器环境一致。其他配置项目根目录/config/my.php可以配置很多选项。支持配置单机登录或多机登录：multiple_login(config/my.php)支持验证码开关：verify_status(config/my.php)使用短信验证码：修改“短信网关”部分(config/my.php）使用云存储：修改“云存储”部分开发微信小程序：mini_program（config/my.php）开发微信公众号应用：official_accounts（config/my.php）开发微信支付应用：wechat_pay(config/my.php))系统维护中支持数据库备份：mysqldump(config/my.php)默认，以上选项大部分不用专门配置。本地开发注意事项：为了启用代码生成，目录ui不能重命名。命令行切换到项目目录，启动thinkphp项目：phpthinkrun命令行切换到ui目录。启动前端Vue项目：npmrunserve即可开发。无论你修改前端还是后端，都可以立即在浏览器中看到。在上面的第3步中，启动后端项目。默认监听8000端口，如果你的不是，请使用-p参数设置phpthinkrun打开ui/src/api/request.js文件：这里可以设置端口号和地址连接后端，分为开发环境和产品环境//请求URLif(process.env.NODE_ENV=='development'){axios.defaults.baseURL='http://127.0.0.1:8000/admin'}if(process.env.NODE_ENV=='production'){axios.defaults.baseURL='http://127.0.0.1:8080/admin'}服务器部署如果本地开发完成，需要部署到服务器，需要部署在服务器端。为了降低部署难度，本项目自动将前端打包文件部署到/public/目录下。熟悉thinkphp的同学就会知道，可以通过自动部署的目录来打开前端项目。比如我们需要部署到宿主机demo.test.com，按照thinkphp项目的部署方式部署后端项目。这个时候直接打开http://demo.test.com就可以打开工程了。原因是：前端项目编译目标设置：ui/vue.config.jsmodule.exports={devServer:{host:'127.0.0.1',port:3333,open:true,},outputDir:'../public/dist',assetsDir:'static',productionSourceMap:false,publicPath:'./'}默认thinkphp项目自动跳转：app/admin/controller/Index.phpclassIndex{publicfunctionindex(){returnredirect((string)url('/dist/'));}}如果需要将前后端部署到不同主机，请分别修改以上配置。[](https://blog.csdn.net/qq_3345...)
