The editor received a leadership task to write an h5 mobile activity page, click on the page content to retrieve ios and Android and develop the sharing function (including WeChat, WeChat Moments, QQ, QQ Space, etc.) that the user has not logged in. You can only share after logging in. After the sharing is successful, you can initiate a request to give a coupon function. The following is the experience gained, for reference only.
It is recommended not to use ShareSDK
Directly upload useful information: no need to reference other libraries
var u = navigator.userAgent;//Determine the mobile phone type//--------------------------------------------- ---Android phone------------------------------------------------ ----------// if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) { //Android var callbackButton = document.getElementById ('btnImg'); //Get the node callbackButton.onclick = function (e) { e.preventDefault(); //Block the original function if (userId == null) { //See if you are logged in, if not logged in WebViewJavascriptBridge.callHandler('loginAction', function (response) {})//Here is the h5 page to call the Android login method} else {//Already logged in WebViewJavascriptBridge.callHandler('shareAction', { //The h5 page calls the Android method to share the parameters passed to android, content: You treat, I pay the bill, invite friends to go (fun) and book a ride together, // Shared text pictureLinking: http://yueche-1254224848.cossh.myqcloud.com/che/%E5%B0%8F%E5% 9B%BE.jpg, // Shared picture Url title: Fun Hail - waiting for you at Xinghai Square Station, // Shared title pictureUrl: http://agent.qyueche.com/sup/ShareSdk/xing.html, //Shared URL link platform: [2, 3] //1 Sina Weibo 2 WeChat friends 3 WeChat friends circle 4 QQ friends 5 QQ space 6 SMS }, function (response) {}) } } function connectWebViewJavascriptBridge(callback) {//This is after successful sharing if (window.WebViewJavascriptBridge) { callback(WebViewJavascriptBridge) } else { document.addEventListener( 'WebViewJavascriptBridgeReady' , function() { callback(WebViewJavascriptBridge) }, false ); } } connectWebViewJavascriptBridge(function(bridge) { bridge.init(function(message, responseCallback) { }) ; bridge.registerHandler('shareComplete', function (data, responseCallback) { //ios callback method, // alert(data) if (data == 1) { //If the sharing is successful $.ajax({ //Request interface to receive coupons type: get, contentType: application/x-www -form-urlencoded, // url: http://main.qyueche.com/api/coupon/receiveCoupon?userId= + userId + // &takeCouponType=2&couponId=176, url: http://dev.qyueche.cn/api/coupon/receiveCoupon?userId= + userId + &takeCouponType=2&couponId=187, data: {}, dataType: json, success: function (data) { //Receive successfully swal(data .message); }, error: function (XMLHttpRequest, textStatus, errorThrown) { //Failed to receive swal('Failed to receive!'); } }) } else { //Failed to share swal('Failed to share!'); } }) bridge.registerHandler('loginComplete', function (data, responseCallback) { //ios login method, userId = data; }) }) } else if (u.indexOf('iPhone') > -1) { //---------------- -----------------------Apple Phone---------------------- ----------------------------------// // swal(iPhone); function setupWebViewJavascriptBridge(callback) { if (window.WebViewJavascriptBridge) { return callback(WebViewJavascriptBridge); } if (window.WVJBCallbacks) { return window.WVJBCallbacks.push(callback); } window.WVJBCallbacks = [callback ]; var WVJBIframe = document.createElement('iframe'); WVJBIframe.style.display = 'none'; WVJBIframe.src = 'https://__bridge_loaded__'; document.documentElement.appendChild(WVJBIframe); setTimeout(function () { document.documentElement.removeChild(WVJBIframe) }, 0) } setupWebViewJavascriptBridge(function (bridge) { bridge.registerHandler('shareComplete', function (data, responseCallback) { //ios callback method, if (data.code == 1) { //If sharing is successful $.ajax({ //Request interface to receive coupons type: get, contentType: application/x-www-form-urlencoded, // url: http://main.qyueche.com/api/coupon/receiveCoupon?userId= + userId + // &takeCouponType=2&couponId=176, url: http://dev.qyueche.cn/api/coupon/receiveCoupon?userId= + userId + &takeCouponType=2&couponId=187, data: {}, dataType: json, success: function (data) { //Received successfully swal(data.message); }, error: function (XMLHttpRequest, textStatus, errorThrown) { //Failed to receive swal('Failed to receive!'); } }) } else { //Failed to share swal('Failed to share!'); } }) bridge.registerHandler('loginComplete' , function (data, responseCallback) { //ios login method, userId = data.userId; }) var callbackButton = document.getElementById('btnImg'); //Get the node callbackButton.onclick = function (e) { //Click event e.preventDefault(); //Prevent the original function if (userId == null) { //See if you are logged in bridge.callHandler('loginAction', function (response) {}) } else { bridge.callHandler('shareAction', { //Parameter content passed to ios: You treat, I pay the bill, invite friends to go (fun) and book a ride together, // Shared text pictureLinking: http://yueche-1254224848.cossh.myqcloud.com/che/%E5%B0%8F%E5% 9B%BE.jpg, // Shared picture Url title: Fun Hail - waiting for you at Xinghai Square Station, // Shared title pictureUrl: http://agent.qyueche.com/sup/ShareSdk/xing.html, //Shared URL link platform: [2, 3] //1 Sina Weibo 2 WeChat Friends 3 WeChat Moments 4 QQ Friends 5 QQ Space 6 SMS }, function (response) {}) } } }) }In general, the code similarities between Android and iOS are very similar, but the code placement is different. It should be noted that callHandler is the method for calling pages in iOS or Android, and registerHandler is the method for calling pages in iOS and Android.
The method name of the position of the red box in the picture is customized by the h5 page developer and the ios and Android personnel.
The above is the entire content of this article. I hope it will be helpful to everyone’s study. I also hope everyone will support VeVb Wulin Network.