最近項目中開發的h5頁面，在微信朋友圈分享或分享給朋友的過程中，顯示的信息描述是網址，圖片無法顯示。如下，

我們(men)希望看(kan)到(dao)的效果是，

為了實現上述功能，我們需要在網站中加入動態代碼，調用微信sdk接口，獲得認證。
微信說明文檔鏈接：

第一步 對微信公眾號進行配置

登錄微信公眾平臺

//mp.weixin.qq.com/

要(yao)想使用微信分享功(gong)能(neng)，必須設置ip白名單(dan)和js接口安全域名。

IP白名單設置

在測導航找到“基本配置”菜單：

把服(fu)務器的ip地址(zhi)輸(shu)入進去即可。

JS接口安全域名

在測導(dao)航找到“公(gong)眾號設置”菜單，進(jin)入(ru)后(hou)，點擊“功(gong)能設置”：

第二步 引入微信js sdk，通過config接口注入權限驗證配置

// 引入微信的jssdk
<script src="//res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
// 或者
npm install weixin-js-sdk
 
var wx = require('weixin-js-sdk');

// 通過config接口注入權限驗證配置
<script src="//res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<script>
wx.config({
    debug: true, // 開啟調試模式,調用的所有api的返回值會在客戶端alert出來，若要查看傳入的參數，可以在pc端打開，參數信息會通過log打出，僅在pc端時才會打印。
    appId: '', // 必填，公眾號的唯一標識
    timestamp: , // 必填，生成簽名的時間戳
    nonceStr: '', // 必填，生成簽名的隨機串
    signature: '',// 必填，簽名
    jsApiList: [] // 必填，需要使用的JS接口列表，我這里用到的接口有"onMenuShareTimeline","onMenuShareAppMessage","chooseWXPay"
});
</script>

注意：這里的微信配置簽名等是由 后端程序來生成 。

微(wei)信(xin)官方jssdk文檔

其他接口請查看微信文(wen)檔。

第四步 使用接口

所有接(jie)口的(de)使用必須(xu)在：

wx.ready(function(){
    // 所有接口必須在這里寫，才會保證生效。
});