微信小程序架构分析 (下)

) return

// 这是个遗留办法，根本放弃掉落了

if (data.command == 'EXEC_JSSDK') {

sdk(data)

// 直接转发 view 层消息到 service，主如果各类事宜通知

} else if (cmd == 'TO_APP_SERVICE') {

toAppService(data)

// 除了 publish 发送消息给 view 层以及控制层可以处理的逻辑（例如设置标题），

// 其它全部转发 service 处理，所有控制层的处理结不雅同一先返回 service

} else if (cmd == 'COMMAND_FROM_ASJS') {

let sdkName = data.sdkName

if (command.hasOwnProperty(sdkName)) {

command[sdkName](data)

} else {

console.warn(`Method ${sdkName} not implemented for command!`)

}

} else {

console.warn(`Command ${cmd} not recognized!`)

}

})

具体实现逻辑可以查看 src/command.js src/service.jssrc/sdk/*.js。对于 view/service 页面只需把本来 bridge.js 的window.postMessage 改为 window.top.postMessage 即可。

view 层的┞菲握逻辑由 src/view.js 以及 src/viewManage.js 实现，viewManage 实现了 navigateTo， redirectTo 以及 navigateBack 来响应 service 层经由过程名为 publish 的 command 传来的对应页面路由事宜。

header.js 和 tabbar.js 包含了基于 react 实现的 header 和 tabbar 模块(原筹划是应用 vue，然则没找到与原生 js 模块通信的 API)

sdk 目次下包含了 storage，灌音，罗盘模块，其它比较简单一些的原生底层调用我直接写在 command.js 琅绫擎了。

wept 琅绫擎 iframe 之间的通信是经由过程 message.js 模块实现的，控制页面(index.html)代码如下：

以上就是实现运行小法度榜样所需 webserver 的全部逻辑了，其实现并不复杂，重要艰苦在与懂得微信这一整套筒?方法。

小法度榜样及时运行对象 wept 的开辟已经根本完成了，你可以经由过程我的代码对小法度榜样的 web 情况实现有更周全的熟悉。下面我将介绍它的实现过程以及及时更新的道理。

实现小法度榜样及时更新

第一步：监督文件变更并通知前端

wept 应用了 chokidar 模块监督文件变更，变更后应用 WebSocket 告诉所有客户端进行更新操作。具体实现位于 lib/watcher.js 和 lib/socket.js, 发送内容是 json 格局的字符串。

前端控制层收到 WebSocket 消息后再经由过程 postMessage 接口转发消息给 view/service 层：

view.postMessage({ 
  msg: { 
    data: { 
      data: { path } 
    }, 
    eventName: 'reload' 
  }, 
  command: 'CUSTOM' 
})

view/service 层监听 reload 事宜：

WeixinJSBridge.subscribe('reload', function(data) { 
  // data 即为膳绫擎的 msg.data 
})  	
			 4/8   首页 上一页 2 3 4 5 6 7 下一页 尾页	
			

　　推荐阅读
　　CIO半月刊第十二期|打造“智慧交通”，保障城市高效、安全、智能化运行
            
            【义务编辑：谢海平 TEL：（010）68476606】

            >>>详细阅读


本文标题：微信小程序架构分析 (下)
地址：http://www.17bianji.com/lsqh/35676.html
 1/2    1