1. 程式人生 > >微信JS-SDK介面呼叫及填坑攻略

微信JS-SDK介面呼叫及填坑攻略

/**
 * 微信公眾平臺開發文件
 * 配置安全域名
 * 文件連結
 * 引入微信jssdk文件
 * 獲取簽名(後臺配合返回前臺config)
 * 通過ready介面處理成功驗證 (所有介面呼叫都必須在config介面獲得結果之後)
 * 調取相應的介面
 * 

 * */

1.先配置安全域名,具體操作見文件

3.通過config介面注入許可權驗證配置(配置需要的值需要向後臺打請求返回)

wx.config({
        debug: true,     // 開啟除錯模式(true),呼叫的所有api的返回值會在客戶端alert出來,若要檢視傳入的引數,可以在pc端開啟,引數資訊會通過log打出,僅在pc端時才會列印。
        appId: '',       // 必填,公眾號的唯一標識
	timestamp: '',     // 必填,生成簽名的時間戳
	nonceStr: '',     // 必填,生成簽名的隨機串
	signature: ''      // 必填,簽名
	jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage'],     // 必填,需要使用的JS介面列表(比如分享到微信,分享到朋友圈)
});

4.通過ready介面處理成功驗證

wx.ready(function(){
    // config資訊驗證後會執行ready方法,所有介面呼叫都必須在config介面獲得結果之後,config是一個客戶端的非同步操作,所以如果需要在頁面載入時就呼叫相關介面,則須把相關介面放在ready函式中呼叫來確保正確執行。對於使用者觸發時才呼叫的介面,則可以直接呼叫,不需要放在ready函式中。
});

5.通過error介面處理config失敗驗證

wx.error(function(res){
    // config資訊驗證失敗會執行error函式,如簽名過期導致驗證失敗,具體錯誤資訊可以開啟config的debug模式檢視,也可以在返回的res引數中檢視,對於SPA可以在這裡更新簽名。
});

以上就是微信官方文件給出的分享的具體操作步驟,下面是檔案中具體放置位置:注意:開發的時候最好把底下的debug設定為true,在移動端測試的時候有錯誤會alert出來,很方便

//下面是請求配置成功以後的操作

wx.config({
	debug: false,     // 開啟除錯模式,呼叫的所有api的返回值會在客戶端alert出來,若要檢視傳入的引數,可以在pc端開啟,引數資訊會通過log打出,僅在pc端時才會列印。
	appId: '',     // 必填,公眾號的唯一標識
	timestamp: '' ,     // 必填,生成簽名的時間戳
	nonceStr: '',     // 必填,生成簽名的隨機串
	signature: '',    // 必填,簽名
	jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ'],     // 必填,需要使用的JS介面列表(這裡列出的是常用的分享介面,微信,朋友圈,qq)
});
wx.ready(function(res){       //config資訊驗證後會執行ready方法,所有介面呼叫都必須在config介面獲得結果之後
	wx.onMenuShareTimeline({   //分享到朋友圈
	    title: '',      // 分享標題
	    link: , '',     // 或路徑分享連結,該連結域名必須與當前頁面對應的公眾號JS安全域名一致
	    imgUrl: '',     // 分享圖示
	    success: function () {
	        // 使用者確認分享後執行的回撥函式
            },
	    cancel: function () {
	        // 使用者取消分享後執行的回撥函式
	    }
	});
	wx.onMenuShareAppMessage({   //分享到微信好友
		//具體配置看文件
	});
	wx.onMenuShareQQ({      //分享到QQ
					
	});
});
wx.error(function(res){
    //config驗證失敗會執行的方法
});
wx.config({ debug: false, // 開啟除錯模式,呼叫的所有api的返回值會在客戶端alert出來,若要檢視傳入的引數,可以在pc端開啟,引數資訊會通過log打出,僅在pc端時才會列印。 appId: '', // 必填,公眾號的唯一標識 timestamp: '' , // 必填,生成簽名的時間戳 nonceStr: '', // 必填,生成簽名的隨機串 signature: '', // 必填,簽名 jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ'], // 必填,需要使用的JS介面列表(這裡列出的是常用的分享介面,微信,朋友圈,qq) }); wx.ready(function(res){ //config資訊驗證後會執行ready方法,所有介面呼叫都必須在config介面獲得結果之後 wx.onMenuShareTimeline({ //分享到朋友圈     title: '', // 分享標題     link: , '', // 或路徑分享連結,該連結域名必須與當前頁面對應的公眾號JS安全域名一致     imgUrl: '', // 分享圖示     success: function () {         // 使用者確認分享後執行的回撥函式             },     cancel: function () {         // 使用者取消分享後執行的回撥函式     } }); wx.onMenuShareAppMessage({ //分享到微信好友 //具體配置看文件 }); wx.onMenuShareQQ({ //分享到QQ }); }); wx.error(function(res){     //config驗證失敗會執行的方法 });

坑點:

①分享失敗

解決:最好分享當前頁面連結,該連結域名必須與當前頁面對應的公眾號js安全域名一致

②分享訊息圖示不顯示

解決:分享的圖示連結,應該寫域名下的絕對路徑(不然顯示不出來)

需要QQ分享的看這裡:QQ分享

最近剛接觸,記錄不到的地方,還請提出~~~

相關推薦

JS-SDK介面呼叫

/**  * 微信公眾平臺開發文件  * 配置安全域名  * 文件連結  * 引入微信jssdk文件  * 獲取簽名(後臺配合返回前臺config)  * 通過ready介面處理成功驗證 (所有介面呼叫都必須在config介面獲得結果之後)  * 調取相應的介面  *   

js-sdk 介面操作介面使用

前提已經在wx.config()中獲取到介面的許可權,以官方文件為準 說明: 1.目前提供的介面操作介面和使用都比較簡單 2.有些好像還有點重複 3.“調整字型”、“投訴”這兩個測試的時候無法隱藏,屬於基礎類 一、關閉微信瀏覽器視窗 wx.closeWindow() win

官方教程:教你用好JS-SDK介面

  1、分享類介面:支援獲取“分享到朋友圈”、“傳送給朋友”、“分享到QQ”和“分享到微博”按鈕的使用者點選狀態,同時支援自定義分享內容。 2、影象類介面:支援拍照,並從手機相簿選擇、上

呼叫JS-SDK上傳圖片爬之路

最近最用 vue 開發微信服務號 ,也是第一次呼叫微信的sdk , ( 先吐槽下自己 斷斷續續的整理一個星期才搞出來 ) 日了狗了 ,坑太多 , 更多是 ios 不相容 ,圖片不顯示呀 , 不能上傳多張啦 這裡就可以幫你解決 ! 廢話不多說 直接上程式碼

小程式:web-view巢狀H5實現支付功能解決方案

最近一個多月加班比較嚴重,偶爾休息一天也是在補睡眠+陪家人,比較長時間沒有來進行總結記錄了。今天不加班,開始為這段時間做的東西進行下經驗總結。 這段時間因為公司需要,接觸了一些.Net前後臺開發,慢慢了解了一些WCF、H5站點、WebService、Soap、Linq等,也

JS-SDK選擇圖片遇到的

微信JS-SDK選擇圖片遇到的坑 有個需求要在微信企業號裡面做開發,有個功能是選擇圖片,使用input標籤肯定是不管用了,Android手機上不能多選,所以使用了微信的JS-SDK提供的相關API,這個地方真的是有坑,記錄一下。按照文件直接引入js檔案即可,如果使用的是Vue,也可以使用weixin-js-

公眾號介面呼叫JS-SDK(vue專案,以掃一掃為例)

該方法需引入微信js-sdk ,先npm安裝 //在一個地方呼叫this.weixin()方法,比如說按鈕 //寫掃一掃方法 weixin() { var that = this; var url=''; var params =

JS-SDK呼叫介面方法說明

概述 微信JS-SDK是微信公眾平臺面向網頁開發者提供的基於微信內的網頁開發工具包。 通過使用微信JS-SDK,網頁開發者可藉助微信高效地使用拍照、選圖、語音、位置等手機系統的能力,同時可以直接使用微信分享、掃一掃、卡券、支付等微信特有的能力,為微信

呼叫JS-SDK自定義分享以及其他介面

package com.zzx.Weixin.Util.action; import java.io.IOException; import java.security.MessageDigest; import java.util.UUID; import javax.servlet.http.Http

關於JS-SDK 分享介面的兩個報錯記錄

一、前提: 微信測試號,用微信開發者工具測試 二、簡單複述文件: 1、引入JS檔案 在需要呼叫JS介面的頁面引入如下JS檔案,(支援https):http://res.wx.qq.com/open/js/jweixin-1.4.0.js 如需進一步提升服務穩定性,當上述資源不可訪問時,可改訪問:ht

JAVA實現呼叫js-sdk掃一掃

喜歡的朋友可以關注下。 已經很久沒有給大家分享一片技術文章了,今天抽了點時間來,給大家說一說如何呼叫微信提供的掃一掃介面。 前提: 需要申請一個公眾號:申請公眾號需要的資料我就不說了,去申請微信會提示需要哪些。 準備appid(公眾號的id) AppSecret (

js-sdk 上傳圖片、下載圖片介面

前提已經在wx.config()中,將圖片介面驗證通過。 微信js-sdk 中上傳圖片介面(uploadImage)和下載圖片介面(downloadImage)都是針對微信伺服器本身的。以官方文件為準 注: 1.使用chooseImage介面獲取到微信客戶端圖片地址的與都是

JS-SDK之影象介面開發詳解

由於現在手頭的專案中有一個上傳證件照認證的功能(手機端),之前的思路是直接點選上傳,然後直接將圖片上傳到伺服器去,這篇文章有講到( http://www.cnblogs.com/it-cen/p/4535219.html ),但在微信裡開啟網頁去上傳,速度並不快,而且,假如我上傳一張2M大的圖片,也沒

JS-SDK 分享介面開發(介紹版)

本文主要是分享自己的開發過程,希望能給部分存在同樣問題的朋友一點點幫助;最近專案中的網頁通過微信分享朋友或朋友圈等功能出現了無法顯示分享圖片等資訊,後經過排查發現是微信版本升級導致,採用js-sdk完成分享介面,為了快速實現該功能效果,於是我打算通過前臺js進行實現來看看分享

JS-SDK影象介面的具體實現

影象選擇、上傳、預覽、下載 首先就是通過config介面注入許可權驗證配置這個就不多說了,通過百度大家基本上都可以自行解決。 影象選擇 wx.chooseImage({ count: 1, // 預設9,這個是可以選擇圖片的數量 siz

開發(2):js sdk分享朋友圈,朋友,獲取config介面注入許可權驗證(java)

進行微信開發已經一陣子了,從最初的什麼也不懂,到微信授權登入,分享,更改底部選單,素材管理,等。 今天記錄一下微信jssdk 的分享給朋友的功能,獲取config介面注入。 官方文件走一下 簡單說:四步走 1.繫結域名 (注意:設定js安全域名的時候,需

JS SDK實現分享到朋友圈和分享給朋友的功能(服務端介面開發)

前端呼叫的介面(getInfo.php)如下,通過該介面可以獲取所需的校驗欄位。 <?php require_once "jssdk.php"; $url=isset($_GET['url'])

企業JS-SDK開發(一)------通過config介面注入許可權驗證配置

企業微信JS-SDK是企業微信面向網頁開發者提供的基於企業微信內的網頁開發工具包。通過js-sdk可以在企業微信內實現眾多功能,如調出通訊錄、調出攝像頭、隱藏部分按鈕等。使用js-sdk分為三步:1.開發頁面引入JS檔案html頁面加入<script src="//re

公眾號H5開發呼叫 js-sdk 的那些事

需求 如果你在開發微信H5頁面,並且需要呼叫微信的js介面,特意總結了一下呼叫的過程 步驟  一,繫結安全域名 登入微信公眾平臺進入“公眾號設定”的“功能設定”裡填寫“JS介面安全域名” 注意:    1.  需要從公眾號管理平臺中下載校驗憑證txt文字內容,然後上傳

js-sdk+JAVA實現分享介面

1、獲取公眾號appid和secret       登入微信公眾平臺-基本配置 2、配置JS安全域名       公眾號設定-功能設定       注意:MP_verify_0MVuWBvVPoPJOmPF.txt伺服器不能攔截 3、IP白名單配置       開