親們，訂閱號出來已經很久了，作為一個前端工程師或者全棧工程師，你是不是錯過了什么？
大概許多攻城獅同硯還沒有反應過來訂閱號怎么回事，就馬上要被微信的應用號秀一臉了。在應用號還沒有正式出來之前，我們趕緊一起來看看怎樣給自己的訂閱號加個網頁功效吧。
一、訂閱號網頁與平凡的HTML5網頁的區別
可能會有很多同學還沒有弄清楚普通的HTML網頁與訂閱號網頁的差別，我在這里簡朴的說明一下。
- 訂閱號的網頁就是微信的網頁，普通的網頁是W3C范例下的網頁。
- 訂閱號的網頁通常是以遵守W3C的網頁規范為前提的，但是也有可能有所差異，具體要憑據微信瀏覽器的解析本領而定，但是通常是支持大部分的W3C標准的。一定程度上W3C規范的網頁作為訂閱號的網頁是沒有題目的。
- 訂閱號網頁必要微信的認證。在認證后通常可以得到比普通的W3C網頁更多的能力。比如掃描二維碼，微信支付，拍照片，錄音，WIFI設備等能力。
以是訂閱號網頁具備比普通的W3C網頁更強的終端能力，可以更好的提供移動端的服務，對付很多個人與公司來說都是值得嘗試的。
二、開辟訂閱號網頁需要那些技能？
在了解了訂閱號網頁與普通網頁的差別后，我們根本上知道了開發訂閱號所需要的基本的技術。
- HTML + CSS + JS的前端技術
- 服務器技術
- 微信開發是所用到的SDK技術
由於1,2都是通用技術，所以我不在這里具體介紹了。我們現在重要介紹一下微信開發所需要的SDK技術。
三、訂閱號開發的微信技術
訂閱號開發所需要的純微信上的技術預備如下：
- 大眾號配置信息
包括app id, app secret - 服務器驗證哀求接口
即需要有一個接口可以與微信服務器對接，用於處置懲罰微信服務器返回的消息 - 一個引入了JSSDK的微信頁面
公共號配置信息
公共號配置信息需要登錄
獲取，關於如何注冊微信個人訂閱號的問題請查看微信相關幫助。不在這里贅述了。
配置信息所在的位置是：開發=》基本配置
在開發者ID欄目里有兩個東西
- AppID(應用ID)
- AppSecret(應用密鑰)
AppID是固定不變的，AppSecret是可以變革的。secret最好定期變化，以防止泄漏造成寧靜問題。
一個存案的服務器域名
域名備案是中國特色，所以大家需要好好享受這個特色。我就不在這里詳細介紹了。
有了域名后，將域名填入：
設置 =》 公眾號設置 =》 功能設置 =》 JS接口安全域名
然后填入你想放的域名即可。
准備一個JSSDK的微信頁面
准備微信頁面是我們這次的重點。在這里會涉及到所有關於微信頁面的制作的業務邏輯。我們將會分解每個步驟，詳細解說原理與操作。
由於正式上線公共帳號需要備案的域名，所以對於大部分人來說照舊有點不方便。所以在這里我主要講解如何開發與測試訂閱號微信頁面，然后將這個過程復制到已經備案的域名所對應的服務器上即可。
第一步是制作JSSDK的HTML頁面
1. 首先是一個最簡單的包含有JSSDK的HTML代碼：
2. 然后添加JS初始代碼
為了代碼的簡潔，我們引入了jquery.
然后添加初始化jssdk的代碼
效果如下 ：
對於配置JSSDK來說，最重要的是需要在服務器端提供一個配置參數，這個可以參考node-weixin的參數配置接口。如許前端只需要將當前的URL轉入就可以完成整個JSSDK的參數的匹配。
獲得配置信息后只要將接口權限配置一下就可以完成整個JSSDK的配置了。
3. 調用JSSDK的接口API
JSSDK的接口API有很多，我們可以通過一個簡單的掃描調用來驗證我們的代碼的正確性。
首先我們要添加一個可以點擊的HTML元素：
然后我們將wx.ready里的回調函數舉行重寫：
這樣我們在這個class為qrcode的HTML元素上點擊后就可以調用二維碼掃描功能了。
圖片如下：
利用WeTop進行微信網頁
上面的過程我們沒有討論到服務器，是因為我們使用了wetop，wetop已經幫你將所有的服務器測試環境配置好了。所以你完全不用自己開發服務器就可以進行微信的前端開發了。使用WeTop的方法非常簡單。
- 在配置 =》 公共號參數配置 =》 app 將所有的參數配置完成
- 在接口 => AccessToken獲取測試 測試能否正確的獲取token
- 在接口 => jssdk 頁面測試 里測試
- 通過指定模板地址，就可以將自己的網頁放到手機服務器上進行測試了。JSSDK測試的默認地址是jssdk.html。
WeTop支持(Windows, Linux, Mac OS三種桌面OS），可以到
進行下載
或者
google搜索node-weixin-desktop找到源碼，自行進行編譯。