资讯专栏INFORMATION COLUMN

js微信分享

SwordFly / 1048人阅读

摘要:首先引入微信文件新建分享统计分享次数开启调试模式调用的所有的返回值会在客户端出来,若要查看传入的参数,可以在端打开,参数信息会通过打出,仅在端时才会打印。

首先引入微信文件

新建share.js
function share(datas){
    /*
     分享
     */
    //success: to share
    function encode(url) {
        return encodeURIComponent(url).replace(/"/g, "%27").replace(/"/g, "%22");
    }
    //统计分享次数
    function countShare(datas) {
        var parameter =  datas.parameter;
        var countUrl = "https://activity.xxxxxx.com/activityapi/weixin/countShare.json?activityType="+datas.activityType;
        $.ajax({
            type: "get",
            contentType:"application/x-www-form-urlencoded;charset=UTF-8",
            url: countUrl,
            dataType:"jsonp",
            jsonp:"jsoncallback",
            success: function(data){
                if(data.success){

                }else{

                }
            },
            error: function(xhr, type){

            }
        })
        return
    }
    surl = window.location.href;
    var url = "https://www.xxxxxx.com/weixin/wx_share.json?url=" + encode(window.location.href.split("#")[0]);
    var callback = function (json) {
        var data = json.message;
        data = eval("(" + data + ")");
        wx.config({
            debug: false,// 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
            appId: data.appId,// 必填,公众号的唯一标识
            timestamp: data.timestamp,// 必填,生成签名的时间戳
            nonceStr: data.nonceStr,// 必填,生成签名的随机串
            signature: data.signature,// 必填,签名
            jsApiList: ["onMenuShareTimeline", "onMenuShareAppMessage", "onMenuShareQQ", "onMenuShareWeibo"]// 必填,需要使用的JS接口列表
        });

        wx.ready(function () {
            var shareData = {
                title: datas.title,
                desc: datas.desc,
                link: datas.shareUrl==undefined?surl:datas.shareUrl, // 分享链接
                imgUrl: datas.imgUrl,
                success: function () {
                    // 用户确认分享后执行的回调函数

                    //如果存在统计类型 则统计分享次数
                    if(datas.activityType){
                        countShare(datas);
                    }

                }
            };
            var shareFrieds = {
                title: datas.title,
                link: datas.shareUrl==undefined?surl:datas.shareUrl, // 分享链接
                imgUrl: datas.imgUrl,
                success: function () {
                    // 用户确认分享后执行的回调函数

                    //如果存在统计类型 则统计分享次数
                    if(datas.activityType){
                        countShare(datas);
                    }

                }
            };
            wx.onMenuShareAppMessage(shareData);//分享给好友
            wx.onMenuShareQQ(shareData);
            wx.onMenuShareWeibo(shareData);
            wx.onMenuShareTimeline(shareFrieds);//朋友圈

            console.log("weixin support set success.");
        });
        wx.error(function (res) {
            //alert(res.errMsg);
        });
    };
    $.ajax({
        url: url,
        dataType: "jsonp",
        jsonp: "jsoncallback",
        success: function (response) {
            callback && callback(response);
        },
        error: function (xhr, type) {
            console.log("xhr:" + xhr + "type:" + type);

        }
    })
}
    
调用

//微信分享
var datas = {
title: "分享标题",
desc: "分享描述",
imgUrl: "分享图片",
activityType: "xxxx",// 用来查询分享次数
shareUrl: "分享链接"
};
share(datas);

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/89797.html

相关文章

  • 微信二次分享

    摘要:接下来通过详细的步骤介绍如何接入微信二次分享操作。不要尝试在中使用异步请求修改本次分享的内容,因为客户端分享操作是一个同步操作,这时候使用的回包会还没有返回用户点击分享到朋友圈已分享已取消此时微信二次分享就已经大功告成了。 微信二次分享 效果演示 showImg(https://segmentfault.com/img/remote/1460000016895951); 如何运行项目 ...

    Betta 评论0 收藏0
  • 微信二次分享

    摘要:接下来通过详细的步骤介绍如何接入微信二次分享操作。不要尝试在中使用异步请求修改本次分享的内容,因为客户端分享操作是一个同步操作,这时候使用的回包会还没有返回用户点击分享到朋友圈已分享已取消此时微信二次分享就已经大功告成了。 微信二次分享 效果演示 showImg(https://segmentfault.com/img/remote/1460000016895951); 如何运行项目 ...

    NusterCache 评论0 收藏0
  • 微信二次分享

    摘要:接下来通过详细的步骤介绍如何接入微信二次分享操作。不要尝试在中使用异步请求修改本次分享的内容,因为客户端分享操作是一个同步操作,这时候使用的回包会还没有返回用户点击分享到朋友圈已分享已取消此时微信二次分享就已经大功告成了。 微信二次分享 效果演示 showImg(https://segmentfault.com/img/remote/1460000016895951); 如何运行项目 ...

    Kahn 评论0 收藏0
  • 微信 js-sdk 使用心得

    摘要:前端配置微信微信是微信公众平台面向网页开发者提供的基于微信的网页开发工具包,通过使用微信,网页开发者,可借助微信高效的使用拍照扫码录音定位等原生应用爱具有的能力。 前端配置微信 js-sdk 微信js-sdk 是微信公众平台面向网页开发者提供的基于微信的网页开发工具包,通过使用微信 js-sdk,网页开发者,可借助微信高效的使用 拍照、扫码、录音、定位等原生应用爱具有的能力。 前端开发...

    岳光 评论0 收藏0
  • vue + 微信二次分享/自定义分享

    摘要:但是在本次开发中,我只使用了,,个别微信版本分享出来的还是没有图片和文案,的是没有问题,所以又加上了弃用的,之后,安卓机也可以正常分享。 微信二次分享/自定义分享 从App中使用App分享(一次分享) showImg(https://segmentfault.com/img/bVbp83T?w=593&h=278); 使用微信导航栏的分享(二次分享) --已做处理 showImg(...

    diabloneo 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<