前言

在介绍使用微信定制分享之前，我们先来了解一下什么是定制分享。

访问用户自定义的微信外部链接地址页面，点击红色框与好友或好友分享，如下图所示：

分享后，图文信息显示如下：

我们需要做的是自定义下图所示红色框中的信息。

剪短，然后正式开始定制和分享实战环节！

自定义分享实战

第一步是申请接口测试号，设置JS接口安全域名

请访问以下链接申请接口测试号。点击进入选择接口测试号应用，如下图所示：

或者直接访问：申请测试账号页面如下图所示：

点击登录，扫描要登录的代码，如下图所示：

登录后，如下图所示：

Windows系统在主机文件中配置环回地址的域名

第二步是下载微信网页开发者工具，可以在PC上测试。

点击进入下载页面，如下图所示：

可以一步一步安装。

第三步看微信操作教程，完成代码实现

点击进入微信JS-SDK文档，如下图所示：

JSSDK的使用步骤

步骤1:绑定域名(如上所述)

第二步：介绍JS文件(如何使用将在下面的实战代码中介绍)

第三步：通过配置界面注入权限验证配置(如何使用将在下面的实战代码中介绍)

第四步：通过就绪界面验证成功(详见微信文档)

第五步：通过错误界面处理失败验证(详见微信文档)

上面步骤3中的签名是一个重要参数。要生成它，需要获取jsapi_ticket，而要生成jsapi_ticket，则需要传递access_token。

获取签名的过程如下：

获取access_token，然后根据access_token获取jsapi_ticket。对nonce tr(随机字符串)、有效jsapi_ticket、时间戳(timestamp)、url(当前网页的URL，不包括#及其后续部分)进行排序，例如：nonce str=xjsapi _ ticket=xjtimestamp=xxjurl=xx然后通过sha1加密拼接的四个参数获取签名，可能还是不了解操作流程。

按照以下步骤初始化微信JSSDK配置信息控制器：

@ rest controller @ request mapping(“/weixin”)公共类weixindmocontroller { @ Autowiredprivate WeiXinService WeiXinService；/* * *初始化微信JSSDK配置信息* @ param request * @ param response * @ return * @ throwsexception */@ request mapping('/initwxjssdkconfig info ')public String initWXJSConfig(HttpServletRequest请求，HttpServletResponse响应)引发异常{ String share URL=request . getparameter(' share URL ')；//共享URL mapmap=weiinservice . initjssdkconfig info(share URL)；string JSON=weixinservice . maptojson(map)；返回json}}初始化JSSDK配置信息，包括noncestr(随机字符串)、有效jsapi_ticket、时间戳(时间戳)、shareUrl(当前网页的Url，不包括#及其以下部分)appid(微信官方账号appid)。

/**哎哎哎哎哎jssdk(jssdk)朱拜厄阿列克谢耶维奇阿列克谢耶维奇阿列克谢耶维奇阿列克谢耶维奇阿列克谢耶维奇阿列克谢耶维奇阿列克谢耶维奇阿列克谢耶维奇阿列克谢耶维奇* @ param share URL * @ return * @抛出异常*/public map initjssdkcinginfo(字符串共享URL)抛出异常{ string accesstoken=this。getjssdkacestoken()；字符串jsapiticket=这个。getjssdkjasapticket(访问令牌)；时间戳字符串=长。tostring(系统。当前时间毫秒()/1000):字符串noncestr=uuid。randomuuid().tostring()；字符串签名=这个。buildjssdksningnature(jsa piticket，时间戳，nonceStr，共享URL)；MapString，String map=new HashMapString，String()；map.put('shareUrl '，共享URL)；map.put('jsapi_ticket '，jsapi ticket)；map . put(' non estr，non cestr)；map.put('时间戳'，timestamp)；map.put('签名，签名);map.put('appid '，weixinconfig)。geta ppid())；返回图；}阿宽JSSDK访问_令牌凯伊姆。

公共字符串getjssdkacestoken(){字符串标记=null全球资源定位器(Uniform Resource Locator)字符串=jssdk _ accesstoken。全部替换(' appid '，weiXinConfig.getAppID()).替换所有(' appcret '，weixinconfig)。getappsecret())；数据字符串=postrequestforweixinservice(URL)；贴图=JSON topmap(JSON)；如果(贴图！=null) {token=(字符串)地图。get(' access _ token ')；}返回令牌；}阿宽JSSDK jsapi_ticket凯伊姆。

公共字符串getjssdkjsapiticket(字符串令牌)url字符串=jssdk _ gettket。全部替换(' access _ token '，令牌);数据字符串=postrequestforweixinservice(URL)；贴图=JSON topmap(JSON)；jsapi_ticket字符串=null:如果(贴图！=null){ jsapi _ ticket=(字符串)映射。get(' ticket ')；}返回jsapi _ ticket}诶哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟非现金(李亚明（音译)),苏慕恩苏慕恩jsapi_ticket时间戳（阿云哥)url(嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨嗨网址，哎哎#哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟哟)1826年沙一号贺盛文先生。

/**谢文谢文谢文谢文阿文阿文阿文阿文阿文阿文阿文阿文阿文阿文阿文阿文阿文阿文阿文阿文阿文阿文阿文阿文阿文阿文。* @ param ticket * @ param non crest * @ param URL * @ return * @引发异常*/public static String buildjssdksningnature(String ticket，String timestamp，String nonceStr，string URL)引发异常{ String ordered String=' jsapi _ ticket=' ticket ' non crest=' timestamp '=' URL=' URL；返回sha1(orderedString):} /** * sha1哎哎哎jssdk(jssdk)韩素宁韩素宁韩素宁。* @ param signature * @ param timestamp * @ param nonce * @ return */public static string sha 1(字符串排序字符串)引发异常{ string cihertext=null消息摘要MD=消息摘要。getinstance(' sha-1 ')；字节[]摘要=MD . digest(orderedstring。getbytes())；密文=bytetostr(摘要):返回cihertext。tol power case()；} /**云娥与云娥同在* @ param bytearray * @ return */private静态字符串字节tr(byte[]bytearray){ string strdigest='；for(int I=0)；比泰尔雷。length I){ strdigest=byte tohex str(byte array[I])；}返回strdigest} /**阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云，阿云* @ param MB * @ return */private静态字符串字节tohex str(字节MB){ char[]位数={ ' 0 '，' 1 '，' 2 '，' 3 '，' 4 '，' 5 '，' 6 '，' 7 '，' 8 '，' 9 '，' a '，' b '，' c '，' d '，' e '，' f ' }；char[] tempArr=新char[2]；temparr[0]=数字[(MB 4)0x 0f]；tempArr[1]=数字[MB0x 0f]；字符串s=新字符串(temp arr)；返回s；}鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉，鲁仲吉：

公共字符串maptoposon(map){ gson gson=new gson()；数据字符串=gson.toJson(贴图);返回json}私有映射jsontomap(字符串JSON){ gson gons=new gson()；map=gon。fromjson(JSON，new TypeTokenMap(){}).gettype()；返回图；} private string post request for eixinservice(string getaccessornull){ response entity ring postforentity=rest template。post fore entity(getaccessonnull，null，字符串。类)；数据字符串=postforentity。get body()；返回json}私有字符串getresotformwexinservice(字符串getuserinfourl){响应实体ring postforeentity=rest模板。getfore entity(getuserinfourl。tostring()、string。类)；数据字符串=postforentity。get body()；返回json} wxshare。射流研究…朱庇荫说jssdk(jssdk)朱庇特本阿卜杜勒阿齐兹阿齐兹阿齐兹。魏冄：

//alert(窗口。位置。href。split(' # ')[0])；/***用于获得当前连接全球资源定位器(统一资源定位符)用**//***用户点击分享到微信圈后加载接口接口*******/$.post('/weixin/initwjssdkconfigfo '，{ ' share URL ' :窗口。位置。href。split(' # ')[0]}，function(data，status){ data=eval('(' data ')'))；wx.config({ debug: false，appId: data.appid，timestamp:data.timestamp，nonestr : data。无字符串，签名环：数据。签名，jsaplist :[' checkJsApi '，' onMenuShareTimeline '，' onMenuShareAppMessage '，' onMenuShareQQ '，' onMenuShareWeibo '，})；var share TItle=$(' # wx _ share _ span ').数据(“股份所有权”)；if(！share TItle){ share TItle=$(' TItle ').html()；} var shareImg=$('#wx_share_span ').数据(' shareImg ')；if(！share img){//share img=common。BP()'/m _ images/share img。jpg '；} var共享链接=$(' # wx _ share _ span ').数据('共享链接');if(！共享链接){共享链接=窗口。位置。href。拆分(' # ')[0]；} var shareDesc=$(' # wx _ share _ span ').数据(' shareDesc ')；if(！shareDesc){ shareDesc=$(' meta[name=description]').attr(' content ')；} wx.ready(函数(){ //alert(')准备分享');wx。onmenusharedtimeline({ title : share title，//分享标题链接：共享链接，//分享链接imgUrl : shareImg，//分享图标成功：函数(){ //用户确认分享后执行的回调函数//alert('分享成功');},取消：函数(){ //用户取消分享后执行的回调函数//alert('分享取消');} });//wx。HideOptionMenu()；/***隐藏分享菜单* * * */wx。onmenusharappmessage({ title : share title，//分享标题描述：共享描述，//分享描述link: shareLink，//分享链接，该链接域名或路径必须与当前页面对应的公众号射流研究…安全域名一致imgUrl: shareImg，//分享图标成功：函数(){ //用户确认分享后执行的回调函数}，取消：函数(){ //用户取消分享后执行的回调函数} });wx.onMenuShareQQ({ title:ShareTitle//分享标题描述：共享描述，//分享描述link: shareLink，//分享链接imgUrl: shareImg，//分享图标成功：函数(){ //用户确认分享后执行的回调函数}，取消：函数(){ //用户取消分享后执行的回调函数} });wx。OnMenuShareWeibo({ title : share title，//分享标题描述：共享描述，//分享描述link: shareLink，//分享链接imgUrl: shareImg，//分享图标成功：函数(){ //用户确认分享后执行的回调函数}，取消：函数(){ //用户取消分享后执行的回调函数} });wx。onmenushareqzone({ title :share title//分享标题描述：共享描述，//分享描述link: shareLink，//分享链接imgUrl: shareImg，//分享图标成功：函数(){ //用户确认分享后执行的回调函数}，取消：函数(){ //用户取消分享后执行的回调函数} });});});分享页面该页面需要引入wxShare.js和jweixin-1.2.0.js，并且通过在隐藏的跨度标签上定义自定义分享的内容，具体代码如下：

！DOCTYPE html htmlheartheta charset=' UTF-8 ' title在此插入标题/title script src=' http :/jquery-1 . 8 . 3 . min . js ' type=' text/JavaScript '/script/headsdyspan id=' wx _ share _ span ' style=' display : none '/span script type=' text/JavaScript ' $(文档)。ready(function(){ $(' # wx _ share _ span '))。资料('分享标题'，'表明月教你玩微信。$ ('# wx _ share _ span ')。数据(' sharedesc '，'保证学习！' );//$('#wx_share_span ')。数据(' shareLink '，'/weixinshare . html ')；//$('#wx_share_span ')。数据(' shareImg '，'/banner . jpg ')；});/script script type=' text/JavaScript ' src=' http :3358 RES . wx . QQ.com/open/js/jweixin-1 . 2 . 0 . js '/script script type=' text/JavaScript ' src=' http 3360/wxshare . js '

访问：http://www.guoqianmingyue.com :8090/weixinshare . html不带wxShare.js的测试结果如下：

引入wxShare.js的测试结果如下：

正常情况下，我们通过接口测试号配置测试环境域名。通过以上测试后，我们可以在官方服务号上配置JS接口安全域名。顺便说一下，我们可以用服务号的appid替换项目配置的appid。具体操作如下：

摘要

微信自定义分享的具体操作步骤如下：

定义获取js-SDK配置信息的接口定义页面初始化调用js-SDK配置信息接口的js代码，定义共享接口js代码共享页面引入jweixin-1.2.0.js和调用js-SDK配置信息的JS文件。三步中最重要的一步是第一步：定义获取JS-SDK配置信息的接口，需要获取jsapi_ticket，并与配置信息参数一起生成签名签名。

同样，我们必须阅读微信提供的几个操作文档，因为文档中解释了许多细节。当你通读微信提供的操作文档时，你会觉得这只是一个API调用。

代码示例

具体代码示例参见我的GitHub仓库springbootexamples中的spring-boot-2.x-weixin。

https://github.com/zhuoqianmingyue/springbootexamples

以上就是本文的全部内容。希望对大家的学习有帮助，支持我们。