我們要做與微信相關的功能一定是進入api文檔來參照文檔操作[https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115]
1、首先需要先登錄微信公衆平臺進入
第一步: “公衆號設置”的“功能設置”裏填寫“JS接口安全域名”加入域名。
第二步:將“JS接口安全域名”中txt文件下載下來加入到環境的根目錄。
第二步:在“基本設置”裏面設置白名單,將當前環境域名的“IP地址或域名”設爲白名單
備註:登錄後可在“開發者中心”查看對應的接口權限->網頁授權->業務域名和JS接口安全域名。
2、在需要調用JS接口的頁面引入如下JS文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.2.0.js
3、首先需要將配置項填寫完整
wx.config({
debug: true, // 開啓調試模式,調用的所有api的返回值會在客戶端alert出來,若要查看傳入的參數,可以在pc端打開,參數信息會通過log打出,僅在pc端時纔會打印。
appId: '', // 必填,公衆號的唯一標識
timestamp: '', // 必填,生成簽名的時間戳
nonceStr: '', // 必填,生成簽名的隨機串
signature: '',// 必填,簽名
jsApiList: [] // 必填,需要使用的JS接口列表
});
此時需要注意通過接口調用時最好使用post請求,向後臺傳參發送url地址時需要encodeURIComponent編碼,URL地址最好用location.href.split(’#’)[0];以防分享時微信自動向路徑後加參數。
1,語音錄入功能
//開始錄音
wx.startRecord({
success: function() {},
cancel: function(){
$('.record-shade,.icon-wrapper').addClass('hide');
alert("用戶拒絕授權錄音");
}
});
//停止錄音
wx.stopRecord();
//播放語音
wx.playVoice({
localId: localId, // 需要播放的音頻的本地ID,由stopRecord接口獲得
success: function() {},
fail: function(res) {
alert(resizeTo);
}
});
//監聽錄音自動停止
wx.onVoiceRecordEnd({
// 錄音時間超過一分鐘沒有停止的時候會執行 complete 回調
complete: function (res) {
var localId = res.localId;
}
});
// 暫停播放語音
wx.pauseVoice({
localId: '' // 需要暫停的音頻的本地ID,由stopRecord接口獲得
});
// 停止播放語音
wx.stopVoice({
localId: '' // 需要停止的音頻的本地ID,由stopRecord接口獲得
});
// 監聽語音播放完畢
wx.onVoicePlayEnd({
success: function (res) {
var localId = res.localId; // 返回音頻的本地ID
}
});
//語音轉文字
wx.translateVoice({
localId: localId, // 需要識別的音頻的本地Id,由錄音相關接口獲得
isShowProgressTips: 1, // 默認爲1,顯示進度提示
success: function(res){
alert(res.translateResult);// 語音識別的結果
}
});
2,分享功能
分享圖標使用路徑:location.origin +’/fenxiang/images/imgUrl.jpg’完整路徑
/**
* 微信分享朋友、朋友圈操作
*/
var title = 'XXXXX';//標題
var desc = 'xxxxxxx';//分享描述
var imgUrl = location.origin +'/imgUrl.jpg';//分享圖標
getWXdata();
function getWXdata(){
$.ajax({
url:'接口?url='+encodeURIComponent(location.href.split('#')[0]),
type:'post',
success:function(data){
wx.config({
debug:false,
appId:data.appId,
timestamp:data.timestamp,
nonceStr:data.nonceStr,
signature:data.signature,
jsApiList:[
'onMenuShareTimeline','onMenuShareAppMessage'
]
})
ready();
}
})
}
function ready(){
wx.ready(function(){
//分享到朋友圈
wx.onMenuShareTimeline({
title: title, // 分享標題
link: '', // 分享鏈接,該鏈接域名或路徑必須與當前頁面對應的公衆號JS安全域名一致
imgUrl: imgUrl, // 分享圖標
success: function () {
// 用戶確認分享後執行的回調函數
},
cancel: function () {
// 用戶取消分享後執行的回調函數
}
});
//分享朋友
wx.onMenuShareAppMessage({
title: title, // 分享標題
desc: desc, // 分享描述
link: '', // 分享鏈接,該鏈接域名或路徑必須與當前頁面對應的公衆號JS安全域名一致
imgUrl: imgUrl, // 分享圖標
type: '', // 分享類型,music、video或link,不填默認爲link
dataUrl: '', // 如果type是music或video,則要提供數據鏈接,默認爲空
success: function () {
// 用戶確認分享後執行的回調函數
},
cancel: function () {
// 用戶取消分享後執行的回調函數
}
});
})
}