SpringBoot整合微信自定义分享接口，详解（有源文件）

微信公众号关注： Java黑板

目录

1、前言

2、整合步骤说明

3、整合的详细代码（复制即用）

1、前言

很多的项目都做需要微信自定义分享接口，首先就是显得比较好看与能够展示一些网站的详细信息，其次就是可以获取到用户的分享的数据，这就方便对分享的数据进行分析等等。

对接微信自定义分享接口的前提条件：

1、认证的订阅号或认证的服务号

2、备案的域名

3、一台云服务器

效果如下图：


微信聊天窗口的效果图
微信朋友圈的效果图

2、整合步骤说明

官方的api文档链接：

https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html

想要微信JS-SDK能够起作用，首先在公众号配置以下参数：

1、配置IP白名单（即服务器的IP地址）

2、配置JS安全域名（即备案的域名）

公众号中配置的位置如下图：


整合的步骤（方便看懂代码的实现）：

首先通过开发者ID(AppID)与开发者密码(AppSecret)这两个参数我们就能获取到access_token（access_token是公众号的全局唯一接口调用凭据），然后我们再通过这个access_token获得jsapi_ticket（jsapi_ticket是公众号用于调用微信JS接口的临时票据）。通过这个jsapi_ticket参数我们就可以生成JS-SDK权限验证的签名了。

步骤如下图：

注意：access_token与jsapi_ticket的有效时间为2个小时，而且access_token每天的调用次数为2000次，还有就是获取这两个参数需要发送http请求，所以我们无需每次都重新获取，可以用静态变量缓存或者用redis缓存起来，通过定时任务刷新，我这里为了方便演示所以直接用静态变量，与判断是否过期解决。

3、整合的详细代码

后端代码如下（具体的参数需要根据自己的实际填写）下面的代码用到了httpclient依赖与json解析依赖：

package com.heiban.springboot.controller;

import com.heiban.springboot.bean.Wx;

import net.sf.json.JSONObject;

import org.apache.http.HttpEntity;

import org.apache.http.client.methods.CloseableHttpResponse;

import org.apache.http.client.methods.HttpGet;

import org.apache.http.impl.client.CloseableHttpClient;

import org.apache.http.impl.client.HttpClients;

import org.apache.http.util.EntityUtils;

import org.springframework.stereotype.Controller;

import org.springframework.ui.ModelMap;

import org.springframework.web.bind.annotation.RequestMapping;

import java.io.IOException;

import java.security.MessageDigest;

import java.util.Formatter;

import java.util.UUID;

@Controller

public class Index {

private static final String AppID = ""; //开发者ID

private static final String AppSecret = ""; //开发者密码

private static String access_token = ""; //调用接口的凭证 2个小时后就会过期需要重新获取 一天最多获取2千次

private static String jsapi_ticket = ""; //jsapi_ticket的有效时间也是2个小时 获取该参数需要通过access_token

private static Long expireTime = 0L; //记录access_token 与 jsapi_ticket 的过期时间

@RequestMapping("/share")

public String Share (ModelMap model){

String url = "http://域名/具体的路径?附带的参数";//即调用 JS-SDK的网址

Wx wxShare = getWxShare(url);//随机串、签名的时间戳、签名字符串

model.addAttribute("wxShare",wxShare);

return "share";

}

//获取微信分享的重要信息

public Wx getWxShare(String url){//url 即为访问网站的url

Wx wx = new Wx(); //用于保存微信分享所需要的参数

//打开浏览器，创建HTTPClient对象

CloseableHttpClient httpClient = HttpClients.createDefault();

Long nowtime = System.currentTimeMillis();//获取当前的时间戳

//第一步 判断access_token 与 jsapi_ticket是否过期 如果过期了就重新获取

if (expireTime <= nowtime){//如果过期时间小于 当前的时间就证明过期了

//通过appid和appsecret，就可以向微信平台来换取access_token

String token_access_url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid="+Index.AppID+"&secret="+Index.AppSecret;

HttpGet httpGet = new HttpGet(token_access_url);

CloseableHttpResponse response = null;//按回车，发起请求

try {

response = httpClient.execute(httpGet);

//解析响应 判断状态码是否是200

if (response.getStatusLine().getStatusCode()==200){

HttpEntity httpEntity = response.getEntity();//获取响应消息实体

String body = EntityUtils.toString(httpEntity);//获取返回的消息文本

JSONObject jsonObject = JSONObject.fromObject(body);//将消息文本解析成json

String access_token = (String) jsonObject.get("access_token");

Index.access_token = access_token;

}

//第二步 通过access_token，向微信平台索取一个jsapi_ticket

String jsapi_ticket_url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token="+Index.access_token+"&type=jsapi";

httpGet = new HttpGet(jsapi_ticket_url);

response = httpClient.execute(httpGet);

if (response.getStatusLine().getStatusCode()==200){//解析响应 判断状态码是否是200

HttpEntity httpEntity = response.getEntity();//获取响应消息实体

String body = EntityUtils.toString(httpEntity);//获取返回的消息文本

JSONObject jsonObject = JSONObject.fromObject(body);//将消息文本解析成json

String errmsg = (String) jsonObject.get("errmsg");

if(errmsg.trim().equals("ok")){

String jsapi_ticket = (String) jsonObject.get("ticket");

Index.jsapi_ticket = jsapi_ticket;

Index.expireTime = nowtime+5400000; //这里采用的过期时间是90分钟即一个半小时

}

}

} catch (IOException e) {

e.printStackTrace();

}finally {

//关闭资源

try {response.close();} catch (IOException e) {e.printStackTrace();}

try {httpClient.close();} catch (IOException e) {e.printStackTrace();}

}

}

//第三步 获得jsapi_ticket之后，就可以生成JS-SDK权限验证的签名了。

Long timestamp = System.currentTimeMillis()/1000;//用于签名的时间戳 单位为秒

String nonceStr = UUID.randomUUID().toString(); //获得随机串

//注意这里参数名必须全部小写，且必须有序

String string1 = "jsapi_ticket=" + Index.jsapi_ticket + "&noncestr=" + nonceStr + "&timestamp=" + timestamp + "&url=" + url;

String signature = ""; //签名字符串

try {

MessageDigest messageDigest = MessageDigest.getInstance("SHA-1");

messageDigest.reset(); //reset()的必要性只表明getInstance()不进行初始化.

messageDigest.update(string1.getBytes("UTF-8"));

Formatter formatter = new Formatter();

for (byte b : messageDigest.digest()) formatter.format("%02x", b);//字节数组转换为十六进制字符串

signature = formatter.toString();//签名字符串

formatter.close();

}catch (Exception e){}

wx.setNonceStr(nonceStr);//随机串

wx.setTimestamp(timestamp.toString());//签名的时间戳

wx.setSignature(signature);//签名字符串

return wx;

}

}

前端代码如下（具体的参数需要根据自己的实际填写）：

<!DOCTYPE html>

<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>

<meta charset="UTF-8">

<title>关注微信公众号：Java黑板</title>

</head>

<body>

<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>

<script type="text/javascript">

wx.config({

debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。

appId: ' ', // 必填，公众号的唯一标识

timestamp: '[[${wxShare.timestamp}]]', // 必填，生成签名的时间戳

nonceStr: '[[${wxShare.nonceStr}]]', // 必填，生成签名的随机串

signature: '[[${wxShare.signature}]]',// 必填，签名

jsApiList: [

'updateAppMessageShareData'

,'updateTimelineShareData'

] // 必填，需要使用的JS接口列表

});

wx.ready(function () { //需在用户可能点击分享按钮前就先调用

wx.updateAppMessageShareData({//自定义“分享给朋友”及“分享到QQ”按钮的分享内容（1.4.0）

title: 'Java黑板', // 分享标题

desc: '关注微信公众号：Java黑板', // 分享描述

link: location.protocol+"//"+location.hostname+'/', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致

imgUrl: '', // 分享图标的链接

success: function () {

// 调用成功

}

});

wx.updateTimelineShareData({//自定义“分享到朋友圈”及“分享到QQ空间”按钮的分享内容（1.4.0）

title: 'Java黑板', // 分享标题

link: location.protocol+"//"+location.hostname+'/', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致

imgUrl: '', // 分享图标的链接

success: function () {

// 调用成功

}

});

});

</script>

</body>

</html>

回复获取资源

关注微信公众号回复 微信分享

获取SpringBoot整合微信自定义分享接口源码

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
  • 人面猴
    序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
    沈念sama阅读 217,542评论 6赞 504
  • 死咒
    序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
    沈念sama阅读 92,822评论 3赞 394
  • 救了他两次的神仙让他今天三更去死
    文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
    开封第一讲书人阅读 163,912评论 0赞 354
  • 道士缉凶录：失踪的卖姜人
    文/不坏的土叔 我叫张陵，是天一观的道长。 经常有香客问我，道长，这世上最难降的妖魔是什么？ 我笑而不...
    开封第一讲书人阅读 58,449评论 1赞 293
  • 港岛之恋（遗憾婚礼）
    正文 为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
    茶点故事阅读 67,500评论 6赞 392
  • 恶毒庶女顶嫁案：这布局不是一般人想出来的
    文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
    开封第一讲书人阅读 51,370评论 1赞 302
  • 城市分裂传说
    那天，我揣着相机与录音，去河边找鬼。 笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。 我是一名探鬼主播，决...
    沈念sama阅读 40,193评论 3赞 418
  • 双鸳鸯连环套：你想象不到人心有多黑
    文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
    开封第一讲书人阅读 39,074评论 0赞 276
  • 万荣杀人案实录
    序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
    沈念sama阅读 45,505评论 1赞 314
  • 护林员之死
    正文 独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,722评论 3赞 335
  • 白月光启示录
    正文 我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,841评论 1赞 348
  • 活死人
    序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
    沈念sama阅读 35,569评论 5赞 345
  • 日本核电站爆炸内幕
    正文 年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
    茶点故事阅读 41,168评论 3赞 328
  • 男人毒药：我在死后第九天来索命
    文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,783评论 0赞 22
  • 一桩弑父案，背后竟有这般阴谋
    文/苍兰香墨 我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,918评论 1赞 269
  • 情欲美人皮
    我被黑心中介骗来泰国打工， 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。 一个月前我还...
    沈念sama阅读 47,962评论 2赞 370
  • 代替公主和亲
    正文 我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
    茶点故事阅读 44,781评论 2赞 354