H5如何分享到朋友圈带图片？（后端C#）

前提：

有微信公众号，在微信公众号下面设置JS接口安全域名，

然后 html 文件放在安全域名对应网站下面。 

---

后端C#：

说明：

1、WxObjType 只是一个枚举而已，因为可能有多个公众号；

2、token 这一步的获取比较简单，请自行查阅相关资料。 token 需要缓存，做中心化共享处理，不要每次调用都新产生一个。

3、jsapi_ticket 其实也有限制，需要缓存，为了代码清晰就不处理了。

如果调用有问题，可以尝试使用：

微信 JS 接口签名校验工具

但以下代码已经实际用过，基本上是没有什么问题的了。

using Newtonsoft.Json;
using NLog;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Net;
using System.Security.Cryptography;
using System.Text;

namespace Util.MgHelper
{
    /// 

    /// 公众号帮助类
    /// 
    public class GzhHelper
    {
        static Logger logger = LogManager.GetCurrentClassLogger();

        /// 

        /// 获取微信分享的配置信息
        /// 
        /// 
        /// 
        /// 
        public static WxGzhShareConfig GetH5ShareChatConfig(WxObjType wxObjType, string url)
        {
            WxObj wxObj = MgConfig.GetWxObj(wxObjType);
            string token = MgHelper.MgUtil.MiniprogramAuth.GetAccessTokeByWxObjType(wxObjType).access_token;
            string jsApiTicket = GetJsApiTicket(token);
            string timestamp = GetTimestamp();
            string nonceStr = GetNonceStr();
            string signature = GenerateSignature(jsApiTicket, nonceStr, timestamp, url);
            var r = new WxGzhShareConfig
            {
                appId = wxObj.AppId,
                timestamp = timestamp,
                nonceStr = nonceStr,
                signature = signature
            };
            return r;
        }

        public static string GetJsApiTicket(string accessToken)
        {
            string url = $"https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token={accessToken}&type=jsapi";
            logger.Info("GetJsApiTicket url=>{0}", url);
            HttpWebRequest request = (HttpWebRequest)WebRequest.Create(url);
            request.Method = "GET";
            request.ContentType = "application/json";
            try
            {
                using (HttpWebResponse response = (HttpWebResponse)request.GetResponse())
                {
                    using (Stream stream = response.GetResponseStream())
                    {
                        using (StreamReader reader = new StreamReader(stream))
                        {
                            string result = reader.ReadToEnd();
                            var r = JsonHelpers.FromJson(result);
                            return r.ticket;
                        }
                    }
                }
            }
            catch (WebException ex)
            {
                // 处理异常
                Console.WriteLine(ex.Message);
                return null;
            }
        }


        // 生成随机字符串
        private static string GetNonceStr()
        {
            const string chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
            var random = new Random();
            var nonceStr = new string(Enumerable.Repeat(chars, 16)
              .Select(s => s[random.Next(s.Length)]).ToArray());

            return nonceStr;
        }

        // 生成当前时间戳
        private static string GetTimestamp()
        {
            long timestamp = (DateTime.Now.ToUniversalTime().Ticks - 621355968000000000) / 10000000;
            return timestamp.ToString();
        }

        // 生成签名
        private static string GenerateSignature(string token, string nonceStr, string timestamp, string url)
        {
            var stringToSign = $"jsapi_ticket={token}&noncestr={nonceStr}×tamp={timestamp}&url={url}";
            logger.Info("GenerateSignature . stringToSign=>{0}", stringToSign);
            var sha1 = SHA1.Create();
            var bytes = Encoding.UTF8.GetBytes(stringToSign);
            var hashBytes = sha1.ComputeHash(bytes);
            var signature = BitConverter.ToString(hashBytes).Replace("-", "").ToLower();

            return signature;
        }
    }//end of class

    public class WxGzhShareConfig
    {
        public string appId { get; set; }

        public string timestamp { get; set; }

        public string nonceStr { get; set; }

        public string signature { get; set; }
    }
}//end of namespace

前端html加上：

1、查询很多资料，都是说需要post，但实际我用 get 也成功了。

2、一般写的是 location.href.split('#')[0]，如果有问题请按这个；

3、输出请在电脑浏览器完成，按F12查看 Console 和 Network 是否有正常输出。

4、wx.config 在未完成时，建议设置为 debug: true，这样有错误才能输出。

注：要为h5新生成一个二维码，扫码后再分享 ，要不然没有效果。