• 小编也经常在微信朋友圈分享一些好的文章或者让人哭或笑的段子,就在手机右上角的三个竖点一键分享就ok了,那么对于... 微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包。 JSSDK使用步骤
              小编也经常在微信朋友圈分享一些好的文章或者让人哭或笑的段子,就在手机右上角的三个竖点一键分享就ok了,那么对于分享到朋友圈是怎么实现的呢?对于那种活动分享送流量是怎么定位分享者的呢?而想要将文章发送给朋友又是怎么获取到的朋友列表的呢?
     
             微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包。

    JSSDK使用步骤


    1、绑定域名

               先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。

    说明:设置此安全域名目的是为了当发现此公众平台发现诱导分享行为时,可以根据此域名追溯到所有分享出去的链接,以及通过这些链接增加的粉丝。


    2、引入js文件

              在需要调用JS接口的页面引入如下JS文件http://res.wx.qq.com/open/js/jweixin-1.0.0.js

    说明:如果页面启用了https,务必要引入https://res.wx.qq.com/open/js/jweixin-1.0.0.js ,否则将无法在iOS9.0以上系统中成功使用JSSDK


    3、通过config接口注入权限验证配置

                在微信公众平台JSSDK说明文档是这样解释的:

    wx.config({  
        debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。  
        appId: '', // 必填,公众号的唯一标识  
        timestamp: , // 必填,生成签名的时间戳  
        nonceStr: '', // 必填,生成签名的随机串  
        signature: '',// 必填,签名,见附录1  
        jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2  
    });  

    4、通过ready接口处理成功验证

    wx.ready(function(){  
    // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。  
    });

    5、通过error接口处理失败验证

    wx.error(function(res){  
    // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。  
    });  


    分享接口:

    1、获取“分享到朋友圈”按钮点击状态及自定义分享内容接口

    wx.onMenuShareTimeline({  
        title: '', // 分享标题  
        link: '', // 分享链接  
        imgUrl: '', // 分享图标  
        success: function () {   
            // 用户确认分享后执行的回调函数  
        },  
        cancel: function () {   
            // 用户取消分享后执行的回调函数  
        }  
    });  

    2、获取“分享给朋友”按钮点击状态及自定义分享内容接口

    wx.onMenuShareAppMessage({  
        title: '', // 分享标题  
        desc: '', // 分享描述  
        link: '', // 分享链接  
        imgUrl: '', // 分享图标  
        type: '', // 分享类型,music、video或link,不填默认为link  
        dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空  
        success: function () {   
            // 用户确认分享后执行的回调函数  
        },  
        cancel: function () {   
            // 用户取消分享后执行的回调函数  
        }  
    });  

              曾经小编做过一个微信摇一摇的页面,当然这个页面需要自定义分享功能,
                        so…… 

           在右上角可以点击分享到朋友圈和发送给朋友 

                                                                        之后在朋友圈是酱紫的……


    页面源码:

    <%--引入js文件--%>  
     <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>  
    <%--通过config接口注入权限验证配置--%>  
         <script>  
            wx.config({  
                debug: false,  
                appId: '${shakeMap.appId}',  
                timestamp: '${shakeMap.timestamp}',  
                nonceStr: '${shakeMap.nonceStr}',  
                signature: '${shakeMap.signature}',  
                jsApiList: [  
                    'checkJsApi',  
                    'onMenuShareTimeline',  
                    'onMenuShareAppMessage'  
                ]  
            });  
            wx.ready(function () {  
                    <%--公共方法--%>  
                var shareData = {  
                    title: '${title}',  
                    desc: '${description}',  
                    link: '${url}',  
                    imgUrl: '${headImgUrl}',  
                    success: function (res) {  
                        //alert('已分享');  
                    },  
                    cancel: function (res) {  
                    }  
                };  
                    <%--分享给朋友接口--%>  
                wx.onMenuShareAppMessage({  
                    title: '${title}',  
                    desc: '${description}',  
                    link: '${url}',  
                    imgUrl: '${headImgUrl}',  
                    trigger: function (res) {  
                              //  alert('用户点击发送给朋友');  
                    },  
                    success: function (res) {  
                        //alert('已分享');  
                    },  
                    cancel: function (res) {  
                        //alert('已取消');  
                    },  
                    fail: function (res) {  
                        alert(JSON.stringify(res));  
                    }  
                });  
                    <%--分享到朋友圈接口--%>  
                wx.onMenuShareTimeline(shareData);  
            });  
              <%--处理失败验证--%>  
            wx.error(function (res) {  
                alert("error: " + res.errMsg);  
            });  
        </script>  

                一定要在公众号进行安全域名的配置,这样,微信就可以牢牢控制你的微信平台了,一旦发现违规,让分享链接失败,删除掉诱导行为增加的粉丝,是瞬间就可以完成的。因此,微信平台的开发者,一定要合理来使用分享功能,不要因小失大。等到你的微信平台被封,估计库都来不及了。


               记得是在春节期间,客户非要做一个红包的活动,就是嵌在微信公众号上的,我们猿儿们疯狂的做完了势必要在春节前上线,但是测试的时候就被微信沉重的打击到了。谁都知道春节期间微信的红包是如火如荼的撩了亿万群众,为此还差点整垮了红包后台,红包二字丫的成了敏感字符,我们分享到朋友圈,微信就秒删我们的东西,这个时候急坏了项目组长和产品经理。没有办法,我们不能和微信硬碰硬,所以将红包二字改成了个人红包……小编也是醉了,微信也太小气了些。不过微信还是非常给力的,这么多的接口免费给我们用也是慈悲为怀了。



    展开全文
  • 微信公众号开发

    微信公众号开发绝大部分与移动端开发相同。不过相比移动端,微信浏览器的内核就一种,对兼容性的要求更低一些。

    安卓微信浏览器的内核属于魔改版的webkit内核。

    ios微信浏览器的内核兼容性处理更接近safari浏览器。

    绝大部分兼容性参照谷歌浏览器就行

    微信开发中与移动端不同的就是可以借助微信调用很多手机的硬件,通过微信封装的js调用一些微信的接口。

    微信分享

    微信允许用户将页面分享给其他用户或者朋友圈,或者qq。不过最常用的用户分享功能是分享给朋友与朋友圈。因为大多微信开发都涉及到微信登陆的功能,这导致页面在其他浏览器打不开。

    微信分享主要通过微信的jssdk中的分享接口来实现的。微信的jssdk的权限注入我在之前的文章内已经有所讲解,这里就不多说了。

    微信在引入js文件并且调用wx.config接口注入权限后,然后通过wx.ready接口去读取接口。主要是因为注入权限为异步的,而wx.ready接口就像wx.config接口的回调函数。

    wx.onMenuShareAppMessage({
        title: '', // 分享标题
        desc: '', // 分享描述
        link: '', // 分享链接,该链接域名必须与当前企业的可信域名一致
        imgUrl: '', // 分享图标
        type: '', // 分享类型,music、video或link,不填默认为link
        dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
        success: function () {
            // 用户确认分享后执行的回调函数
        },
        cancel: function () {
            // 用户取消分享后执行的回调函数
        }
    

    })

    微信分享给好友的接口为onMenuShareAppMessage。值得一提的是这个定义的是微信点击右上角分享给朋友的功能,微信不允许自定义分享的按钮。这里设置过是单击右上角分享的内容

    title是分享的标题

    desc描述

    link分享打开的链接,在分享给好友后打开会在链接里加一个from参数

    在success里面是用户分享成功的回调函数,可以在里面添加一些业务逻辑,比如说分享加积分功能。

    cancel是用户取消了分享的回调

    wx.onMenuShareTimeline({
        title: '', // 分享标题
        link: '', // 分享链接
        imgUrl: '', // 分享图标
        success: function () {
            // 用户确认分享后执行的回调函数
        },
        cancel: function () {
            // 用户取消分享后执行的回调函数
        }
    });
    分享到朋友圈的接口跟转发的接口差不多,就是不能分享音频与视频。
    展开全文
  • 前段时间由于工作需要有几个H5活动页要在微信分享到朋友圈,分享给朋友,但是发现分享出去的都是系统默认的图片和默认的document.title,那么想要自定义这部分内容,就需要看微信公众平台的开发文档 点击打开微信...

    前段时间由于工作需要有几个H5活动页要在微信上分享到朋友圈,分享给朋友,但是发现分享出去的都是系统默认的图片和默认的document.title,那么想要自定义这部分内容,就需要看微信公众平台的开发文档

    点击打开微信公众平台开发文档




    1.首先要分享的H5页面的域名需要微信公众账号在设置里填写”JS接口安全域名“,绑定域名才能获得接口使用权限;



    2.在需要调用JS接口的页面引入如下JS文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.2.0.js



    3.

    wx.config({
        debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
        appId: '', // 必填,公众号的唯一标识
        timestamp: , // 必填,生成签名的时间戳
        nonceStr: '', // 必填,生成签名的随机串
        signature: '',// 必填,签名,见附录1
        jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
    });
    
    
    
    

    下面贴出我的代码,由于这几项必填的参数我都是从后台获取来的,所以多了一步请求数据的过程,可忽略,

    调试的时候debug设置成true 可在移动设备上alert出错误信息,遇到过一次一直说签名错误的问题,原因是由于后

    台不能动态获取前台页面的地址,为什么要动态获取,因为地址栏后面传参数了,每次都不一样的,后来解决方法就

    变成我在请求数据的时候把当前地址一并传给后台,后台再根据这个地址绑定域名,大概是这个意思,我代码里只写

    了分享至朋友圈的接口,如果你需要分享到QQ,或者分享给朋友,只需要把相应的微信接口填进去就行了,其他没

    什么不同,最后记得调用我图中的getMsg方法就可以了




    展开全文
  • 微信上做推广活动一般都是着眼于微信分享,这篇文章介绍如何在页面中加入微信分享的处理。本文使用语言为Java+js。


    文章作者:松阳

    本文出自 阿修罗道,禁止用于商业用途,转载请注明出处。  

    原文链接:http://blog.csdn.net/fansongy/article/details/44680987

    width="150" height="210" frameborder="0" scrolling="no" src="http://widget.weibo.com/relationship/bulkfollow.php?language=zh_cn&uids=2080045857&wide=1&color=FFFFFF,FFFFFF,0082CB,666666&showtitle=0&showinfo=1&sense=0&verified=1&count=1&refer=http%3A%2F%2Fwww.himigame.com%2Fandroid-game%2F1521.html&dpc=1" style="font-size: 14px; font-weight: bold; border-width: 0px; margin: 0px; padding: 0px; font-family: arial, helvetica, clean, sans-serif; line-height: 16px;">







    微信分享

    微信上做推广活动一般都是着眼于微信分享,这篇文章介绍如何在页面中加入微信分享的处理。本文使用语言为Java+js。

    原理

    微信分享功能的难点,在于用户是否真正的分享了推广页面,所以我们要知道用户分享成功的操作。经过查询文档,微信提供了对应的JS接口。对应文档在这里 .

    大体流程是这样的:

    • 绑定域名
    • 引入JS文件
    • 通过config接口注入权限验证配置
    • 通过ready接口处理成功验证
    • 通过error接口处理失败验证
    • 编写对应回调

    如果你自信满满的完成了上面这些步骤,就可以开始着手测试了。 当点击对应功能时,微信会回调对应的接口。我的需求是当用户分享到自己的朋友圈时,做一些猥琐的操作 ,因此下面以分享朋友圈为例,当然其他功能也很类似,此处按下不表。

    实现

    上面概括了原理了原理,接下来一步一步看。本文可以结合 官方文档 一起看,毕竟它更新维护的比较勤。

    绑定域名

    先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。 备注:登录后可在“开发者中心”查看对应的接口权限。

    此处要注意了,微信服务号还没验证的程序狗,赶紧催促贵公司的商务人员,申请微信服务号验证,目前没有认证的服务号是没法使用大多数JS接口的

    引入JS文件

    在需要调用JS接口的页面引入如下JS文件,(支持https):

    http://res.wx.qq.com/open/js/jweixin-1.0.0.js

    备注:支持使用 AMD/CMD 标准模块加载方法加载

    这个没啥说的,就是注意要把引入放到其他步骤的上面,JS脚本按顺序加载,大家都懂的。

    通过config接口注入权限验证配置

    这个最麻烦了,首先说脚本的格式:

    wx.config({
        debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
        appId: '', // 必填,公众号的唯一标识
        timestamp: , // 必填,生成签名的时间戳
        nonceStr: '', // 必填,生成签名的随机串
        signature: '',// 必填,签名,见附录1
        jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
    });

    这部分信息的获取,推荐使用ajax请求一下自己的服务器,毕竟加密这东西没法在客户端搞。所以大体流程是用户打开网页,运行ajax脚本请求服务器一堆信息,成功发下来后,在写到js里面。下面上代码:

    var url = location.href.split('#').toString();
    $.ajax({
        type : "POST",
        url : "yourInterfaceURL",
        dataType : "html",
        async : false,
        data:"url="+url,
        success : function(dataStr) {
            var data = $.parseJSON(dataStr);
            wx.config({
                debug: true,
                appId: data.appid,
                timestamp: data.timestamp,
                nonceStr: data.nonceStr,
                signature: data.signature,        
                jsApiList: [
                    'checkJsApi',
                    'onMenuShareTimeline'
                ]
            });
        },
        error: function(xhr, status, error) {
            alert(status);
            alert(xhr.responseText);
        },
    });

    这里有一点要注意,我们需要将请求页面的URL传上去,因为微信会在页面后面加入一些后缀比如&isInstall=0之类的。所以它要求你动态算一个URL地址,而不能硬编码。

    然后服务器收到这请求就加密去。要加密要一个jsapi_ticket,而要jsapi_ticket又需要token.

    由于原理一样,这里仅以jsapi_ticket为例:

    public String jsapi_ticket = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi";
    
    public String getJsapiTicket() {
        long now = System.currentTimeMillis();
        if(now - curJSTokenTime > expiresJSToken*1000)
        {
            String requestUrl = jsapi_ticket.replace("ACCESS_TOKEN", getToken());
            JSONObject jsonObject = httpsRequest(requestUrl, "GET", null);
            System.out.println("Getting weixin js_token...URL:"+requestUrl);
    
            if (null != jsonObject) {
                try {
                    curJSToken = jsonObject.getString("ticket");
                    expiresJSToken = jsonObject.getInt("expires_in");
                    curJSTokenTime = System.currentTimeMillis();
                    System.out.println("update weixin token:"+curJSToken+"expires_in is:"+expiresJSToken+" curTime:"+curJSTokenTime);
                } catch (JSONException e) {
                    System.out.println("Get JS_Token Error! errcode:{} errmsg:{}"+jsonObject.getInt("errcode")+jsonObject.getString("errmsg")+e);
                }
            } else {
                System.out.println("http for weixin return null");
                curJSToken="";
            }
        } 
        return curJSToken;
    }

    拿到了这个东西就可以算加密串了。当然用这个函数需要先去取Access_Token,这就又要用到appid和appSercet,你必然知道在哪找到这货,啥?不知道?去微信的开发者中心的配置项那边碰碰运气吧。

    public Map<String, String> makeWXTicket(String jsapi_ticket, String url) {
        Map<String, String> ret = new HashMap<String, String>();
        String nonce_str = create_nonce_str();
        String timestamp = create_timestamp();
        String string1;
        String signature = "";
    
        //注意这里参数名必须全部小写,且必须有序
        string1 = "jsapi_ticket=" + jsapi_ticket +
                  "&noncestr=" + nonce_str +
                  "&timestamp=" + timestamp +
                  "&url=" + url;
        try
        {
            MessageDigest crypt = MessageDigest.getInstance("SHA-1");
            crypt.reset();
            crypt.update(string1.getBytes("UTF-8"));
            signature = byteToHex(crypt.digest());
        }
        catch (NoSuchAlgorithmException e)
        {
            e.printStackTrace();
        }
        catch (UnsupportedEncodingException e)
        {
            e.printStackTrace();
        }
    
        ret.put("url", url);
        ret.put("jsapi_ticket", jsapi_ticket);
        ret.put("nonceStr", nonce_str);
        ret.put("timestamp", timestamp);
        ret.put("signature", signature);
        ret.put("appid", appId);
    
        return ret;
    }
    
    private static String byteToHex(final byte[] hash) {
        Formatter formatter = new Formatter();
        for (byte b : hash)
        {
            formatter.format("%02x", b);
        }
        String result = formatter.toString();
        formatter.close();
        return result;
    }
    
    private static String create_nonce_str() {
        return UUID.randomUUID().toString();
    }
    
    private static String create_timestamp() {
        return Long.toString(System.currentTimeMillis() / 1000);
    }

    makeWXTicket这个函数有俩参数,第一个是上面的jsapi_ticket,第二个是页面传上来的url,返回值是一个Map。后面就看各路大神八仙过海了,大死不灵啥的,总之你肯定有办法把这货传回去的。传回去后,就到wx.config中把内容填充进去了。

    ready & error & 功能调用

    最恶心的部分搞过去,其他就一马平川了。

    wx.ready(function () {
        wx.onMenuShareTimeline({
          title: '互联网之子?',
          link: 'http://movie.douban.com/subject/25785114/',
          imgUrl: 'http://demo.open.weixin.qq.com/jssdk/images/p2166127561.jpg',
          trigger: function (res) {
            // 不要尝试在trigger中使用ajax异步请求修改本次分享的内容,因为客户端分享操作是一个同步操作,这时候使用ajax的回包会还没有返回.
            alert('click shared');
          },
          success: function (res) {
            alert('shared success');
            //some thing you should do
          },
          cancel: function (res) {
            alert('shared cancle');
          },
          fail: function (res) {
            alert(JSON.stringify(res));
          }
        });
    
      wx.error(function (res) {
          alert(res.errMsg);
      });
    });

    在网页中添加以上内容,用户点击对应的操作就会弹出提示对话框啦 如果没有回调,签名又没有问题,去开发者中心检查一下接口是否开通了吧。

    总结

    接入过程很纠结,测试比较麻烦,微信服务器的回调只认有备案的域名。验签可以使用这个网址 做测试。总之,祝你好运~

    如果你觉得这篇文章对你有帮助,可以顺手点个,不但不会喜当爹,还能让更多人能看到它... 

    展开全文
  • 微信开发之入门教程

    2016-01-12 10:55:26
    微信开发也是有了一定的认识。在此,小宝鸽再次无私地分享给大家啦。其实微信开发跟web开发没有多大的区别,只是经过了微信,然后再由浏览器打开。因为经过微信,因此你的web会附加一些微信平台所提供的一些功能,...

    时间葱葱,小宝鸽入职也有半年了,刚入的时候刚好有负责开发一个微信企业号的新项目。从项目的一无所有到第一版上线,再一步步完善升级。期间学到了许多东西。对微信开发也是有了一定的认识。在此,小宝鸽再次无私地分享给大家啦。

    其实微信开发跟web开发没有多大的区别,只是经过了微信,然后再由浏览器打开。因为经过微信,因此你的web会附加一些微信平台所提供的一些功能,如获取用户地理位置、获取微信用户头像、拍照上传、发送微信消息等等,通过微信接口即可调用。要将web项目挂靠在微信公众平台上是需要一个帐号的。微信公众平号分为服务号、订阅号、企业号。这三种帐号有一些小区别,但是开发流程都是差不多的,只是开放的功能上有些区别,知道其中一种开发,其他的也差不多。关于具体区别先不作过多介绍,后面的文章会讲到。接下来我们以企业号为例带大家进入微信开发之旅。

    接下来将从下面几个角度带大家了解微信开发:

    (1)申请企业号体验号
    (2)企业号的一些配置
    (3)微信JS接口调用

    好了现在马上开始:

    一、申请企业号体验号

    1.1、首先来到微信企业号的网址 https://qy.weixin.qq.com/

    这里写图片描述

    1.2、可以看到“开发者中心”字眼,点击进入相应页面

    这里写图片描述

    1.3、进入后可以看到“欢迎你,开发者”的公告,右侧有个“申请体验号”,点击进入相应页面。

    这里写图片描述

    1.4、进入“申请体验号”后,可以看到注册流程,按照注册流程填写相应资料并申请,验证邮箱绑定微信号后体验号就申请成功啦。

    这里写图片描述

    1.5、申请成功之后,回到https://qy.weixin.qq.com/,用微信扫一扫扫描登录下方的二维码,输入对应密码即可登录成功,来到你的微信企业号首页啦。

    这里写图片描述

    二、企业号的一些配置

    2.1、添加子部门,如下图,将鼠标放到“企业号体验43560625”就会出现小下标,然后点击添加子部门,填写好信息保存,然后刷新页面即可。

    这里写图片描述
    这里写图片描述

    2.2、添加成员,点击通讯录,然后如下图进行操作,即可添加成员。部门选择刚刚添加的部门

    这里写图片描述

    2.3、然成员关注该企业号,如果添加成员的时候有输入邮箱,可以在通讯录的成员管理那里给成员发送关注邀请,邀请会将企业号二维码发送到对应成员邮箱。另外一种方法直接点击“设置”即可看到体验号二维码。让成员扫这个二维码关注也是可以的(需要注意的是,体验号只能最多关注10个成员哦)。另外下图中的CorpID (wx7099477f2de8aded)非常重要的,先记录起来,下面接口微信JS调用的时候会用到。

    这里写图片描述

    2.4、添加管理组,点击“设置”–>”权限管理”,就会跳转到下图页面,然后“新建管理组”,选择管理员的时候,如果提示该成员已在其他管理组,那么估计需要添加成员了。小宝鸽添加了一个管理组“测试”,添加成功后如下图。其中Secret也是非常重要的东西,之后JS接口调用获取签名需要用到。

    这里写图片描述

    2.5、应用管理。猿友们可以看到左侧菜单中有个”应用中心”。点击应用中心将来到下图页面。”企业小助手”就是本企业号默认存在的一个应用。猿友们可以自行创建更多的应用。

    这里写图片描述

    点击”企业小助手”将会来到下面的界面,默认是回调模式,我们需要设置成普通模式。

    这里写图片描述

    点击”普通模式”,启用模式,然后启用”自定义菜单”。

    这里写图片描述

    自定义菜单启用完成之后,点击自定义菜单中的设置,将会跳转到如下页面:

    这里写图片描述

    添加菜单”测试”,然后设置”微信信息”,内容为”测试啦啦啦”,保存–>发布,然后右边有个预览,点击菜单”测试”,就会自动回复消息,如下图:

    这里写图片描述

    菜单响应除了发送微信消息也可以是跳转到某个链接,因为跳转链接是需要配置可信域名的,因此先介绍如何配置可信域名
    应用管理还有一个地方需要设置的,那就可信域名,如下图,回到”企业小助手”应用的详情页面,添加可信域名,可信域名是有一些要求的(1. 设置的应用域名须通过ICP备案的验证,2. 请使用二级或二级以上域名),这里小宝鸽网上找了一个”yo.bbdfun.com”,猿友们也可以使用这个

    这里写图片描述

    配置了可信域名之后呢,猿友们可以配置跳转到链接的菜单啦,注意配置的url必须是已可信域名作为域名哈,例如:

    这里写图片描述

    三、微信JS接口调用

    3.1、微信提供了一系列的JS接口,使得公众号企开发十分快捷高效,微信JS-SDK接口:
    http://qydev.weixin.qq.com/wiki/index.php?title=%E5%BE%AE%E4%BF%A1JS-SDK%E6%8E%A5%E5%8F%A3
    各位猿友们可粗略看一下上面文档,便可知道大概提供的一些功能。

    3.2、各位猿友们粗略看完”微信JS-SDK接口”,应该有看到下图的说明吧,接口的使用是需要注入权限验证配置的,现在我们上面的体验号等等的一系列操作就派上用场啦。

    这里写图片描述

    3.3、接下来将会一点点向大家介绍怎么调用微信接口啦

    微信接口文档之后的猿友们应该都知道微信接口的调用步骤如下:

    这里写图片描述

    最重要的还是步骤二:权限验证配置。里面有几个参数,小宝鸽将会为猿友们一一介绍:
    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来
    appId: ”, // 必填,企业号的唯一标识,此处填写企业号corpid
    timestamp: , // 必填,生成签名的时间戳
    nonceStr: ”, // 必填,生成签名的随机串
    signature: ”,// 必填,签名,见附录1
    jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2

    debug、appId和jsApiList相信各位猿友们应该都知道大概是什么东西。那么现在给各位猿友们重点介绍:timestamp、nonceStr、signature。
    其实timestamp、nonceStr是用来生成signature的。
    js生成时间戳方法:timestamp = Date.parse(new Date()); //1414587457
    另外,nonceStr也是一串随机串,我们也用时间戳就好了nonceStr=Date.parse(new Date()); //1414587457

    剩下的就是最关键的signature生成方法,这里需要引入access_token概念
    生成signature签名第一步获得access_token:
    浏览器输入:https://qyapi.weixin.qq.com/cgi-bin/gettoken?corpid=wx5f24fa0db1819ea2&corpsecret=uQtWzF0bQtl2KRHX0amekjpq8L0aO96LSpSNfctOBLRbuYPO4DUBhMn0_v2jHS-9
    即可得到access_token:YoxXjnJS57r8gk5Nf-Ki_mSvn98fILxv56EE7NFWE3qQNOH3OaW4iDWwLc05g1mdbuNhipK8fgy-q-pA93DqFw(其有效期为7200秒,即两个小时)

    这里写图片描述

    生成signature签名第二步通过access_token获得ticket:
    浏览器输入:https://qyapi.weixin.qq.com/cgi-bin/get_jsapi_ticket?access_token=YoxXjnJS57r8gk5Nf-Ki_mSvn98fILxv56EE7NFWE3qQNOH3OaW4iDWwLc05g1mdbuNhipK8fgy-q-pA93DqFw
    即可得到ticket:”sM4AOVdWfPE4DxkXGEs8VLMMSNOZxIv5IhnWCyv5sA4UgJuWuMQdfMCeyC5kSL_c7OIMGeETC2y9PXfLbFIFNw(其有效期也是7200秒,即两个小时)

    这里写图片描述

    生成signature签名第三步通过ticket以及下面参数拼成字符串:
    noncestr=1414587457
    jsapi_ticket(即上面的ticket)=sM4AOVdWfPE4DxkXGEs8VLMMSNOZxIv5IhnWCyv5sA5kumyWTQ2VcKEcphBAW62J_HUgmaiKEQ3qhwj5Vlqq7g
    timestamp=1414587457
    url=http://mp.weixin.qq.com

    通过上面的参数拼成(注意参数顺序必须一样):jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VLMMSNOZxIv5IhnWCyv5sA5kumyW
    TQ2VcKEcphBAW62J_HUgmaiKEQ3qhwj5Vlqq7g
    &noncestr=1414587457&timestamp=1414587457&url=http://mp.weixin.qq.com

    最后利用上面的字符串进行sha1加密,有在线的校验工具http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign。但是真正开发的时候肯定是需要写代码的,下面附上sha1加密的java算法:`

    jdk也有提供这个java.security这个包,里面封装好了sha1加密算法。使用方法可参考博主的另外一篇博客AES加密解密 SHA1、SHA加密 MD5加密

    注意真正获取access_token、ticket的时候是需要通过代码实现的,上面在浏览器输入对应地址获取只是为了理顺流程。下面是通过java代码获取。

    3.4、java代码获取签名

    关于使用java代码获取签名的详细过程请参考博主的另外一篇文章 微信开发之使用java获取签名signature(贴源码,附工程)

    该文章有详细的代码,而且附工程下载。

    获取到了签名之后就可以调用微信js接口了,例子后面的文章将会讲到。

    展开全文
  • 微信开发之禁止分享 既然是微信的分享功能,当然要用微信接口,微信接口在调用时有两种方式,但是前提是页面要引入微信的js-JDK 通过配置wx.config(),config:ok后,会执行wx.ready(function(){}),把我们需要...
  • 在一个h5页面添加微信分享微信好友、朋友圈、腾讯微博 下面来实现 。 需要: 1、需要一个企业版的微信公众号(认证过的) 2、一台服务器 企业版的微信公众号原因: 在微信公众平台的接口权限内可以看到,...
  • 微信开发本地调试工具(模拟微信客户端)开源免费微信管家系统(java)源码下载微信部署需要依靠80端口,如何快速有效的调试本地微信开发程序,捷微团队(jeewx-java微信开源系统),采用微信开发调试工具,供本地...
  • 现在每天都可以看到很多微信分享的链接上面有网站或者商家的自定义的分享标题,和分享链接的描述及分享出去的图像,例如下面的分享出去的链接:    上面这个是微信的js-SDK页面分享微信好友在聊天列表中显示的...
  • 微信页面分享到朋友圈、分享朋友等等,默认的是有分享格式的,比如分享给朋友,默认的图标是页面的第一张图片,内容是该页面的url,这个显然有些场景是不满足的。对于挑剔的产品经理一定是会有自己的设计的,比如...
  • 二、配置微信分享的SDK 三、微信分享示例 四、微信分享的结果回调 五、微信分享的踩坑总结 一、申请应用 1、首先到 [ 微信开放平台官网] 申请注册帐号,这些流程就忽略了到官网一看...
  • 本文介绍的只是微信开发中的一个功能,分享。看到网上很多关于微信分享的博客、帖子,说实话,没几篇写的全的,很多都是复制粘贴,介绍的也不全,缺少代码的分析,关键性的代码总是漏一句两句,看着就很难受。所以,...
  • 微信公众平台开发之公众号JSSDK开发是子恒老师《微信公众平台开发》视频教程的第9部。详细讲解了用php开发微信公众号,对微信公众平台中的JSSDK开发。内容包含用JSSDK获取网络状态,地理位置,分享到朋友圈,QQ,...
  • 初次尝试微信公众号的开发,对于学习方法的探索都是来源于网上的博客、问答,对于参差不齐的信息,自己也是有苦说不出,抽出一点时间写点文章,既是对自己的学习总结,也希望给予同是菜鸟的学渣一点帮助。...
  • 微信公众号开发分享接口实现第一步:先登录微信公众平台设置JS接口安全域名("域名不能包含http://")。如图:第二步:配置config接口权限验证首先需要通过access_token 采用http GET方式请求获得jsapi_...
  • 最近项目中的网页通过微信分享朋友或朋友圈等功能出现了无法显示分享图片等信息,后经过排查发现是微信版本升级导致,采用js-sdk完成分享接口,为了快速实现该功能效果,于是我打算通过前台js进行实现来看看分享效果...
  • 微信开发之JSSDK调用

    2016-11-22 17:03:13
    由于项目需要,需要接触微信开发,并要调用微信的JS-SDK里面的接口。 因为经验缺乏,我百度一下关于微信开发的资料,但收集的资料都不尽人意。网上的主流的微信开发是采用PHP开发的,而本人学的Java。所以对PHP微信...
  • 课程讲解了Unity如何接入微信登录 微信分享 微信支付 支付宝支付
  • 微信开发的准备工作完成后就可以开始开发,废话不多说,直接贴代码 一,前端实现 前端的实现微信开放平台已经给出了实现步骤,我们只需要按照其给出的步骤实现就行,微信公众平台 二,后端 ①,Controller层...
  • 微信6.0之后JSSDK的调用,微信分享功能的实现,傻瓜教程
1 2 3 4 5 ... 20
收藏数 99,115
精华内容 39,646