微信公衆號（靜默受權和分享）

微信網頁受權

'https://open.weixin.qq.com/connect/oauth2/authorize?appid='+ appId +'&redirect_uri=' + redirectUri + '&response_type=code&scope=snsapi_base#wechat_redirect'

以snsapi_base爲scope發起的網頁受權，是用來獲取進入頁面的用戶的openid的，而且是靜默受權並自動跳轉到回調頁的。用戶感知的就是直接進入了回調頁

受權回調域名：在微信公衆號請求用戶網頁受權以前，開發者須要先到公衆平臺官網中的配置選項中，修改受權回調域名。用戶在網頁受權頁贊成受權給公衆號後，微信會將受權數據傳給一個回調頁面，回調頁面需在此域名下，以確保安全可靠。沙盒號回調地址支持域名和ip，正式公衆號回調地址只支持域名。

第一步：用戶贊成受權，獲取code
1）靜默受權
https://open.weixin.qq.com/connect/oauth2/authorize?appid=xxx&redirect_uri=https://xxx/%23%2FtimelineIndex?posterId=1&response_type=code&scope=snsapi_base#wechat_redirect
2）受權後重定向的回調連接地址
https://xxx/?code=0719FpQV14xO2W0FHAPV12AqQV19FpQj&state=#/timelineIndex?posterId=1
code說明：code做爲換取access_token的票據，每次用戶受權帶上的code將不同，code只能使用一次，5分鐘未被使用自動過時。

第二步：經過code換取網頁受權access_token
　　公衆號可經過接口來獲取網頁受權access_token。若是網頁受權的做用域爲snsapi_base，則本步驟中獲取到網頁受權access_token的同時，也獲取到了openid，snsapi_base式的網頁受權流程即到此爲止。
　　尤爲注意：因爲公衆號的secret和獲取到的access_token安全級別都很是高，必須只保存在服務器，不容許傳給客戶端。後續刷新access_token、經過access_token獲取用戶信息等步驟，也必須從服務器發起。

 

微信JS-SDK使用步驟
步驟一：綁定域名
步驟二：引入JS文件
步驟三：經過config接口注入權限驗證配置
簽名生成規則以下：參與簽名的字段包括noncestr（隨機字符串）, 有效的jsapi_ticket, timestamp（時間戳）, url（當前網頁的URL，不包含#及其後面部分）

const currentUrl=location.href.split('#')[0]
sdkSign({ Url:currentUrl }).then(response => {
  wx.config({
    debug: false, // 關閉調試模式,調用的全部api的返回值不會在客戶端alert出來
    appId: appId, // 必填，公衆號的惟一標識
    timestamp: response.Timestamp, // 必填，生成簽名的時間戳
    nonceStr: response.Noncestr, // 必填，生成簽名的隨機串
    signature: response.Signature,// 必填，簽名
    jsApiList: [
      'showMenuItems',
      'hideAllNonBaseMenuItem',
      'onMenuShareTimeline',
      'onMenuShareAppMessage'
    ] // 必填，須要使用的JS接口列表
  })
}).catch(error => {
  
})

步驟四：經過ready接口處理成功驗證
wx.ready(function(){
// config信息驗證後會執行ready方法，全部接口調用都必須在config接口得到結果以後，config是一個客戶端的異步操做，因此若是須要在頁面加載時就調用相關接口，則須把相關接口放在ready函數中調用來確保正確執行。對於用戶觸發時才調用的接口，則能夠直接調用，不須要放在ready函數中。
});

 

微信接口-分享等

// 一、路由跳轉處理
router.beforeEach((to, from, next) => {
    wx.ready(function(){
        wx.hideAllNonBaseMenuItem(); //隱藏全部非基礎按鈕(包含分享)，只有部分頁面能分享
    });
})
// 二、頁面分享
const shareData = {
  title: 'xxx',// 分享標題
  desc: 'xxx',// 分享描述(分享到朋友圈無該配置項)
  link: location.href,// 分享連接，該連接域名或路徑必須與當前頁面對應的公衆號JS安全域名一致
  imgUrl: 'xxx'// 分享圖標
}
this.$root.setShareInfo(shareData)
// 三、分享公共配置(分享朋友、朋友圈)
setShareInfo(shareData) {
  shareData.success = () => {// 用戶確認分享後執行的回調函數
    this.$toast('分享成功')
  }
  wx.ready(function(){
    wx.showMenuItems({
        menuList: ['menuItem:share:appMessage','menuItem:share:timeline'] // 要顯示的菜單項
    });
    wx.onMenuShareAppMessage(shareData);//分享給朋友
    wx.onMenuShareTimeline(shareData);//分享到朋友圈
  })
}