往前面追一追

• nodejs遵循commonjs规范，commonjs是为服务端设计的。
• 客户端浏览器，因为资源存在大量下载工作，commonjs并不适合，所以诞生了额 AMD(requirejs),CMD(sea.js)
• 借助一些库，还可以按照commonjs规范来开发，modjs

modejs

• 按照commonjs 规范开发，编译成define格式，require调用：

require('b.js')

define('b.js',function (n,r,t){
//dosth.
});

• require，已经加载好静态资源，通过require去调用对应的资源执行
• require.async，未加载好资源，根据需求的对应关系，loadscript去下载相应资源

9月22日凌晨，微信正式对外声明已经开始内测。虽然还没看到“小程序”的真实面纱，从各路猜测报道中还是看到了微信要做一个提供服务的平台。同时“小程序”面向开发者提供多种服务及支撑能力。很自然，我们想起了微信公众平台，以及我们自己产品”直达号“，以及蚂蚁支付开发平台，以及一系列开发者平台。

回顾

先不展开说现在都有什么平台以及各平台的优劣势。先从微信公众平台和直达号开刀。从开发者的角度来讲，需求是一样的，都是想获取丰富而简洁的api来调用，以快速实现自己的产品需求。从技术实现上来讲，其实也是类似的。H5封装一些NA端暴露出来的接口，形成H5的api，供web开发者基于某个平台快速开发。

微信有公众平台提供的api，百度有直达号提供的api，百度钱包有Agent提供的api。

微信公众平台拥有微信这样的超级app，开发者乐于用这些api快速开发符合自己需求的产品在微信中更好的扩散。也可以理解为技术得到了更好的渠道得以推广做的更好。虽然这是一个硬伤，但是看看微信公众平台提供的各种服务，其实不仅仅提供了开发api，更像是在打造一些列开发者的生态。这一点也是我们需要学习的地方。

窥探

学会自行车最好的方式就是开始骑上去，这些猜想也只是概念性的东西。
23日各种破解版本就出来了，比较有代表性质的是：
http://wxopen.notedown.cn/ API文档
https://github.com/gavinkwoe/weapp-ide-crack 破解方案

按教程安装了IDE并运行了demo，一切既熟悉又陌生。

一些共性：
开发过程有自己的模版及自定义组件，典型的一个组件如下图，js、xwml、wxss，开发过程类似于vue

通过类库封装WeixinJSBridge，对外暴漏wx，方便用户调用，不仅功能提供，UI也提供

Demo1：
写一个弹层组件

//.wxml 代码，相当于我们的html

<view class="btn-area">
      <button type="default" bindtap="modalTap">点击弹出modal</button>
      <button type="default" bindtap="modalTap2">点击弹出modal2</button>
</view>


//.js文件
Page({
  data: {
    modalHidden: true,
    modalHidden2: true
  },
  modalTap: function(e) {
    this.setData({
      modalHidden: false
    })
  },
  modalChange: function(e) {
    this.setData({
      modalHidden: true
    })
  },
  modalTap2: function(e) {
    this.setData({
      modalHidden2: false
    })
  },
  modalChange2: function(e) {
    this.setData({
      modalHidden2: true
    })
  },
})

//外层index通过自定义的方式引用
 <navigator url="component-pages/wx-modal/wx-modal" class="widget">
      <text class="widget__name">modal</text>
      <image class="widget__arrow" src="resources/arrow.png" background-size="cover" />
 </navigator>

从demo来看，开发类似于vue，DOM上绑定一些时间，只需要修改控制的参数，即可达到想要的效果。
他们从UI层面也进行了组件的封装，更贴近于微信风格而且暂时不能修改。

Demo2:
调用pay,login等能力

//pay接口DEMO暂未展示
//以login为例

//wxml
<button class="page-body-button" type="primary" bindtap="login">微信登录</button>

//js

var app = getApp()
Page({
  onLoad: function () {
    this.setData({
      hasLogin: app.globalData.hasLogin
    })
  },
  data: {},
  login: function () {
    var that = this
    wx.login({
      success: function (res) {
        app.globalData.hasLogin = true
        that.setData({
          hasLogin: true
        })
        that.update()
      }
    })
  }
})

展望

我们目前仅仅是从功能层面提供一些调用的方法，比如login,dopay等功能调用相应的NA功能。比较欠缺的是组件类的抽离，比如：弹框，按钮等这点可以继续抽离通用组件库

官方API

微信的请求方式（mmtls）

通过fiddler抓包可以看到，微信以mmtls方式发出http请求，
如：http://short.weixin.qq.com/mmtls/21a3ff59。
基于TLS1.3草案标准，设计实现安全通信协议mmtls。
下三篇文章大致了解这种请求的原理

• SSL/TLS协议运行机制的概述
• 基于TLS1.3的微信安全通信协议mmtls介绍
• 聊聊HTTPS和SSL/TLS协议

微信开发者工具

小程序基于的浏览器内核

微信小程序运行在三端：iOS、Android 和 用于调试的开发者工具
在 iOS 上，小程序的 javascript 代码是运行在 JavaScriptCore 中
在 Android 上，小程序的 javascript 代码是通过 X5 内核来解析
在 开发工具上， 小程序的 javascript 代码是运行在 nwjs（chrome内核） 中

package.nw node-webkit

node-webkit技术已经应用于很多桌面应用程序，如QQ，音乐播放器
微信开发者工具是一个开发桌面+WEB混合型应用的神器，核心是：nw.js

小程序是基于react.js的!

小程序语法转换

微信里真正运行的“小程序”

小程序开发完成之后，可以进行预览。在微信里扫码可以直接打开应用。

真正在小程序里运行的app最后编译成什么呢？因为需要上传到服务器，服务器进行应用下发，所以我们不得而知。

安卓开发者工具，提供了查看的便利，在安卓里可以清晰的看到处理头部和底部是NA的东西，页面里的都是H5，所以基本可以清楚，内部是react实现的H5页面。

看到的MVC的图

第一天 看文档

runoob

Express

node 热部署

• supervisor

FormData + Ajax

新起一个weinre端口，以免跟项目起的端口造成冲突

weinre --boundHost -all- --httpPort 8081

:active 在 IOS 无效

// 这是是让所有的触碰都具有:active
$("*").on("touchstart", function() {}, false);