低代码平台实现原理

整个可视化搭建系统分为三部分,分别是配置页(setting),视图页(view) 和 json schema。配置页生成 json schema,视图页消费 json schema

低代码平台实现原理

基本原理

通过json schema保存用户所编辑的内容并保存到数据库,渲染页面时再从数据库读取所需要的页面数据

如何使用

在开发环境 json schema 保存在数据库,要在测试环境和生产环境使用 json schema 生成页面,需要将 json schema 下载到项目中的一个特定文件夹中,当在浏览器中访问这个视图页时,会根据页面 ID 到下载好的静态文件中读取页面的 json schema,然后视图页将页面渲染出来

从静态文件中读取配置代码如下:

import("@static/jsons/tables/table_string_"+id+".json").then(fileContent=>{

console.log('配置数据:',fileContent)

})

json 文件中保存的 json schema 是一个字符串,但是在视图页渲染界面的时候需要的是一个对象,并且对象的某些字段必须是函数。为了将字符串转成需要的格式,我使用 new Function('return ’ + strConfig)() 来完成这一需求,简化代码如下:

functionparseStrConfig(jsonSchema){

returnnewFunction('return '+ jsonSchema)();

}

存在的不足

1.生产出的页面不能独立于页面搭建系统运行。要想在其他系统中使用生成的页面,必须在对应系统中使用 iframe 或者 single-spa 微前端技术引入页面搭建系统

2.页面的 json schema 没有与页面搭建系统独立。由于每创建一个页面就要该页面的 json schema 下载到页面可视化搭建系统中,这导致页面可视化搭建系统需要被频繁的发布,但是页面可视化搭建系统的业务功能相对稳定

上一篇:SQL注入中information_schema的作用


下一篇:[死磕 Spring 4/43] --- IOC 之 获取验证模型