This article shares the js WeChat sharing implementation code for your reference. The specific content is as follows
WeChat sharing Js API
Function:
1. Share to WeChat Moments
2 , Share to WeChat friends
3, Share to Tencent Weibo
4, Hide/show the menu entry in the upper right corner
5, Hide/show the bottom browser toolbar
6, Get the current network Status
7. Call up the picture playback component of the WeChat client
8. Close the public platform Web page
/**!
* 微信內(nèi)置瀏覽器的Javascript API，功能包括：
*
* 1、分享到微信朋友圈
* 2、分享給微信好友
* 3、分享到騰訊微博
* 4、隱藏/顯示右上角的菜單入口
* 5、隱藏/顯示底部瀏覽器工具欄
* 6、獲取當(dāng)前的網(wǎng)絡(luò)狀態(tài)
* 7、調(diào)起微信客戶端的圖片播放組件
* 8、關(guān)閉公眾平臺(tái)Web頁面
*
* @author zhaoxianlie
*/
var WeixinApi = (function () {
"use strict";
/**
* 分享到微信朋友圈
* @param {Object} data 待分享的信息
* @p-config {String} appId 公眾平臺(tái)的appId（服務(wù)號(hào)可用）
* @p-config {String} imageUrl 圖片地址
* @p-config {String} link 鏈接地址
* @p-config {String} desc 描述
* @p-config {String} title 分享的標(biāo)題
*
* @param {Object} callbacks 相關(guān)回調(diào)方法
* @p-config {Boolean} async ready方法是否需要異步執(zhí)行，默認(rèn)false
* @p-config {Function} ready(argv) 就緒狀態(tài)
* @p-config {Function} dataLoaded(data) 數(shù)據(jù)加載完成后調(diào)用，async為true時(shí)有用，也可以為空
* @p-config {Function} cancel(resp) 取消
* @p-config {Function} fail(resp) 失敗
* @p-config {Function} confirm(resp) 成功
* @p-config {Function} all(resp) 無論成功失敗都會(huì)執(zhí)行的回調(diào)
*/
function weixinShareTimeline(data, callbacks) {
callbacks = callbacks || {};
var shareTimeline = function (theData) {
WeixinJSBridge.invoke('shareTimeline', {
"appid":theData.appId ? theData.appId : '',
"img_url":theData.imgUrl,
"link":theData.link,
"desc":theData.title,
"title":theData.desc, // 注意這里要分享出去的內(nèi)容是desc
"img_width":"120",
"img_height":"120"
}, function (resp) {
switch (resp.err_msg) {
// share_timeline:cancel 用戶取消
case 'share_timeline:cancel':
callbacks.cancel && callbacks.cancel(resp);
break;
// share_timeline:fail 發(fā)送失敗
case 'share_timeline:fail':
callbacks.fail && callbacks.fail(resp);
break;
// share_timeline:confirm 發(fā)送成功
case 'share_timeline:confirm':
case 'share_timeline:ok':
callbacks.confirm && callbacks.confirm(resp);
break;
}
// 無論成功失敗都會(huì)執(zhí)行的回調(diào)
callbacks.all && callbacks.all(resp);
});
};
WeixinJSBridge.on('menu:share:timeline', function (argv) {
if (callbacks.async && callbacks.ready) {
window["_wx_loadedCb_"] = callbacks.dataLoaded || new Function();
if(window["_wx_loadedCb_"].toString().indexOf("_wx_loadedCb_") > 0) {
window["_wx_loadedCb_"] = new Function();
}
callbacks.dataLoaded = function (newData) {
window["_wx_loadedCb_"](newData);
shareTimeline(newData);
};
// 然后就緒
callbacks.ready && callbacks.ready(argv);
} else {
// 就緒狀態(tài)
callbacks.ready && callbacks.ready(argv);
shareTimeline(data);
}
});
}
/**
* 發(fā)送給微信上的好友
* @param {Object} data 待分享的信息
* @p-config {String} appId 公眾平臺(tái)的appId（服務(wù)號(hào)可用）
* @p-config {String} imageUrl 圖片地址
* @p-config {String} link 鏈接地址
* @p-config {String} desc 描述
* @p-config {String} title 分享的標(biāo)題
*
* @param {Object} callbacks 相關(guān)回調(diào)方法
* @p-config {Boolean} async ready方法是否需要異步執(zhí)行，默認(rèn)false
* @p-config {Function} ready(argv) 就緒狀態(tài)
* @p-config {Function} dataLoaded(data) 數(shù)據(jù)加載完成后調(diào)用，async為true時(shí)有用，也可以為空
* @p-config {Function} cancel(resp) 取消
* @p-config {Function} fail(resp) 失敗
* @p-config {Function} confirm(resp) 成功
* @p-config {Function} all(resp) 無論成功失敗都會(huì)執(zhí)行的回調(diào)
*/
function weixinSendAppMessage(data, callbacks) {
callbacks = callbacks || {};
var sendAppMessage = function (theData) {
WeixinJSBridge.invoke('sendAppMessage', {
"appid":theData.appId ? theData.appId : '',
"img_url":theData.imgUrl,
"link":theData.link,
"desc":theData.desc,
"title":theData.title,
"img_width":"120",
"img_height":"120"
}, function (resp) {
switch (resp.err_msg) {
// send_app_msg:cancel 用戶取消
case 'send_app_msg:cancel':
callbacks.cancel && callbacks.cancel(resp);
break;
// send_app_msg:fail 發(fā)送失敗
case 'send_app_msg:fail':
callbacks.fail && callbacks.fail(resp);
break;
// send_app_msg:confirm 發(fā)送成功
case 'send_app_msg:confirm':
case 'send_app_msg:ok':
callbacks.confirm && callbacks.confirm(resp);
break;
}
// 無論成功失敗都會(huì)執(zhí)行的回調(diào)
callbacks.all && callbacks.all(resp);
});
};
WeixinJSBridge.on('menu:share:appmessage', function (argv) {
if (callbacks.async && callbacks.ready) {
window["_wx_loadedCb_"] = callbacks.dataLoaded || new Function();
if(window["_wx_loadedCb_"].toString().indexOf("_wx_loadedCb_") > 0) {
window["_wx_loadedCb_"] = new Function();
}
callbacks.dataLoaded = function (newData) {
window["_wx_loadedCb_"](newData);
sendAppMessage(newData);
};
// 然后就緒
callbacks.ready && callbacks.ready(argv);
} else {
// 就緒狀態(tài)
callbacks.ready && callbacks.ready(argv);
sendAppMessage(data);
}
});
}
/**
* 分享到騰訊微博
* @param {Object} data 待分享的信息
* @p-config {String} link 鏈接地址
* @p-config {String} desc 描述
*
* @param {Object} callbacks 相關(guān)回調(diào)方法
* @p-config {Boolean} async ready方法是否需要異步執(zhí)行，默認(rèn)false
* @p-config {Function} ready(argv) 就緒狀態(tài)
* @p-config {Function} dataLoaded(data) 數(shù)據(jù)加載完成后調(diào)用，async為true時(shí)有用，也可以為空
* @p-config {Function} cancel(resp) 取消
* @p-config {Function} fail(resp) 失敗
* @p-config {Function} confirm(resp) 成功
* @p-config {Function} all(resp) 無論成功失敗都會(huì)執(zhí)行的回調(diào)
*/
function weixinShareWeibo(data, callbacks) {
callbacks = callbacks || {};
var shareWeibo = function (theData) {
WeixinJSBridge.invoke('shareWeibo', {
"content":theData.desc,
"url":theData.link
}, function (resp) {
switch (resp.err_msg) {
// share_weibo:cancel 用戶取消
case 'share_weibo:cancel':
callbacks.cancel && callbacks.cancel(resp);
break;
// share_weibo:fail 發(fā)送失敗
case 'share_weibo:fail':
callbacks.fail && callbacks.fail(resp);
break;
// share_weibo:confirm 發(fā)送成功
case 'share_weibo:confirm':
case 'share_weibo:ok':
callbacks.confirm && callbacks.confirm(resp);
break;
}
// 無論成功失敗都會(huì)執(zhí)行的回調(diào)
callbacks.all && callbacks.all(resp);
});
};
WeixinJSBridge.on('menu:share:weibo', function (argv) {
if (callbacks.async && callbacks.ready) {
window["_wx_loadedCb_"] = callbacks.dataLoaded || new Function();
if(window["_wx_loadedCb_"].toString().indexOf("_wx_loadedCb_") > 0) {
window["_wx_loadedCb_"] = new Function();
}
callbacks.dataLoaded = function (newData) {
window["_wx_loadedCb_"](newData);
shareWeibo(newData);
};
// 然后就緒
callbacks.ready && callbacks.ready(argv);
} else {
// 就緒狀態(tài)
callbacks.ready && callbacks.ready(argv);
shareWeibo(data);
}
});
}
/**
* 調(diào)起微信Native的圖片播放組件。
* 這里必須對(duì)參數(shù)進(jìn)行強(qiáng)檢測(cè)，如果參數(shù)不合法，直接會(huì)導(dǎo)致微信客戶端crash
*
* @param {String} curSrc 當(dāng)前播放的圖片地址
* @param {Array} srcList 圖片地址列表
*/
function imagePreview(curSrc,srcList) {
if(!curSrc || !srcList || srcList.length == 0) {
return;
}
WeixinJSBridge.invoke('imagePreview', {
'current' : curSrc,
'urls' : srcList
});
}
/**
* 顯示網(wǎng)頁右上角的按鈕
*/
function showOptionMenu() {
WeixinJSBridge.call('showOptionMenu');
}
/**
* 隱藏網(wǎng)頁右上角的按鈕
*/
function hideOptionMenu() {
WeixinJSBridge.call('hideOptionMenu');
}
/**
* 顯示底部工具欄
*/
function showToolbar() {
WeixinJSBridge.call('showToolbar');
}
/**
* 隱藏底部工具欄
*/
function hideToolbar() {
WeixinJSBridge.call('hideToolbar');
}
/**
* 返回如下幾種類型：
*
* network_type:wifi wifi網(wǎng)絡(luò)
* network_type:edge 非wifi,包含3G/2G
* network_type:fail 網(wǎng)絡(luò)斷開連接
* network_type:wwan 2g或者3g
*
* 使用方法：
* WeixinApi.getNetworkType(function(networkType){
*
* });
*
* @param callback
*/
function getNetworkType(callback) {
if (callback && typeof callback == 'function') {
WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
// 在這里拿到e.err_msg，這里面就包含了所有的網(wǎng)絡(luò)類型
callback(e.err_msg);
});
}
}
/**
* 關(guān)閉當(dāng)前微信公眾平臺(tái)頁面
*/
function closeWindow() {
WeixinJSBridge.call("closeWindow");
}
/**
* 當(dāng)頁面加載完畢后執(zhí)行，使用方法：
* WeixinApi.ready(function(Api){
* // 從這里只用Api即是WeixinApi
* });
* @param readyCallback
*/
function wxJsBridgeReady(readyCallback) {
if (readyCallback && typeof readyCallback == 'function') {
var Api = this;
var wxReadyFunc = function () {
readyCallback(Api);
};
if (typeof window.WeixinJSBridge == "undefined"){
if (document.addEventListener) {
document.addEventListener('WeixinJSBridgeReady', wxReadyFunc, false);
} else if (document.attachEvent) {
document.attachEvent('WeixinJSBridgeReady', wxReadyFunc);
document.attachEvent('onWeixinJSBridgeReady', wxReadyFunc);
}
}else{
wxReadyFunc();
}
}
}
return {
version :"1.8",
ready :wxJsBridgeReady,
shareToTimeline :weixinShareTimeline,
shareToWeibo :weixinShareWeibo,
shareToFriend :weixinSendAppMessage,
showOptionMenu :showOptionMenu,
hideOptionMenu :hideOptionMenu,
showToolbar :showToolbar,
hideToolbar :hideToolbar,
getNetworkType :getNetworkType,
imagePreview :imagePreview,
closeWindow :closeWindow
};
})();The above is the entire content of this article. I hope it will be helpful to everyone's study. I also hope that everyone Duoduo supports PHP Chinese website.
For more articles related to js WeChat sharing API, please pay attention to the PHP Chinese website!
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Hot AI Tools
Undress AI Tool
Undress images for free
Undresser.AI Undress
AI-powered app for creating realistic nude photos
AI Clothes Remover
Online AI tool for removing clothes from photos.
Clothoff.io
AI clothes remover
Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!
Hot Article
Grass Wonder Build Guide | Uma Musume Pretty Derby
4 weeks ago
By Jack chen
Roblox: 99 Nights In The Forest - All Badges And How To Unlock Them
4 weeks ago
By DDD
Uma Musume Pretty Derby Banner Schedule (July 2025)
1 months ago
By Jack chen
RimWorld Odyssey Temperature Guide for Ships and Gravtech
3 weeks ago
By Jack chen
Windows Security is blank or not showing options
1 months ago
By 下次還敢
Hot Tools
Notepad++7.3.1
Easy-to-use and free code editor
SublimeText3 Chinese version
Chinese version, very easy to use
Zend Studio 13.0.1
Powerful PHP integrated development environment
Dreamweaver CS6
Visual web development tools
SublimeText3 Mac version
God-level code editing software (SublimeText3)
