uniapp-h5使用微信SDK分享功能、和获取当前位置

 1. npm install jweixin-module -s
 2. var jweixin = require('jweixin-module'); 
    import { getSignPackage } from '@/common/api/manage.js' 
    export default {   //判断是否在微信中  
    	isWechat: function () {
	        var ua = window.navigator.userAgent.toLowerCase();
	        if (ua.match(/micromessenger/i) == 'micromessenger') {
	          // console.log('是微信客户端')
	          return true;
	        } else {
	          // console.log('不是微信客户端')
	          return false;
	        }   
        },   //初始化分享功能sdk配置   
        initJssdkShare: function (callback, url) {
	        //服务端进行签名 ,可使用uni.request替换。 签名算法请看文档
	        getSignPackage({ url: url }).then(res => {
	          console.log(`签名成功${url}`)
	            jweixin.config({
	              debug: false,
	              appId: res.appId,
	              timestamp: res.timestamp,
	              nonceStr: res.nonceStr,
	              signature: res.signature,
	              jsApiList: [
	                'checkJsApi',
	                'onMenuShareTimeline',
	                'onMenuShareAppMessage',
	                'getLocation'
	              ]
	            });
	            //配置完成后,再执行分享等功能
	            if (callback) {
	              callback(res);
	            }
	        })   
        },   
        //初始化普通sdk配置   
        initJssdk: function (callback) {
        	getSignPackage().then(res => {
	            jweixin.config({
	              debug: false,
	              appId: res.appId,
	              timestamp: res.timestamp,
	              nonceStr: res.nonceStr,
	              signature: res.signature,
	              jsApiList: [
	                'checkJsApi',
	                'getLocation'
	              ]
	            });
	            //配置完成后,再执行分享等功能
	            if (callback) {
	              callback(res);
	            }
	        })   
          },   
        //在需要自定义分享的页面中调用   share: function (data, url) {
        console.log(url)
        url = url ? url : window.location.href;
        if (!this.isWechat()) {
          return;
        }
        console.log('进入share')
        console.log(`签名成功${data.img}`)
        //每次都需要重新初始化配置,才可以进行分享
        this.initJssdkShare(function (signData) {
          console.log('进入initJssdkShare')
          jweixin.ready(function () {
            jweixin.checkJsApi({
    					jsApiList: ['onMenuShareAppMessage'],
    					success: function(res) {
    						// 如:{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
                // console.log(JSON.stringify(res))
    					}
    				});
            var shareData = {
              title: data && data.title ? data.title : signData.site_name,
              desc: data && data.desc ? data.desc : signData.site_description,
              link: url,
              imgUrl: data && data.img ? data.img : signData.site_logo,
              success: function (res) {
                //用户点击分享后的回调,这里可以进行统计,例如分享送金币之类的
                // post('/api/member/share');
                // alert("点击分享:" +JSON.stringify(res));
              },
              cancel: function (res) { }
            };
            //分享给朋友接口
            jweixin.onMenuShareAppMessage(shareData);
            //分享到朋友圈接口
            // jweixin.onMenuShareTimeline(shareData);
          });
        }, url);   
        },   //在需要定位页面调用   location: function (callback) {
        if (!this.isWechat()) {
          console.log('不是微信客户端')
          return;
        }
        this.initJssdk(function (res) {
          jweixin.ready(function () {
            
            jweixin.getLocation({
            	// 默认为wgs84的gps坐标,如果要返回直接给openLocation用的火星坐标,可传入'gcj02'
              type: 'gcj02', 
              success: function (res) {
                // console.log(res);
                console.log('111111')
                callback(res)
              },
              fail: function (res) {
                console.log(res)
              },
              complete: function (res) {
                console.log(res)
              }
            });
          });
        });   
      } 
   }
   
 3. main.js挂载到vue
	import wechat from './common/utils/wechatSdk'
	if(wechat.isWechat()){
  		Vue.prototype.$wechat =wechat;
	}
	
 4. 页面中使用
	wechartShareLink () {
      let that = this
      // #ifdef H5
      if (this.$wechat && this.$wechat.isWechat()) {
        this.showTipGuide = true
        this.$wechat.share(
          {
            title: '真诚的邀请你加入少先队!',
            desc: '破土的幼芽, 长成了鲜丽的花朵; 伸展嫩绿的翠叶、毛茸的花托,开出五彩的花瓣、绚烂的颜色',
            img: `${shareUrl}/profile/upload/2022/03/26/c61593a4-7fc8-4f7a-bd17-54f3f9e075c0.jpeg`
          },
          uni.getStorageSync('shareUrl'),
          function (res) {
            uni.showToast({ title: '分享成功' })
            that.showTipGuide = false
          })
      } else {
        uni.showToast({ icon: 'none', title: '该功能只适用于微信内置浏览器' })
      }
      // #endif
    }
  • 0
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值