html分享标题描述图片尺寸,微信分享H5自定义标题描述和图片
前言
哎呀,为啥人家分享的H5页面这么绚丽,有头有尾有妹子,唯独自己的又老有丑又难啃,自己都看不下去,千万不要给领导看见。然而,最终还是领导发话了这个必须得改。
永远不要指望微信给的案例能让你迅速解决问题,打开一看你会发现都TM是PHP的DEMO,Java的代码那叫一个惨啊。
效果展示
来、来、来,我们先尝试先跟朋友拉一个仇恨。
啧、啧、啧,然后再跟朋友圈拉仇恨,可别像我这样藏起来自己玩。
开发环境SpringBoot 1.5.10
JDK 7
Tomcat 8
Nginx
备案域名
认证公众号
注意事项必须是认证公众号,订阅号是没有接口分享权限滴
配置IP白名单,基本配置-公众号开发信息-IP白名单
备案域名需要在公众号后台授权认证,公众号设置-功能设置-JS接口安全域名
代码案例
本来想把记仇前后端以及微信分享认证上传到码云,想想天色已晚,有需要的直接联系我吧,或者抽空上传。
前端代码,处理分享逻辑:
var jssdk = null;
var data = {'href':location.href};
$.ajax({
url:'/signature',
type: 'POST',
async:false,
data:data,
success:function(result){
jssdk = result;
},
error:function(){
}
});
// 配置功能
wx.config({
debug: false,
appId: jssdk.appId,
timestamp: parseInt(jssdk.timestamp),
nonceStr: jssdk.nonceStr,
signature: jssdk.signature,
jsApiList: [
"onMenuShareTimeline",//分享给好友
"onMenuShareAppMessage"//分享到朋友圈
]
});
wx.ready(function () {
wx.onMenuShareTimeline({
title: "今天这个仇先记下来", // 分享标题
desc: " 主角们的记仇表情包,如果谁要不带你打游戏,你就挑一张发他",
link: location.href, // 分享链接
imgUrl: "http://jichou.52itstyle.com/jichou.png", // 分享图标
success: function () {
//alert("成功");
},
cancel: function () {
// alert("失败")
}
});
wx.onMenuShareAppMessage({
title: "今天这个仇先记下来", // 分享标题
desc: " 主角们的记仇表情包,如果谁要不带你打游戏,你就挑一张发他",
link: location.href, // 分享链接
imgUrl: "http://jichou.52itstyle.com/jichou.png", // 分享图标
success: function () {
//alert("成功");
},
cancel: function () {
//alert("失败")
}
});
});
基本的WechatController,获取签名:@Controller
@RequestMapping
public class WechatController {
private static final Logger logger = LoggerFactory.getLogger(WechatController.class);
@RequestMapping(value="index.html",method=RequestMethod.GET)
public String index() {
return "index";
}
@RequestMapping(value="signature",method=RequestMethod.POST)
public @ResponseBody Map signature(String href) {
logger.info("获取signature");
Map map = WxUtil.getSign(href);
return map;
}
}
然后就是一些获取Ticket、Token、计算失效时间以及签名认证等等,代码很长这里就不一一罗列了。
html分享标题描述图片尺寸,微信分享H5自定义标题描述和图片相关推荐
- html分享标题描述图片尺寸,微信分享网页时自定义标题、描述和图片
用微信打开一个网页,选择右上角的"发送给朋友"后,收到的消息是这样的: 而为了推广效果,我们更希望能自定义标题.描述和图片,效果如下图: 实现工具:GetwxLink 联系QQ:6 ...
- h5页面分享朋友,朋友圈设置缩略图,自定义标题,描述!
#h5页面分享朋友,朋友圈设置缩略图,自定义标题,描述! //要实现显示图片与标题必须调用微信接口, //注意点:1.必须要把跳转的页面绑定到微信的接口域名里://2.后台要进行设置签名算法,获取签名 ...
- h5 修改title 微信_微信分享H5自定义标题描述和图片
前言 哎呀,为啥人家分享的H5页面这么绚丽,有头有尾有妹子,唯独自己的又老有丑又难啃,自己都看不下去,千万不要给领导看见.然而,最终还是领导发话了这个必须得改. 永远不要指望微信给的案例能让你迅速解决 ...
- 如何在微信自定义链接分享内容,图文链接xml卡片生成代码,制作微信卡片实现自定义标题,描述,缩列图以供转发
问题背景 微信现在是众多公司营销的重点.遍布朋友圈和消息群组里的html5各位可能也是天天见了, 如图,像这种吓人的标题党的风格 如何制作QQ和微信图文链接, 是这个营销手段的必要技术问题. 考虑一下 ...
- c# 文章分享微信朋友圈自定义标题、摘要、缩略图
微信升级后需要通过接入微信公众号才行,记录下. 一.登录微信公众号设置-功能设置-JS接口安全域名,设置网站的域名,可以多个 二.前端配置:测试阶段将wx.config中的debug设置为true,页 ...
- 有什么软件可以修改图片尺寸?分享给你这款图片改大小工具
现在很多平台都有定制商品的服务,比如把自己宠物或者喜欢的艺人照片印到抱枕.水杯上,这时候我们提供的图片尺寸大小必须要复合规定,要是我们没有合适的图片怎么办?怎么修改图片的长宽尺寸呢?接下来小编就分享一 ...
- 王者荣耀头像太小怎么办?调整图片尺寸工具分享
给王者荣耀换头像的时候,会发现上传图片之后特别模糊,其实是因为图片尺寸太大,系统自动缩小导致的,怎么让我们的头像大小合适又清晰呢?其实只要使用图片改大小(在线修改图片尺寸大小工具-压缩图)工具,把要上 ...
- android 微信分享 源码,记录Android微信分享功能的吐槽与思考
在App内潜入分享到微信好友或朋友圈的功能想必大家已经屡见不鲜了,比如Android分享一个网页信息(URL)到微信客户端的代码: /** * 微信分享:分享网页 * @param context * ...
- php微信分享接口调用,TP5的微信分享接口和JSSDK使用
TP5的微信分享接口和JSSDK使用 项目开发中,经常会用到微信分享接口,使用官方提供的SDK可以实现微信分享到朋友圈或者好友以后,能够正常显示页面的Logo图片.标题和描述内容,而不仅仅只是简单粗暴 ...
最新文章
- HTML的标签描述15
- 独家 | 经验教训分享:我的第一个机器学习项目
- Python回顾与整理1:Python基础
- Linux的tree
- Hive旺旺讨论(关于mapjoin)
- mysql无法添加或更新子行_MySQL错误1452-无法添加或更新子行:外键约束失败?
- 小程序入门学习05--幻灯片、页面生命周期
- 互联网内卷之谁也别想好!
- matlab单行注释,matlab注释
- 如何将苹方字体写入html,html苹方字体
- 俄罗斯地名 中文 英文 俄文
- 软件测试方法和技术知识点有哪些?
- 19种电压转换的电路设计方式
- Android实现App版本自动更新
- 简化3D渲染和动画制作丨上海道宁为您带来强大的3D渲染软件——KeyShot
- 阿里云服务器的windows和linux系统怎么选
- Java 泛型是如何工作的?类型擦除是什么?
- Activiti7工作流介绍及使用
- 给一个喝酒青年的公开状
- Linux安装redis并设置开机自启以及利用小红桶连接(命令行方式)
热门文章
- 虚拟服务器部署环境,如何在虚拟服务器环境部署SR-IOV?
- Convolutional Networks for Image Semantic Segmentation
- 热璞数据库HotDB跨JOIN功能介绍
- 电商小程序有什么优势?
- Julien Nioche谈Apache Nutch 2功能和产品路线图
- 用Python和Tableau对母婴商品销量进行数据分析(附Python源码及Tableau文件)
- cadence版图设计步骤(包括drc和lvs)
- ASP.NET Core WebAPI JWT Bearer 认证失败返回自定义数据 Json
- 战争磨盘九: 战争潜力
- 营销qq会话在线聊天代码(也可以匿名)