Shulou(Shulou.com)06/01 Report--

This article is about how to evoke Wechat in external browsers of HTML5. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

Html section:

/ / introduce mshare.js click to pop up native sharing panel click to trigger moments to share click trigger to send to Wechat friends

Js section:

Var mshare = new mShare ({title: 'Lorem ipsum dolor sit.', url:' http://m.ly.com', desc: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quaerat inventore minima voluptates.', img: 'http://placehold.it/150x150'});$('button').click(function () {/ / 1 = > moments 2 = > Friends 0 = > Native mshare.init pops up directly (+ $(this) .data (' mshare'));})

Here is the code sharing for mshare.js. Create a new js file of this code and put it in it, then introduce ok into the page.

/ * the main function of this plug-in is to trigger the function of Wechat to share or send to friends in UC and QQ * / 'use strict';var UA = navigator.appVersion; / * * is it a UC browser * / var uc = UA.split (' UCBrowser/'). Length > 1? 1: 0 / * judge QQ Browser * however, QQ Browser's high or low version * 2 represents the high version * 1 represents the low version * / var qq = UA.split ('MQQBrowser/'). Length > 1? 2: 0; / * * is it Wechat * / var wx = / micromessenger/i.test (UA); / * * browser version * / var qqVs = qq? ParseFloat (UA.split ('MQQBrowser/') [1]): 0 var ucVs = uc? ParseFloat (UA.split ('UCBrowser/') [1]): 0; / * get operating system information iPhone (1) Android (2) * / var os = (function () {var ua = navigator.userAgent; if (/ iphone | ipod/i.test (ua)) {return 1;} else if (/ android/i.test (ua)) {return 2;} else {return 0 }} (); / * whether the corresponding api file has been loaded under QQ Browser * / var qqBridgeLoaded = false; / / further refined version and platform judgment if ((qq & & qqVs < 5.4& & os = = 1) | | (qq & & qqVs < 5.3& & os = = 1) {qq = 0;} else {if (qq & qqVs < 5.4& os = 2) {qq = 1) } else {if (uc & (ucVs < 10.2& & os = = 1) | | (ucVs < 9.7& & os = = 2)) {uc = 0 } / * QQ Browser loads the corresponding bridge * @ method loadqqApi * @ param {Function} cb callback function * / function loadqqApi (cb) {/ / qq = = 0 if (! qq) {return cb & & cb ();} var script = document.createElement ('script') according to different versions Script.src = (+ qq = 1)?'/ / 3gimg.qq.comUniple html5Maple qb.js':'/ / jsapi.qq.com/get?api=app.share'; / * need to initialize the sharing component * / script.onload = function () {cb & & cb ();}; document.body.appendChild (script) after loading qq's bridge script. } / * UC browser sharing * @ method ucShare * / function ucShare (config) {/ / ['title',' content', 'url',' platform', 'disablePlatform',' source', 'htmlID'] / / about platform / / ios: kWeixin | | kWeixinFriend; / / android: WechatFriends | | WechatTimeline / / uc sharing will directly use screenshot var platform =''; var shareInfo = null / / specified sharing type if (config.type) {if (os = = 2) {platform = config.type = = 1? 'WechatTimeline':' WechatFriends';} else if (os = = 1) {platform = config.type = = 1? 'kWeixinFriend':' kWeixin';}} shareInfo = [config.title, config.desc, config.url, platform,']; / / android if (window.ucweb) {ucweb.startRequest & & ucweb.startRequest ('shell.page_share', shareInfo); return;} if (window.ucbrowser) {ucbrowser.web_share & & ucbrowser.web_share.apply (null, shareInfo) Return;}} / * QQ Browser sharing function * @ method qqShare * / function qqShare (config) {var type = config.type; / / Wechat Friends 1, Wechat moments 8 type = type? ((type = = 1)? 8: 1):' Var share = function () {var shareInfo = {'url': config.url,' title': config.title, 'description': config.desc,' img_url': config.img, 'img_title': config.title,' to_app': type, 'cus_txt':'} If (window.browser) {browser.app & & browser.app.share (shareInfo);} else if (window.qb) {qb.share & & qb.share (shareInfo);}}; if (qqBridgeLoaded) {share ();} else {loadqqApi (share) The exposed interface function * @ method mShare * @ param {Object} config configuration object * / function mShare (config) {this.config = config; this.init = function (type) {if (typeof type! = 'undefined') this.config.type = type; try {if (uc) {ucShare (this.config) } else if (qq & &! wx) {qqShare (this.config);}} catch (e) {} / / preload qq bridgeloadqqApi (function () {qqBridgeLoaded = true;}); if (typeof module = 'object' & & module.exports) {module.exports = mShare;} else {window.mShare = mShare;} Thank you for reading! This is the end of the article on "how to evoke Wechat in an external HTML5 browser". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, you can share it for more people to see!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.