微信分享调用JS -- c#篇

男娘i 2022-06-12 05:47 302阅读 0赞

**1.前端**

**　　1.1 导入微信端的JS**

如果你的网址是http，则地址为  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

**　　1.2 调用后台，获取需要的配置**

调用后台，需要的配置为：appId、timestamp、nonceStr、signature

appId为公众号的appId，timestamp为后台返回的时间戳，nonceStr为后台生成的随机字符串，signature为后台生成的签名。

**　1.3 调用完后台后，加载微信分享配置**

![复制代码][copycode.gif]

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

![复制代码][copycode.gif]

**　　1.4 再检测JS接口列表**

![复制代码][copycode.gif]

wx.checkJsApi({
            jsApiList: ['onMenuShareTimeline','onMenuShareAppMessage'], // 需要检测的JS接口列表
            success: function(res) {
                // 以键值对的形式返回，可用的api值true，不可用为false
                // 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
            }
        });

![复制代码][copycode.gif]

**　1.5 wx read，分享配置**

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

ready函数中包含写一些分享配置信息。如分享到朋友圈、分享给朋友的配置信息。

![复制代码][copycode.gif]

1 　　wx.ready(function(){
     2         //分享到朋友圈
     3         wx.onMenuShareTimeline({
     4             title:'分享标题', // 分享标题
     5             link: 'http://'+location.host+'/GFMain/GetIntoFundStartWithShare?pid='+GetQueryString('pid')||'', // 分享链接
     6             imgUrl: 'http://'+location.host+'/img/share.png', // 分享图标
     7             success: function () {
     8                 // 用户确认分享后执行的回调函数
     9             },
    10             cancel: function () {
    11                 // 用户取消分享后执行的回调函数
    12             }
    13         });
    14 
    15         //分享给朋友
    16         wx.onMenuShareAppMessage({
    17             title:'分享标题', // 分享标题
    18             desc: '分享描述', // 分享描述
    19             link: 'http://'+location.host+'/xxx/', // 分享链接
    20             imgUrl: 'http://'+location.host+'/img/share.png', // 分享图标
    21             type: 'link', // 分享类型,music、video或link，不填默认为link
    22             dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
    23             success: function () {
    24                 // 用户确认分享后执行的回调函数
    25             },
    26             cancel: function () {
    27                 // 用户取消分享后执行的回调函数
    28             }
    29         });
    30     });

![复制代码][copycode.gif]

**　　1.6 错误回调**

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

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

**2.后端**

**　　2.1 前端调用后端**

在上面的1.2中，前端开始调用后端，后端获取前端的参数为：前端当前的整个url，包括参数（包括参数）。例如：http://www.cjt.com/alunchen?pid=xxx&home=1

这里需要注意的是参数名字全部最好是小写，大写会自定义分享不了。

**　　2.2 获取ticket**

首先要获取ticket，因为ticket主要是我们从微信获取的，其他返回给前端的参数都是我们从ticket之上在做一些数据处理。所以，ticket是所有返回数据的根本。

通过访问微信的API获取token，获取ticket之前要首先获取token，因为ticket获取要传一个token给微信。

![复制代码][copycode.gif]

// 获取Token
            public static string GetToken(string appid, string secret)
            {
                Log.Info("进入GetToken");
                string strJson = RequestUrl(string.Format("https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid={0}&secret={1}", appid, secret));
                Log.Info(string.Format("strJson：{0}", strJson));
    
                return CPublicMethod.GetJsonValue(strJson, "access_token");
            }
    
            //公共方法，request网络获取
            public static string RequestUrl(string url, string method)
            {
                // 设置参数
                HttpWebRequest request = WebRequest.Create(url) as HttpWebRequest;
                CookieContainer cookieContainer = new CookieContainer();
                request.CookieContainer = cookieContainer;
                request.AllowAutoRedirect = true;
                request.Method = method;
                request.ContentType = "text/html";
                request.Headers.Add("charset", "utf-8");
    
                //发送请求并获取相应回应数据
                HttpWebResponse response = request.GetResponse() as HttpWebResponse;
                //直到request.GetResponse()程序才开始向目标网页发送Post请求
                Stream responseStream = response.GetResponseStream();
                StreamReader sr = new StreamReader(responseStream, Encoding.UTF8);
                //返回结果网页（html）代码
                string content = sr.ReadToEnd();
                return content;
            }    
    
            //公共方法，获取Json
            public string GetJsonValue(string jsonStr, string key)
            {
                string result = string.Empty;
                if (!string.IsNullOrEmpty(jsonStr))
                {
                    key = "\"" + key.Trim('"') + "\"";
                    int index = jsonStr.IndexOf(key) + key.Length + 1;
                    if (index > key.Length + 1)
                    {
                        //先截逗号，若是最后一个，截“｝”号，取最小值
                        int end = jsonStr.IndexOf(',', index);
                        if (end == -1)
                        {
                            end = jsonStr.IndexOf('}', index);
                        }
    
                        result = jsonStr.Substring(index, end - index);
                        result = result.Trim(new char[] { '"', ' ', '\'' }); //过滤引号或空格
                    }
                }
                return result;
            }

![复制代码][copycode.gif]

通过上面的返回的token获取ticket

![复制代码][copycode.gif]

1        //获取ticket
     2         public string getJsApiTicket(string appid, string appSecret)
     3         {
     4 
     5             //这里开始从微信API获取ticket
     6             string token = GetToken(appid, appSecret);
     7             string url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=" + token + "";
     8             Jsapi api = JsonConvert.DeserializeObject<Jsapi>(httpGet(url));
     9             string ticket = api.ticket;
    10             return ticket;
    11         }
    12 
    13      //公共方法，发起一个http请球，返回值  
    14         private string httpGet(string url)
    15         {
    16             try
    17             {
    18                 WebClient MyWebClient = new WebClient();
    19                 MyWebClient.Credentials = CredentialCache.DefaultCredentials;//获取或设置用于向Internet资源的请求进行身份验证的网络凭据  
    20                 Byte[] pageData = MyWebClient.DownloadData(url); //从指定网站下载数据  
    21                 string pageHtml = System.Text.Encoding.Default.GetString(pageData);  //如果获取网站页面采用的是GB2312，则使用这句              
    22 
    23                 return pageHtml;
    24             }
    25 
    26 
    27             catch (WebException webEx)
    28             {
    29                 Console.WriteLine(webEx.Message.ToString());
    30                 return null;
    31             }
    32         }

![复制代码][copycode.gif]

备注：这里需要注意的是，由于获取ticket的失效时间为7200秒（目前来说），所以我们每次获取到的ticket都要保持在数据库，等到ticket超过7200秒时再获取一次。我们这里设计的数据库有两个字段：ticket、ticket\_expires。ticket为ticket字符串值，ticket\_expires为失效时间。

**　　　　2.3 返回时间戳、随机字符串、签名、appid**

![复制代码][copycode.gif]

string jsapiTicket = getJsApiTicket(appid, appSecret);
                // 返回时间戳
                string timestamp = Convert.ToString(ConvertDateTimeInt(DateTime.Now));
                // 返回创建随机字符串
                string nonceStr = createNonceStr();
                // 返回签名signature
                string rawstring = "jsapi_ticket=" + jsapiTicket + "&noncestr=" + nonceStr + "&timestamp=" + timestamp + "&url=" + pathurl + "";
                string signature = SHA1_Hash(rawstring);
                // 返回的appid
                string appid = "xxx";    
    
    
            //创建随机字符串  
            public string createNonceStr()
            {
                int length = 16;
                string chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
                string str = "";
                Random rad = new Random();
                for (int i = 0; i < length; i++)
                {
                    str += chars.Substring(rad.Next(0, chars.Length - 1), 1);
                }
                return str;
            }
    
    
            public string SHA1_Hash(string str_sha1_in)
            {
                SHA1 sha1 = new SHA1CryptoServiceProvider();
                byte[] bytes_sha1_in = System.Text.UTF8Encoding.Default.GetBytes(str_sha1_in);
                byte[] bytes_sha1_out = sha1.ComputeHash(bytes_sha1_in);
                string str_sha1_out = BitConverter.ToString(bytes_sha1_out);
                str_sha1_out = str_sha1_out.Replace("-", "").ToLower();
                return str_sha1_out;
            }

![复制代码][copycode.gif]

*详细请看微信官方说明：*

*http://qydev.weixin.qq.com/wiki/index.php?title=WeixinJS%E6%8E%A5%E5%8F%A3*

[copycode.gif]: /images/20220612/b885d4f3ab62489da56a182b1fdab87d.png