zoukankan      html  css  js  c++  java
  • 通过json 响应添加js function 增强业务灵活程度

    直接在服务器的response中包含js 已经是比较常见的功能了,但是从业务角度,缺少灵活性,我们需要加载时候同时解析
    基于模块快的加载机制是一个不错的选择(amd,cmd 都是不错的选择,类似的工具也很多),或者通过类型转换,比如json
    object 到claas 这样我们也就能操作业务数据了,直接在json 数据中包含js function 也是一个不错的选择(可以服务端控制逻辑,但
    是会存在大小的问题,但是我们也能解决,而且还会有一些安全的风险,但是还好,具体要看实现的技术了)

    原理

    • 参考json 格式
     
    let userids = {
        fetchid: function () {
            return Promise.resolve({
                name: "dalong1",
                age: 22
            })
         },
        fetchtext: function () { 
            return Promise.resolve({
                name: "dalong2",
                age: 33
            })
        },
        login: function () {
            return Promise.resolve({
            name: "dalong3",
            age: 44
        })}
    }
    • 说明
      此数据我们需要经过序列化给客户端,之后客户端,反序列化,然后我们就可以直接使用了
    • 反序列化之后的格式
      对于函数转换为了字符串
     
    {"fetchid":"function () {
            return Promise.resolve({
                name: "dalong1",
                age: 22
            })
         }","fetchtext":"function () { 
            return Promise.resolve({
                name: "dalong2",
                age: 33
            })
        }","login":"function () {
            return Promise.resolve({
            name: "dalong3",
            age: 44
        })}"}
     

    参考效果

    业务集成使用

    如果需要使用此代码,我们需要进行反序列化的处理,因为默认的json 反序列化的不支持的,还好社区有类似的实现

    • package.jon
     
    {
      "name": "class-transformer-learning",
      "version": "1.0.0",
      "main": "index.js",
      "license": "MIT",
      "dependencies": {
        "is-promise": "^4.0.0",
        "json-fns": "^1.0.0",
      }
    }
    • 代码
      说明:就是使用了json-fns 处理包含js的json,然后直接可以像方一样使用代码了
     
    const isPromise = require("is-promise")
    const JSON = require('json-fns')
    let userids = {
        fetchid: function () {
            return Promise.resolve({
                name: "dalong1",
                age: 22
            })
         },
        fetchtext: function () { 
            return Promise.resolve({
                name: "dalong2",
                age: 33
            })
        },
        login: function () {
            return Promise.resolve({
            name: "dalong3",
            age: 44
        })}
    }
    let info =JSON.stringify(userids)
    console.log(info)
    for (let key inJSON.parse(info)) {
        if (userids.hasOwnProperty(key)) {
            let element = userids[key];
            if (isPromise(element)) {
                element.then(data => {
                    console.log("default",data)
                }).catch(err=>{
                    console.log("fetch",err)
                })
            }
            else {
                let funcCall = element();
                if (isPromise(funcCall)) {
                    funcCall.then(data => {
                        console.log("fun call",data)
                        console.log(data)
                    }).catch(err=>{
                        console.log("default",err)
                    })
                }
            }
        }
    }
    • 运行效果

    说明

    以上是一个实践的探索,基于此模式我们可以增强业务的灵活性,对于js的处理部分,我们可以基于nodejs 的生态或者基于gravvlvm(js 能力)
    或者(golang 的gopherjs),deno(typescript 引擎,后边可能会调整)主要是很多时候我们的代码是需要编译的(js 新特性的兼容,有些语法是不能支持的)

    参考资料

    https://www.npmjs.com/package/json-fns
    https://github.com/oracle/graal
    https://github.com/gopherjs/gopherjs

  • 相关阅读:
    手把手编写PHP框架 深入了解MVC运行流程
    利用Nginx+Mono+Fastcgi代替IIS对Asp.Net进行反向代理
    用一句SQL取出第 m 条到第 n 条记录的方法
    项目管理理论与实践(6)——利用Excel制作项目文档的设计技巧
    项目管理理论与实践(7)——软件开发报价的计算方法
    Windows版Nginx启动失败之1113: No mapping for the Unicode character exists in the target multi-byte code page
    redis安装之zmalloc.h:55:2: error: #error "Newer version of jemalloc required"错误
    Vmware虚拟机设置静态IP地址
    Centos查看系统位数方法
    Invalid property 'driverClassName' of bean class [com.mchange.v2.c3p0.ComboPooledDataSource]
  • 原文地址:https://www.cnblogs.com/rongfengliang/p/13376305.html
Copyright © 2011-2022 走看看