如何做前后端分离架构?
发布于 9 个月前 作者 leyou319 2753 次浏览 来自 问答

前端新人,跪求各路大神指点迷津。

7 回复

核心:REST API + 单元测试 通常是后端(设计数据库的那个家伙)主导,前端协助设计好 API,然后并行开发,由于前后端分离了,必须保证做好单元测试(不然后果不堪设想),前端还可以借助一些 MOCK 工具(例如 RAP)来模拟真实场景测试一下。开发的时候,后端只管维护好 API(包括数据的提供),前端写好公用的模板、路由(可以借助 Node 来更好地实现)

谢谢您,很赞,膜拜

关注一下 我也新人一枚 可以有实际的案例 可以练练手 感觉光说 总觉得还是不会

@OneNewLife 如您所说,前后端框架设计的目的正是如此;不过您说的是概念或者思想,我正好在维护一个前后端的开源框架,似乎很符合作者的主题,这里就厚着脸皮自荐一下哈,欢迎指点,探讨! github地址:https://github.com/team4yf/yf-fpm-server


yf-fpm-server是一款轻量级的前后端分离框架

  • 基于koa2框架
  • 支持key + secret安全验证
  • 支持接口权限验证
  • 支持hook钩子扩展
  • 支持接口多版本同时在线

0.安装

$ npm i yf-fpm-server --save

1. 10行左右代码可以为前端提供接口

import { Fpm, Hook,Biz }  from 'yf-fpm-server';
let app = new Fpm();
let biz = new Biz('0.0.1');
biz.addSubModules('test',{
  foo:async function(args){
    return new Promise( (resolve, reject) => {
      reject({errno: -3001});
   });
  }
})
app.addBizModules(biz);
app.run();

2. run

$ node app.babel.js
http server listening on port 9991

3. 前端调用

通过post json的方式发起请求 实例数据如下:(这是dev模式,对一些鉴权参数没有开启验证,staging或者product环境切换一下即可)

{"appkey":"123123","method":"test.foo","v":"0.0.1","sign":"123123123","timestamp":"123123123","param":"{}"}

postman测试截图:

postman

4. Mock如何实现?

不借助任何工具的情况下

  • 1.可编写一个data.json的文件,通过node返回给前端

借助一些工具的话:

  • 1.可编写一个sql脚本来创建数据,通过mysql插件来返回给前端
  • 2.利用docker做一个mock数据容器。

任君挑选。


如果您对这个小框架感兴趣,欢迎探讨: qq:1794947912 weixin: yfsoftcom blog:http://blog.yunpluls.io

仰望高端玩家

你为谁架构?为后端码农,还是为产品需求本身? 当然是后者。 产品需求会分解成若干用例,每个用例都最终在一个具体页面实现。 每个用户都会牵扯到1. 什么样结构的数据 2. 如何显示这样的数据 3. 有什么样的交互 交互又要考虑数据的整理,传递,就要考虑前端如何请求,什么时候请求,数据怎么传,参数如何设计。 所以应该是产品需求驱动前端去实现用例,后台接口为前端提供数据。后台接口设计人员不仅要考虑前端数据结构的需要,还需要考虑系统效率这些隐性需求。 你为产品服务,后端为你服务,你和后端沟通来决定如何分离。

前后端分离说白了就是前后端通过api交互,api之后的事情全部前端自己负责,进而才衍生出来前端mvvm、单元测试、mock,其实都不是重点,只要前后端约定了api,就算完成了分离。

周边设施建设得依据团队情况和项目规模具体说,mvvm不是必须,但能行对简单的解决路由问题;自动化测试最好有,但也分项目,展示型项目其实也没啥好自动化测试的;mock可以自己搭建,用第三方的也可以,这个同质化挺严重的;

回到顶部