15.h5页面调用微信JS-SDK分享到微信好友、朋友圈、微博等等

一、准备工作:

  • 公众号管理平台配置安全域:
     自定义页面分享功能需要微信认证才能使用,需要开发者ID等信息。

二、代码示例:

  1. 引入微信JS-SDK:
<script type="text/javascript" 
       src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js">
</script>
  1. 页面配置使用:
 <script type="text/javascript">
   function init() {
        $.ajax({
               type: "POST", 
               url: "......",//后台接口
               data: parms, //可选参数
               dataType: "json",
                    success: function(data){ 
                         //初始化配置
                          wx.config({
                            appId: data.appId,  // 公众号的唯一标识 
                            timestamp: data.timestamp, //生成签名的时间戳
                            nonceStr: data.nonceStr,
                            signature: data.signature, //签名
                                //配置可分享功能列表
                            jsApiList: ['chooseImage', 'uploadImage', 'downloadImage',
                                'previewImage', 'openLocation', 'getLocation',
                                'scanQRCode', 'checkJsApi', 'onMenuShareTimeline',
                                'onMenuShareAppMessage', 'onMenuShareQQ',
                                'onMenuShareWeibo', 'onMenuShareQZone']  //配置分享功能
                        });
                    }
                });
            }

  //初始化:
   $(function () {
      init();
    });

   //需在用户可能点击分享按钮前就先调用
   function initwx(){
            wx.ready(function () {
               //1.定位
                wx.getLocation({
                    type: 'gcj02',
                    success: function (res) {
                          alert("定位成功");
                          localStorage.setItem("lng", res.longitude);
                         localStorage.setItem("lat", res.latitude);
                    },
                    cancel: function (res) {
                         alert('用户拒绝授权获取地理位置');
                    },
                });
      
                //2.分享朋友链接自定义样式设置:(自定义)
                wx.onMenuShareAppMessage({
                     title: ..., // 分享标题
                     desc : ..., // 分享描述
                     imgUrl: ...,
                     type : 'link', // 分享类型,music、video或link,不填默认为link
                     success : function() {
                     },
                     cancel : function() {
                     }
               });

              //3.分享....
   }      
</script>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容