前言

哎呀,为啥人家分享的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自定义标题描述和图片相关推荐

  1. html分享标题描述图片尺寸,微信分享网页时自定义标题、描述和图片

    用微信打开一个网页,选择右上角的"发送给朋友"后,收到的消息是这样的: 而为了推广效果,我们更希望能自定义标题.描述和图片,效果如下图: 实现工具:GetwxLink 联系QQ:6 ...

  2. h5页面分享朋友,朋友圈设置缩略图,自定义标题,描述!

    #h5页面分享朋友,朋友圈设置缩略图,自定义标题,描述! //要实现显示图片与标题必须调用微信接口, //注意点:1.必须要把跳转的页面绑定到微信的接口域名里://2.后台要进行设置签名算法,获取签名 ...

  3. h5 修改title 微信_微信分享H5自定义标题描述和图片

    前言 哎呀,为啥人家分享的H5页面这么绚丽,有头有尾有妹子,唯独自己的又老有丑又难啃,自己都看不下去,千万不要给领导看见.然而,最终还是领导发话了这个必须得改. 永远不要指望微信给的案例能让你迅速解决 ...

  4. 如何在微信自定义链接分享内容,图文链接xml卡片生成代码,制作微信卡片实现自定义标题,描述,缩列图以供转发

    问题背景 微信现在是众多公司营销的重点.遍布朋友圈和消息群组里的html5各位可能也是天天见了, 如图,像这种吓人的标题党的风格 如何制作QQ和微信图文链接, 是这个营销手段的必要技术问题. 考虑一下 ...

  5. c# 文章分享微信朋友圈自定义标题、摘要、缩略图

    微信升级后需要通过接入微信公众号才行,记录下. 一.登录微信公众号设置-功能设置-JS接口安全域名,设置网站的域名,可以多个 二.前端配置:测试阶段将wx.config中的debug设置为true,页 ...

  6. 有什么软件可以修改图片尺寸?分享给你这款图片改大小工具

    现在很多平台都有定制商品的服务,比如把自己宠物或者喜欢的艺人照片印到抱枕.水杯上,这时候我们提供的图片尺寸大小必须要复合规定,要是我们没有合适的图片怎么办?怎么修改图片的长宽尺寸呢?接下来小编就分享一 ...

  7. 王者荣耀头像太小怎么办?调整图片尺寸工具分享

    给王者荣耀换头像的时候,会发现上传图片之后特别模糊,其实是因为图片尺寸太大,系统自动缩小导致的,怎么让我们的头像大小合适又清晰呢?其实只要使用图片改大小(在线修改图片尺寸大小工具-压缩图)工具,把要上 ...

  8. android 微信分享 源码,记录Android微信分享功能的吐槽与思考

    在App内潜入分享到微信好友或朋友圈的功能想必大家已经屡见不鲜了,比如Android分享一个网页信息(URL)到微信客户端的代码: /** * 微信分享:分享网页 * @param context * ...

  9. php微信分享接口调用,TP5的微信分享接口和JSSDK使用

    TP5的微信分享接口和JSSDK使用 项目开发中,经常会用到微信分享接口,使用官方提供的SDK可以实现微信分享到朋友圈或者好友以后,能够正常显示页面的Logo图片.标题和描述内容,而不仅仅只是简单粗暴 ...

最新文章

  1. HTML的标签描述15
  2. 独家 | 经验教训分享:我的第一个机器学习项目
  3. Python回顾与整理1:Python基础
  4. Linux的tree
  5. Hive旺旺讨论(关于mapjoin)
  6. mysql无法添加或更新子行_MySQL错误1452-无法添加或更新子行:外键约束失败?
  7. 小程序入门学习05--幻灯片、页面生命周期
  8. 互联网内卷之谁也别想好!
  9. matlab单行注释,matlab注释
  10. 如何将苹方字体写入html,html苹方字体
  11. 俄罗斯地名 中文 英文 俄文
  12. 软件测试方法和技术知识点有哪些?
  13. 19种电压转换的电路设计方式
  14. Android实现App版本自动更新
  15. 简化3D渲染和动画制作丨上海道宁为您带来强大的3D渲染软件——KeyShot
  16. 阿里云服务器的windows和linux系统怎么选
  17. Java 泛型是如何工作的?类型擦除是什么?
  18. Activiti7工作流介绍及使用
  19. 给一个喝酒青年的公开状
  20. Linux安装redis并设置开机自启以及利用小红桶连接(命令行方式)

热门文章

  1. 虚拟服务器部署环境,如何在虚拟服务器环境部署SR-IOV?
  2. Convolutional Networks for Image Semantic Segmentation
  3. 热璞数据库HotDB跨JOIN功能介绍
  4. 电商小程序有什么优势?
  5. Julien Nioche谈Apache Nutch 2功能和产品路线图
  6. 用Python和Tableau对母婴商品销量进行数据分析(附Python源码及Tableau文件)
  7. cadence版图设计步骤(包括drc和lvs)
  8. ASP.NET Core WebAPI JWT Bearer 认证失败返回自定义数据 Json
  9. 战争磨盘九: 战争潜力
  10. 营销qq会话在线聊天代码(也可以匿名)