资讯专栏INFORMATION COLUMN

前端、后端、运维都能用的动态json数据管理神器,节省你大量的开发、设计数据库、运维的时间

canopus4u / 825人阅读

摘要:基于的动态数据管理神器介绍什么是基于模块化的动态数据管理平台。什么是用于动态生成表单的,参考使用案例官方文档使用场景有哪些无论前端后端移动端运维,理论上所有需要动态配置数据的场景都可以使用。针对运维可以作为区分环境的配置中心等。

基于Json Schema的动态数据管理神器-DMS 介绍 什么是DMS?

DMS Github:基于Json Schema/UI Schema模块化的Json动态数据管理平台。

什么是Json Schema/UI Schema?

用于动态生成表单的Schema,参考 Json Schema使用案例

官方文档

使用场景有哪些?

无论前端、后端、移动端、运维,理论上所有需要动态配置数据的场景都可以使用。

针对前端、移动端:可以配置页面每个模块展示型数据,也可以配置各种版本号用于动态更新,各种功能开关、页面主题等。

针对后端:可以配置业务相关的ID,配置类目,城市列表,热门等。

针对运维:可以作为区分环境的配置中心等。

当然使用场景远不止这些......

可以运用到生产环境吗?

当然可以,DMS存储的数据读写是完全分开的,目前支持通过Redis、CDN(推荐)两种获取数据方式。即使DMS自身服务器挂掉,也不会影响数据的读取。强烈推荐使用CDN的方式,这样稳定性和使用的CDN是一样的。

DMS应用、模块、参数介绍

应用:包含一个或多个模块,包含一个或多个参数

模块:配置数据的最小单位

参数:使模块根据不同参数配置不同数据(如:每个城市展示的频道页不一样)

DMS特性

实时表单预览;

模块化(组件化)数据管理;

支持表单数据逻辑判断、数据验证;

Schema数据自动保存,防止误操作及未知异常;

支持动态增加参数,参数本身也可以为DMS生成的配置数据;

配合dms-upload可以快速将通过表单上传的文件传入CDN/云存储

符合实际场景的权限控制:开发只负责schema编写,需求方配置所有数据;

支持Schema生成所有基本表单类型及高级控件,如:日期选择器、进度条、密码框、颜色选择器等;

实时数据预览/审核(配合dms-fetch,同时支持服务端代理请求,及浏览器端请求的数据预览与审核)

快速开始

请先确保已经安装好:nodejs8+、mysql、redis,并已开启相关服务

安装DMS

> git clone https://github.com/win-winFE/dms.git
> yarn # 若没有yarn,请使用 npm install

创建日志目录

> mkdir /opt/logs/nodejs -p

执行初始化sql

使用mysql执行 dms/database/dms.sql

修改项目中mysql/redis相关配置dms/config/config.default.js(mysql默认密码为:root1234)

启动/停止/调试

启动端口默认为:7101,需要修改请修改dms/package.json文件start部分的7101

> yarn start # 启动,若没有yarn,请使用 npm run start
> yarn stop # 停止, npm run stop
> yarn dev # 调试,npm run dev

注册

进入:http://localhost:7101,将自动跳转到登录页,选择【注册】,按要求填写相关数据,注册成功将自动跳转到【应用管理】页面

新建示例应用

点击【新建应用】,新建如下应用

新建示例模块

点击“淘宝首页”的【模块列表】,点击【新建模块】

编写该模块Schema

点击“首页banner”的【编辑Schema定义】,复制如下Schema到【Schema定义】中并【保存Schema】

{
  "title": "示例",
  "description": "视频/图片展示配置示例",
  "type": "array",
  "minItems": 3,
  "items": {
    "type": "object",
    "properties": {
      "url": {
        "title": "跳转链接",
        "type": "string"
      },
      "imgs": {
        "title": "轮播图片",
        "type": "string",
        "format": "file"
      }
    } 
  }
}

添加一个参数

进入【参数列表】,添加如下参数

【编辑参数】,【提交】如下参数

编辑数据

点击左侧菜单,进入【数据管理】,进入“淘宝首页”应用的【模块列表】,选择城市后点击【进入】,再选择“首页banner”的【编辑模块数据】,此时还不能上传图片、保存数据,需要启用dms-upload

启动dms-upload

> git clone https://github.com/win-winFE/dms-upload.git
> yarn # npm install

执行初始化sql

使用mysql执行 dms-upload/database/dms-upload.sql

使用mysql执行 dms-upload/database/init.sql(用于上传时的权限验证,默认:root root1234)

修改项目中mysql/redis相关配置dms/config/config.default.js(mysql默认密码为:root1234)

配置dms-upload

启动端口(默认7100):dms-upload/package.json start部分,若修改端口。请修改 dms/app/util/constants.js dmsUploadAPI 中的请求地址前缀

数据库配置:dms-upload/config/config.defult.js

CDN文件保存目录(默认/usr/local/services/cdn/dms):dms-upload/config/config.defult.js cdnDir

CDN文件访问地址前缀(默认//127.0.0.1:5000/dms):dms-upload/config/config.defult.js cdnPrefix

新建CDN文件(图片、json数据)保存目录

> mkdir /usr/local/services/cdn/dms/data -p # 若未使用默认cdnDir,请修改data前面部分
> mkdir /usr/local/services/cdn/dms/res -p # 若未使用默认cdnDir,请修改res前面部分

启动dms-upload

> yarn start # npm run start

本地调试上传图片回显

> cd /usr/local/services/cdn
> python -m SimpleHTTPServer 5000 # python3 请使用: python3 -m http.server 5000

继续回到DMS平台编辑数据

提交下列数据

直接访问数据(用于非js使用场景)

临时数据:提交后复制成功Toast中的链接,可以直接访问临时数据数据

正式数据:将临时数据审核为正式数据,也可以通过Toast中的链接直接访问正式数据

使用dms-fetch访问数据(用于js使用场景)

1.项目中安装dms-fetch(不建议,强依赖axios,说明见Github)

> yarn add dms-fetch # npm install dms-fetch --save

2.带参数使用示例(伪代码)

import { getDMSDataByCDN } from "dms-fetch";
import ...

// 复制编辑数据页面的唯一标示,下面是React应用配合使用DMS参数的示例
export default class extends React.Component {
    ...
    fetchData = async () => {
        const { city } = getParams(this.props.location.search);
        const dmsData = await getDMSDataByCDN(`/7/10/city/${city}`, this.props.location.search);
        this.setState({
            dmsData,
        });
    };
    ...
    render() {
       ...
    }
}
更多高级用法请参考 DMS Github

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/103128.html

相关文章

  • 如烹小虾: 运维自动化闭环,腾讯是这样做

    摘要:我加入了腾讯,腾讯企业文化很好,经常会有很多小组活动部门活动什么的,但是做运维很苦。所以,年的时候我们几个腾讯的同事一同创业,希望把我们的想法和经验能够传递出来。这里我列出了腾讯互联网运维团队所经历的三个阶段。 本文是数人云深圳技术分享课上优维科技联合创始人彭鲤航的演讲实录,演讲主题是《运维自动化实践》。 精彩观点抢鲜看 实现运维自动化闭环,最主要就是配置管理、状态管理和变更管理能力。...

    RyanQ 评论0 收藏0
  • B站运维团队成长血泪史

    摘要:胡凯,运维负责人,曾经就职于金山软件金山网络猎豹移动,负责运维相关工作。胡凯在去年加入站刚刚成立的运维部,人少事多,遇到了很多坑。 胡凯,bilibili运维负责人,曾经就职于金山软件、金山网络、猎豹移动,负责运维相关工作。Bilibili是国内最大的年轻人潮流文化娱乐社区,银河系知名弹幕视频分享UGC平台。 95后二次元新人类的追捧,让以视频弹幕、UP主闻名于世的bilibili(...

    gitmilk 评论0 收藏0
  • 一个开发眼中运维

    摘要:资源包括什么内存磁盘网络文件描述符外部缓存数据库等,编程语言是如何管理资源的合理的算法架构保证了资源的合理使用,分配内存使用网络等等。 在云计算时代,开发和运维的结合变得越来越重要。在DIFF论坛第一期,前新浪SAE运维主管,郑志勇,分享了《一个开发眼中的运维》根据自己从开发人员转型运维之后的心得,谈如何把在开发上的运用抽象思维方式运用到运维领域。 showImg(http://se...

    Hanks10100 评论0 收藏0
  • 阿里巴巴1682亿背后“企业级”高效持续交付

    摘要:摘要在北京云栖大会上,阿里巴巴高级技术专家陈鑫花名神秀,给大家带来了亿背后的企业级高效持续交付,引起强烈共鸣。 摘要: 在2017北京云栖大会上,阿里巴巴高级技术专家陈鑫(花名神秀),给大家带来了《1682亿背后的企业级高效持续交付》,引起强烈共鸣。神秀从技术负责人关心的研发流程混乱、质量无法保障、环境管理低效、资源浪费等方面,结合阿里巴巴的DevOps实践,深度解析了企业级持续交付如...

    Youngs 评论0 收藏0
  • 大会实录|清华徐葳:人工智能让数据中心更好运维

    摘要:清华大学数据中心运维那点事儿我徐葳显然是个科研人员,同时还管理很多行政事务等,但有些人命不好,就是系统管理员的命。最后,数据中心现在如此复杂,怎么能再利用一些人工智能的东西放在数据中心里帮助运维。 showImg(https://segmentfault.com/img/remote/1460000012115241?w=159&h=159); 嘉宾介绍:徐葳,清华大学交叉信息研究院助...

    bergwhite 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<