最全面最專業的微信公眾平臺開發教程：http://www.cnblogs.com/txw1958/p/weixin-js-sdk-demo.html

比較完整的分享教程：http://www.cnblogs.com/leinov/p/5256879.html

ajax調用服務器接口：

function GetWeiXinJsapiConfig() {var url = encodeURIComponent(location.href.split('#')[0]);alert('url is ' + url);$.ajax({type: "POST",url: "/XXX/GetWeiXinJsapiConfig",data: "{'curUrl': '" + url +"'}",contentType: "application/json; charset=utf-8",dataType: "json",success: function(data) {console.log(data.d);var configData = $.parseJSON(data.d);console.log('sig is ' + configData.signature);wx.config({debug: true, // 開啟調試模式,調用的所有api的返回值會在客戶端alert出來，若要查看傳入的參數，可以在pc端打開，參數信息會通過log打出，僅在pc端時才會打印。appId: configData.appid, // 必填，公眾號的唯一標識timestamp: configData.timestamp, // 必填，生成簽名的時間戳nonceStr: configData.noncestr, // 必填，生成簽名的隨機串signature: configData.signature, // 必填，簽名，見附錄1jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage'] // 必填，需要使用的JS接口列表，所有JS接口列表見附錄2 });wx.ready(function(){alert('OK---');wx.onMenuShareAppMessage({title: shareTitle, // 分享標題desc: descContent, // 分享描述link: lineLink, // 分享鏈接imgUrl: imgUrl, // 分享圖標success: function () { // 用戶確認分享后執行的回調函數 },cancel: function () { // 用戶取消分享后執行的回調函數 }});});wx.error(function(res){// alert("err" + res); });},error: function(data) {var is_json;var json;try {var json = $.parseJSON(data.responseText);is_json = true;} catch (e) {is_json = false;}if (is_json) {// add_json_error(data, json); console.log(json.Message);} else {// Show the response text as plaintext.var status = data.status;var statusText = data.statusText;// If we've hit a 400 (Bad Request), show the responseText.if (status === 400) {statusText += ": " + data.responseText;}console.log(status + " " + statusText);}},complete: function() {}}); }

定義微信分享數據，一次定義，多處使用：

// 定義微信分享的數據 var wxData = {"appId": "", // 服務號可以填寫appId"imgUrl" : 'http://photocdn.sohu.com/20130122/Img364302298.jpg',"link" : 'http://www.baidufe.com',"desc" : '使用警告：此Api非官方版本，請各位盡量將分享功能遷移至騰訊官方版，會更穩定些！',"title" : "歡迎使用WeixinApi" };// 分享的回調 var wxCallbacks = {// 收藏操作是否觸發回調，默認是開啟的favorite : false,// 分享操作開始之前ready : function() {// 你可以在這里對分享的數據進行重組alert("準備分享");},// 分享被用戶自動取消cancel : function(resp) {// 你可以在你的頁面上給用戶一個小Tip，為什么要取消呢？alert("分享被取消，msg=" + resp.err_msg);},// 分享失敗了fail : function(resp) {// 分享失敗了，是不是可以告訴用戶：不要緊，可能是網絡問題，一會兒再試試？alert("分享失敗，msg=" + resp.err_msg);},// 分享成功confirm : function(resp) {// 分享成功了，我們是不是可以做一些分享統計呢？alert("分享成功，msg=" + resp.err_msg);},// 整個分享過程結束all : function(resp,shareTo) {// 如果你做的是一個鼓勵用戶進行分享的產品，在這里是不是可以給用戶一些反饋了？alert("分享" + (shareTo ? "到" + shareTo : "") + "結束，msg=" + resp.err_msg);} }; // 自定義分享到：微信好友、朋友圈、騰訊微博、QQ好友 WeixinApi.share(wxData,wxCallbacks);

初始化等待分享：

// 開發階段，開啟WeixinApi的調試模式 WeixinApi.enableDebugMode();// 初始化WeixinApi，等待分享 WeixinApi.ready(function(Api) {// 微信分享的數據var wxData = {"appId": "", // 服務號可以填寫appId"imgUrl" : 'http://www.baidufe.com/fe/blog/static/img/weixin-qrcode-2.jpg',"link" : 'http://www.baidufe.com',"desc" : '使用警告：此Api非官方版本，請各位盡量將分享功能遷移至騰訊官方版，會更穩定些！',"title" : "歡迎使用WeixinApi"};// 分享的回調var wxCallbacks = {// 收藏操作不執行回調，默認是開啟(true)的favorite : false,// 分享操作開始之前ready : function() {// 你可以在這里對分享的數據進行重組alert("準備分享");},// 分享被用戶自動取消cancel : function(resp) {// 你可以在你的頁面上給用戶一個小Tip，為什么要取消呢？alert("分享被取消，msg=" + resp.err_msg);},// 分享失敗了fail : function(resp) {// 分享失敗了，是不是可以告訴用戶：不要緊，可能是網絡問題，一會兒再試試？alert("分享失敗，msg=" + resp.err_msg);},// 分享成功confirm : function(resp) {// 分享成功了，我們是不是可以做一些分享統計呢？alert("分享成功，msg=" + resp.err_msg);},// 整個分享過程結束all : function(resp,shareTo) {// 如果你做的是一個鼓勵用戶進行分享的產品，在這里是不是可以給用戶一些反饋了？alert("分享" + (shareTo ? "到" + shareTo : "") + "結束，msg=" + resp.err_msg);}};// 用戶點開右上角popup菜單后，點擊分享給好友，會執行下面這個代碼 Api.shareToFriend(wxData, wxCallbacks);// 點擊分享到朋友圈，會執行下面這個代碼 Api.shareToTimeline(wxData, wxCallbacks);// 點擊分享到騰訊微博，會執行下面這個代碼 Api.shareToWeibo(wxData, wxCallbacks);// iOS上，可以直接調用這個API進行分享，一句話搞定 Api.generalShare(wxData,wxCallbacks); });

隱藏右上角option menu入口

WeixinApi.ready(function(Api) {// 隱藏 Api.hideOptionMenu();// 顯示// Api.showOptionMenu(); });

隱藏底部工具欄

WeixinApi.ready(function(Api) {// 隱藏 Api.hideToolbar();// 顯示// Api.showToolbar(); });

獲取當前的網絡類型

WeixinApi.ready(function(Api) {Api.getNetworkType(function(network){/*** network取值：** network_type:wifi wifi網絡* network_type:edge 非wifi,包含3G/2G* network_type:fail 網絡斷開連接* network_type:wwan 2g或者3g*/}); });

調起客戶端圖片播放組件

WeixinApi.ready(function(Api) {// 需要播放的圖片src listvar srcList = [src1, src2, ..., srcN];// 選一個作為當前需要展示的圖片srcvar curSrc = src1;// 調起 Api.imagePreview(curSrc, srcList); });

關掉當前微信公眾頁面窗口

WeixinApi.ready(function(Api) { // 關閉窗口 WeixinApi.closeWindow({success : function(resp){alert('關閉窗口成功！');},fail : function(resp){alert('關閉窗口失敗');}}); });

判斷當前網頁是否在微信內置瀏覽器中打開

// true or falsevar flag = WeixinApi.openInWeixin();

發送電子郵件

WeixinApi.sendEmail({subject : '郵件標題',body : '郵件正文' },function(resp){// 注意這里可不要輕易alert，會卡死的。。。 });

禁止用戶分享

// 先對Api進行初始化 WeixinApi.ready(function(Api) {// 禁止分享Api.disabledShare(function(){alert('當前頁面禁止分享！');}); });

常見問題：

用了這個API怎么沒生效

• 1）、WeixinApi.js路徑是否引用正確
• 2）、WeixinApi.ready是否正確執行了？（可以在里面加一個alert，簡單粗暴可依賴）
• 3）、開啟WeixinApi.enableDebugMode方便問題定位

想自己做一個按鈕直接分享

就我目前了解到的情況來看，是行不通的，官方都有做權限控制

?

怎樣動態修改分享的信息：wxData

用到Api提供的async:true配置

關于分享的其它方法以及注意事項，請移步這位仁兄這里，有比較詳細的答案：https://www.baidufe.com/item/f07a3be0b23b4c9606bb.html

?

?

?

總結

以上是生活随笔為你收集整理的微信JSSDK javascript 开发 代码片段，仅供参考的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。