zoukankan      html  css  js  c++  java
  • 微信开发笔记-调用自定义分享接口

    文章来自:http://www.cnblogs.com/ysyn/archive/2015/07/23/4665897.html

    引言:

      工作中开发微信网站,简称微网站。由于微网站的分享内容是系统自动选取的当前网址,客户需要改变分享的内容,即点击屏幕右上角的分享按钮,选择发送给朋友和发送到朋友圈,其中的内容和图片需要自定义。于是查找文档微信JS-SDK说明文档一文和网站众多高手的经验,大体知道了调用的步骤,但是具体如何调用才能成功却是不了解的。经过一番试验,终于成功调用发送朋友和发送到朋友圈两个接口,此处记录调用的具体过程。

    步骤一:引用js文件。

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

    步骤二:通过config接口注入权限验证配置

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

    网上众多网友也是这样写的,但是具体如果配却谈之甚少,接下来介绍本文是如何调用的。

    debug和appId,都不用说,很简单。

    timespan生成签名的时间戳:

    复制代码
    /// <summary>
            /// 生成时间戳
            /// 从 1970 年 1 月 1 日 00:00:00 至今的秒数,即当前的时间,且最终需要转换为字符串形式
            /// </summary>
            /// <returns></returns>
            public string getTimestamp()
            {
                TimeSpan ts = DateTime.UtcNow - new DateTime(1970, 1, 1, 0, 0, 0, 0);
                return Convert.ToInt64(ts.TotalSeconds).ToString();
            }
    复制代码

    nonceStr生成签名的随机串:

    复制代码
    /// <summary>
            /// 生成随机字符串
            /// </summary>
            /// <returns></returns>
            public string getNoncestr()
            {
                Random random = new Random();
                return MD5Util.GetMD5(random.Next(1000).ToString(), "GBK");
            }
    复制代码
     View Code

    singature签名的生成比较麻烦。

    首先生成获取access_token(有效期7200秒,开发者必须在自己的服务全局缓存access_token)

    复制代码
    public string Getaccesstoken()
            {
                string appid = System.Configuration.ConfigurationManager.AppSettings["WXZjAppID"].ToString();
                string secret = System.Configuration.ConfigurationManager.AppSettings["WXZjAppSecret"].ToString();
                string urljson = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=" + appid + "&secret=" + secret;
                string strjson = "";
                UTF8Encoding encoding = new UTF8Encoding();
                HttpWebRequest myRequest =
                (HttpWebRequest)WebRequest.Create(urljson);
                myRequest.Method = "GET";
                myRequest.ContentType = "application/x-www-form-urlencoded";
                HttpWebResponse response;
                Stream responseStream;
                StreamReader reader;
                string srcString;
                response = myRequest.GetResponse() as HttpWebResponse;
                responseStream = response.GetResponseStream();
                reader = new System.IO.StreamReader(responseStream, Encoding.UTF8);
                srcString = reader.ReadToEnd();
                reader.Close();
                if (srcString.Contains("access_token"))
                {
                    //CommonJsonModel model = new CommonJsonModel(srcString);
                    HP.CPS.BLL.WeiXin.CommonJsonModel model = new BLL.WeiXin.CommonJsonModel(srcString);
                    strjson = model.GetValue("access_token");
                    Session["access_tokenzj"] = strjson;
                }
                return strjson;
            }
    复制代码
     View Code

    接着获取jsapi_ticket:

    用第一步拿到的access_token 采用http GET方式请求获得jsapi_ticket(有效期7200秒,开发者必须在自己的服务全局缓存jsapi_ticket)

    复制代码
    public string Getjsapi_ticket()
            {
                string accesstoken = (string)Session["access_tokenzj"];
                string urljson = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=" + accesstoken + "&type=jsapi";
                string strjson = "";
                UTF8Encoding encoding = new UTF8Encoding();
                HttpWebRequest myRequest = (HttpWebRequest)WebRequest.Create(urljson);
                myRequest.Method = "GET";
                myRequest.ContentType = "application/x-www-form-urlencoded";
                HttpWebResponse response = myRequest.GetResponse() as HttpWebResponse;
                Stream responseStream = response.GetResponseStream();
                StreamReader reader = new System.IO.StreamReader(responseStream, Encoding.UTF8);
                string srcString = reader.ReadToEnd();
                reader.Close();
                if (srcString.Contains("ticket"))
                {
                    HP.CPS.BLL.WeiXin.CommonJsonModel model = new BLL.WeiXin.CommonJsonModel(srcString);
                    strjson = model.GetValue("ticket");
                    Session["ticketzj"] = strjson;
                }
    
                return strjson;
            }
    复制代码

    最后生成signature:

    复制代码
    public string Getsignature(string nonceStr, string timespanstr)
            {
                if (Session["access_tokenzj"] == null)
                {
                    Getaccesstoken();
                }
                if (Session["ticketzj"] == null)
                {
                    Getjsapi_ticket();
                }
    
                string url = Request.Url.ToString();
    
                string str = "jsapi_ticket=" + (string)Session["ticketzj"] + "&noncestr=" + nonceStr +
                    "&timestamp=" + timespanstr + "&url=" + url;// +"&wxref=mp.weixin.qq.com";
                string singature = SHA1Util.getSha1(str);
                string ss = singature;
                return ss;
            }
    复制代码
     View Code

    本文调用实例:

    复制代码
    <script type="text/javascript">
            wx.config({
                debug: false,
                appId: '<%=corpid %>',
                timestamp: <%=timestamp%>,
                nonceStr: '<%=nonceStr%>',
                signature: '<%=signature %>',
                jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage']
            });
        </script>
    复制代码

    步骤三:调用接口

    在进行完第二步的调用后,步骤三就显得非常轻巧了。

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

    本文的调用实例是:
    复制代码
    <script type="text/javascript" >
        wx.ready(function () {
            wx.onMenuShareAppMessage({
                title: '<%=shareTitle %>',
                desc: '<%=shareContent %>',
                link: '<%=currentUrl %>',
                imgUrl: '<%=shareImageUrl %>'
            });
    
            wx.onMenuShareTimeline({
                title: '<%=shareContent %>',
                link: '<%=currentUrl %>',
                imgUrl: '<%=shareImageUrl %>'
            });
        })     
    </script>
    复制代码

    本文基本上总结到此处。

    易出现的问题:

    1、检查后台是否设置:右上角公众号名称--功能设置--JS接口安全域名

    2、检查代码里的appid和公众号后台的id是否一致

    3、图片的调用地址是绝对路径(相对路径好像不行)。



    引用文档:
    微信JS-SDK说明文档

    补充:

    微信网页中长按二维码图片能弹出菜单是怎么实现的?

    、、
    Lyn小娜签名:聪明出于勤奋,天才在于积累。
  • 相关阅读:
    配置文件中文件重复
    大型网站技术架构02
    2018.12.26-12.30第一周毕设计划
    软件架构模式-分层架构II
    软件架构模式-分层架构
    echarts实现中国地图数据展示
    Python数据分析入门(一)——了解Python下的函数包
    Python学习笔记(二)
    Python学习笔记(一)
    Echarts的简单使用
  • 原文地址:https://www.cnblogs.com/lynna/p/6925783.html
Copyright © 2011-2022 走看看