记录将微信小程序的API适配到W3C标准

标准化是现代化生产的基础,所有厂商公用一套标准可以大大降低生产成本。所以世界上有各种各样的标准化组织,软件或互联网行业也是一样,发展

标准化是现代化生产的基础,所有厂商公用一套标准可以大大降低生产成本。所以世界上有各种各样的标准化组织,软件或互联网行业也是一样,发展成熟的标志就是所有的厂商都遵循一套标准。

微信小程序虽然支持commonjs,却不支持npm,另外API完全是微信私有的标准。这让众多的已有模块和开发者想说爱你不容易。为了更好的复用已有模块,我开始了一个项目,用来把相同功能的API适配到标准w3c协议上。

项目地址

https://github.com/stackOverMind/WeApp-adapter

遇到问题

  • 不可能适配所有的API,微信小程序并不是浏览器环境
  • 能够适配的API也不能完美适配

具体流程

项目搭建

由于工作的需要,首先进行的是对websocket的适配。项目搭建还是使用自己比较熟悉和流行的webpack。注意到很重要的一点信息:微信小程序支持es6的class,并且微信小程序默认在 strict mode运行。所以我决定直接使用es6编写业务代码。

webpack.config.js:

module.exports = {entry:'./src/index.js',output: {filename:'weapp-adapter.js',path:'./',libraryTarget:"commonjs2", },module: {loaders: [ {test://.js$/,exclude:/(node_modules|bower_components)/,loader:'babel',// 'babel-loader' is also a valid name to reference query: {presets: ['es2015'] } } ] }};

适配websocket

所有实现尽可能遵循这篇文档 https://www.w3.org/TR/2011/WD-websockets-20110419/

首先根据IDL定义class

interface WebSocket { readonly attribute DOMString url; // ready state const unsigned short CONNECTING = 0; const unsigned short OPEN = 1; const unsigned short CLOSING = 2; const unsigned short CLOSED = 3; readonly attribute unsigned short readyState; readonly attribute unsigned long bufferedAmount; // networking attribute Function onopen; attribute Function onmessage; attribute Function onerror; attribute Function onclose; readonly attribute DOMString protocol; void send(in DOMString data); void close();};WebSocket implements EventTarget;

值得注意的是WebSocket实现 EventTarget。好在 EventTarget已经有人帮我实现了,拿来就用。

然后就是注意行为了,比如初始化的时候在什么情况下抛什么错误,状态如何改变。事件何时触发,事件中的参数如何表示等等。总体而言,适配websocket的过程还是比较简单的。

有一些东西我给回避了,比如bufferedAmount。

未登录用户
全部评论0
到底啦