在前面的文章中有介紹到我們?cè)谖⑿舧eb開發(fā)過程中常常用到的 【微信JSSDK中Config配置】 ，但是我們?cè)谡嬲氖褂弥形覀儾粌H僅只是為了配置Config而已，而是要在我們的項(xiàng)目中真正去使用微信JS-SDK給我們帶來便捷，那么這里我們就簡(jiǎn)述如何在微信web開發(fā)中使用必要的方法！微信的JS-SDk中為我們提供的方法很多，這里我有一個(gè)簡(jiǎn)單截圖如下：
在上圖的提供的所有口中我們可以按照接口實(shí)現(xiàn)的難易程度分成兩個(gè)部分：
較易實(shí)現(xiàn)：基礎(chǔ)接口、分享接口、設(shè)備信息接口、地理位置接口、界面操作接口、微信掃一掃接口；
較難實(shí)現(xiàn)：圖像接口、音頻接口、智能接口、微信小店接口、微信卡券接口、微信支付接口；（注：這里說較難是因?yàn)樾枰蠖撕捅镜匚募浜辖涌冢@些接口后面會(huì)一篇篇文章具體詳解）
在這里我們將講述所有較易實(shí)現(xiàn)的接口的具體實(shí)現(xiàn)方法，在文章中講述過了如何配置和引入需要的js，通過這些配置之后我們就可以開始使用js的方法了！
①基礎(chǔ)接口-判斷當(dāng)前瀏覽器是否支持某些js接口
注意：
所有的JS接口只能在公眾號(hào)綁定的域名下調(diào)用，公眾號(hào)開發(fā)者需要先登錄微信公眾平臺(tái)進(jìn)入“公眾號(hào)設(shè)置”的“功能設(shè)置”里填寫“JS接口安全域名”。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
|
wx.ready(function () { //1. 判斷當(dāng)前版本是否支持指定 JS 接口，支持批量判斷，只需要將需要判斷的接口放入到j(luò)sApiList中即可 checkJsApifunction () { wx.checkJsApi({ jsApiList: [ 'getNetworkType', 'previewImage' ], success: function (res) { alert(JSON.stringify(res)); } }); }; |
②分享接口，這里包含：分享給朋友、分享到朋友圈、分享到qq、分享到微博、分享到qq空間(但是這里要提醒要注意不要有誘導(dǎo)分享等違規(guī)行為，對(duì)于誘導(dǎo)分享行為將永久回收公眾號(hào)接口權(quán)限)
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
|
// 2. 分享接口// 2.1 監(jiān)聽“分享給朋友”，按鈕點(diǎn)擊、自定義分享內(nèi)容及分享結(jié)果接口onMenuShareAppMessagefunction () {wx.onMenuShareAppMessage({ title: '菜鳥程序員成長(zhǎng)之路！', desc: '關(guān)注java平臺(tái)開發(fā)，前后端框架技術(shù)，分享前后端開發(fā)資源，服務(wù)端教程技術(shù)，菜鳥程序員！', link: 'http://www.cuiyongzhi.com/', imgUrl: 'http://res.cuiyongzhi.com/2016/03/201603201591_339.png', trigger: function (res) { // 不要嘗試在trigger中使用ajax異步請(qǐng)求修改本次分享的內(nèi)容，因?yàn)榭蛻舳朔窒聿僮魇且粋€(gè)同步操作，這時(shí)候使用ajax的回包會(huì)還沒有返回 alert('用戶點(diǎn)擊發(fā)送給朋友'); }, success: function (res) { alert('已分享'); }, cancel: function (res) { alert('已取消'); }, fail: function (res) { alert(JSON.stringify(res)); }});alert('已注冊(cè)獲取“發(fā)送給朋友”狀態(tài)事件');};// 2.2 監(jiān)聽“分享到朋友圈”按鈕點(diǎn)擊、自定義分享內(nèi)容及分享結(jié)果接口onMenuShareTimelinefunction () {wx.onMenuShareTimeline({ title: '菜鳥程序員成長(zhǎng)之路！', link: 'http://www.cuiyongzhi.com/', imgUrl: 'http://res.cuiyongzhi.com/2016/03/201603201591_339.png', trigger: function (res) { // 不要嘗試在trigger中使用ajax異步請(qǐng)求修改本次分享的內(nèi)容，因?yàn)榭蛻舳朔窒聿僮魇且粋€(gè)同步操作，這時(shí)候使用ajax的回包會(huì)還沒有返回 alert('用戶點(diǎn)擊分享到朋友圈'); }, success: function (res) { alert('已分享'); }, cancel: function (res) { alert('已取消'); }, fail: function (res) { alert(JSON.stringify(res)); }});alert('已注冊(cè)獲取“分享到朋友圈”狀態(tài)事件');};// 2.3 監(jiān)聽“分享到QQ”按鈕點(diǎn)擊、自定義分享內(nèi)容及分享結(jié)果接口onMenuShareQQfunction () {wx.onMenuShareQQ({ title: '菜鳥程序員成長(zhǎng)之路！', desc: '關(guān)注java平臺(tái)開發(fā)，前后端框架技術(shù)，分享前后端開發(fā)資源，服務(wù)端教程技術(shù)，菜鳥程序員！', link: 'http://www.cuiyongzhi.com/', imgUrl: 'http://res.cuiyongzhi.com/2016/03/201603201591_339.png', trigger: function (res) { alert('用戶點(diǎn)擊分享到QQ'); }, complete: function (res) { alert(JSON.stringify(res)); }, success: function (res) { alert('已分享'); }, cancel: function (res) { alert('已取消'); }, fail: function (res) { alert(JSON.stringify(res)); }});alert('已注冊(cè)獲取“分享到 QQ”狀態(tài)事件');};// 2.4 監(jiān)聽“分享到微博”按鈕點(diǎn)擊、自定義分享內(nèi)容及分享結(jié)果接口onMenuShareWeibofunction () {wx.onMenuShareWeibo({ title: '菜鳥程序員成長(zhǎng)之路！', desc: '關(guān)注java平臺(tái)開發(fā)，前后端框架技術(shù)，分享前后端開發(fā)資源，服務(wù)端教程技術(shù)，菜鳥程序員！', link: 'http://www.cuiyongzhi.com/', imgUrl: 'http://res.cuiyongzhi.com/2016/03/201603201591_339.png', trigger: function (res) { alert('用戶點(diǎn)擊分享到微博'); }, complete: function (res) { alert(JSON.stringify(res)); }, success: function (res) { alert('已分享'); }, cancel: function (res) { alert('已取消'); }, fail: function (res) { alert(JSON.stringify(res)); }});alert('已注冊(cè)獲取“分享到微博”狀態(tài)事件');};// 2.5 監(jiān)聽“分享到QZone”按鈕點(diǎn)擊、自定義分享內(nèi)容及分享接口onMenuShareQZonefunction () {wx.onMenuShareQZone({ title: '菜鳥程序員成長(zhǎng)之路！', desc: '關(guān)注java平臺(tái)開發(fā)，前后端框架技術(shù)，分享前后端開發(fā)資源，服務(wù)端教程技術(shù)，菜鳥程序員！', link: 'http://www.cuiyongzhi.com/', imgUrl: 'http://res.cuiyongzhi.com/2016/03/201603201591_339.png', trigger: function (res) { alert('用戶點(diǎn)擊分享到QZone'); }, complete: function (res) { alert(JSON.stringify(res)); }, success: function (res) { alert('已分享'); }, cancel: function (res) { alert('已取消'); }, fail: function (res) { alert(JSON.stringify(res)); }});alert('已注冊(cè)獲取“分享到QZone”狀態(tài)事件');}; |
③設(shè)備信息接口--這里是獲取設(shè)備網(wǎng)絡(luò)狀態(tài)，以防在頁(yè)面中存在視頻或者大流量文件播放的時(shí)候?qū)τ脩艚o出友好提示！
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
// 3 設(shè)備信息接口// 3.1 獲取當(dāng)前網(wǎng)絡(luò)狀態(tài)getNetworkTypefunction () {wx.getNetworkType({ success: function (res) { alert(res.networkType); var networkType = res.networkType; // 返回網(wǎng)絡(luò)類型2g，3g，4g，wifi if(networkType=='3g'){ alert("您好，您的網(wǎng)絡(luò)狀態(tài)是3g網(wǎng)絡(luò)，這里將播放視頻文件會(huì)產(chǎn)生大流程!"); } }, fail: function (res) { alert(JSON.stringify(res)); }});}; |
④地理位置接口，這里包含查看經(jīng)緯度對(duì)應(yīng)的地圖位置和獲取當(dāng)前位置的經(jīng)緯度，可用做地圖位置展示的第一步！
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
|
// 4 地理位置接口// 4.1 查看地理位置openLocationfunction () {wx.openLocation({ latitude: 23.099994, longitude: 113.324520, name: 'TIT 創(chuàng)意園', address: '廣州市海珠區(qū)新港中路 397 號(hào)', scale: 14, infoUrl: 'http://weixin.qq.com'});};// 4.2 獲取當(dāng)前地理位置getLocationfunction () {wx.getLocation({ success: function (res) { alert(JSON.stringify(res)); }, cancel: function (res) { alert('用戶拒絕授權(quán)獲取地理位置'); }});}; |
⑤界面操作接口，這里說的界面操作其實(shí)就是在微信瀏覽器中操作和改名的那右上角的【三個(gè)點(diǎn)】，對(duì)這里隱藏的菜單進(jìn)行操作和關(guān)閉微信瀏覽器！
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
|
// 5 界面操作接口// 5.1 隱藏右上角菜單hideOptionMenufunction () {wx.hideOptionMenu();};// 5.2 顯示右上角菜單showOptionMenufunction () {wx.showOptionMenu();};// 5.3 批量隱藏菜單項(xiàng)hideMenuItemsfunction () {wx.hideMenuItems({ menuList: [ 'menuItem:readMode', // 閱讀模式 'menuItem:share:timeline', // 分享到朋友圈 'menuItem:copyUrl' // 復(fù)制鏈接 ], success: function (res) { alert('已隱藏“閱讀模式”，“分享到朋友圈”，“復(fù)制鏈接”等按鈕'); }, fail: function (res) { alert(JSON.stringify(res)); }});};// 5.4 批量顯示菜單項(xiàng)showMenuItemsfunction () {wx.showMenuItems({ menuList: [ 'menuItem:readMode', // 閱讀模式 'menuItem:share:timeline', // 分享到朋友圈 'menuItem:copyUrl' // 復(fù)制鏈接 ], success: function (res) { alert('已顯示“閱讀模式”，“分享到朋友圈”，“復(fù)制鏈接”等按鈕'); }, fail: function (res) { alert(JSON.stringify(res)); }});};// 5.5 隱藏所有非基本菜單項(xiàng)hideAllNonBaseMenuItemfunction () {wx.hideAllNonBaseMenuItem({ success: function () { alert('已隱藏所有非基本菜單項(xiàng)'); }});};// 5.6 顯示所有被隱藏的非基本菜單項(xiàng)showAllNonBaseMenuItemfunction () {wx.showAllNonBaseMenuItem({ success: function () { alert('已顯示所有非基本菜單項(xiàng)'); }});};// 5.7 關(guān)閉當(dāng)前窗口closeWindowfunction () {wx.closeWindow();}; |
⑥微信掃一掃接口，這個(gè)接口可以在頁(yè)面調(diào)用微信的掃一掃功能，其中參數(shù)needResult可以設(shè)置掃描之后的處理方式；
|
1
2
3
4
5
6
7
8
|
// 6 微信原生接口 wx.scanQRCode({ needResult: 0, // 默認(rèn)為0，掃描結(jié)果由微信處理，1則直接返回掃描結(jié)果， scanType: ["qrCode","barCode"], // 可以指定掃二維碼還是一維碼，默認(rèn)二者都有 success: function (res) { var result = res.resultStr; // 當(dāng)needResult 為 1 時(shí)，掃碼返回的結(jié)果}}); |
那么到這里微信JS-SDK方法實(shí)現(xiàn)中的簡(jiǎn)答實(shí)現(xiàn)部分基本就講述完成了，后面將繼續(xù)為大家一篇篇帶來沒有講述的js方法實(shí)現(xiàn)，感謝你的翻閱，如有疑問可以留言一起討論！
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持服務(wù)器之家。
原文鏈接：http://www.cuiyongzhi.com/post/63.html
![java String[]字符串?dāng)?shù)組自動(dòng)排序的簡(jiǎn)單實(shí)現(xiàn)](/images/defaultpic.gif "java String[]字符串?dāng)?shù)組自動(dòng)排序的簡(jiǎn)單實(shí)現(xiàn)")
