uniapp 分享缩略图过大怎么办_新版本微信下,如何设置分享到朋友圈的缩略图?...
做微信H5的朋友都知道,在过去要设置"分享到朋友圈"的缩略图,是非常简单的一件事情,只需要制作一张300*300的缩略图片(如命名为300.jpg),然后在页面head部分的开头引入微信朋友圈缩略图代码即可。
//其余代码...
这一招本来是屡试不爽的。本人也已经有挺长时间没有做微信中的H5了,直到这两天,因为手头要做一个简单的微信H5,所以拾掇拾掇又用了这招。没想到,这次居然失效了。不管怎么试,分享朋友圈的时候,缩略图都出不来。一直是这么个默认的图标:
然后再去网上看了下,这才发现微信团队在今年3月29号就发了一篇文章《JSSDK自定义分享接口的策略调整》,里面明确说明了:为规范自定义分享链接功能在网页上的使用,自2017年4月25日起,JSSDK“分享到朋友圈”及“发送给朋友”接口,自定义的分享链接,其域名或路径必须与当前页面对应的公众号JS安全域名一致,否则将调用失败。
例如,当前页面是 http://www.abc.com/123,其公众号对应的JS安全域名为 http://www.abc.com 以及 http://www.xyz.com,则分享自定义链接 http://www.abc.com/456 可以成功,分享 http://www.xyz.com/123 或 http://www.def.com/123 均将失败。
对于未接入微信JSSDK或已接入但JSSDK调用失败的网页,被用户分享时,分享卡片将统一使用默认缩略图和标题简介,不允许自定义。
接口完整用法请参考《微信JSSDK说明文档》,请开发者及时完成调整。
好吧。还好我手头服务号和企业号(还没有升级到企业微信)的认证账号都有。我看了下,两者的文档分别在以下地址的“分享接口”部分(其实没啥大区别):
因为手头要推的东西是放在企业号里的,于是以企业号为例,简要说明一下开发过程。
首先,在页面中引入微信的JS-SDK的JS文件。
然后,取accesstoken,以PHP和微信企业号为例(最好存在服务器上,没过期前从缓存文件里取,以避免频繁调用)。如果使用微信服务号的话,API地址和企业号有所不同。
$output = http_post_data("https://qyapi.weixin.qq.com/cgi-bin/gettoken?corpid=******&corpsecret=*****"");$res= json_decode($output, true);$accessToken=$res["access_token"];
接下来,获取jsapi_ticket,同理,最好缓存在服务器上而非每次调用。
$output = http_post_data("https://qyapi.weixin.qq.com/cgi-bin/get_jsapi_ticket?access_token=".$accessToken,"");
$getTicket = json_decode($output, true);
$ticket = $getTicket['ticket'];
然后,获取nonceStr,这个微信已经给出了算法,照着用就行。
function createNonceStr($length = 16) {
$chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
$str = "";
for ($i = 0; $i < $length; $i++) {
$str .= substr($chars, mt_rand(0, strlen($chars) - 1), 1);
}
return $str;
}
$nonceStr = createNonceStr();
然后,取timestamp,即当前时间。
$timestamp = time();
接下来取url值,这个必须是安全域名中设置的域。
$protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://";
$url = "$protocol$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
东西都准备好了,拼到一起后sha编码,然后打成一个包。
$string = "jsapi_ticket=".$ticket."&noncestr=".$nonceStr."×tamp=".$timestamp."&url=".$url;
$signature = sha1($string);
$signPackage = array(
"appId" => "******",
"nonceStr" => $nonceStr,
"timestamp" => $timestamp,
"url" => $url,
"signature" => $signature,
"rawString" => $string
);
PHP的部分完成了,最后就是在Body前用JS注册“分享到朋友圈”这一个API,API的名称为onMenuShareTimeline,在其中注册imgUrl,即可设置好分享缩略图。
wx.onMenuShareTimeline({
imgUrl: '需要的缩略图地址'
});
wx.config({
debug: false,
appId: '<?php echo $signPackage["appId"];?>',
timestamp: <?php echo $signPackage["timestamp"];?>,
nonceStr: '<?php echo $signPackage["nonceStr"];?>',
signature: '<?php echo $signPackage["signature"];?>',
jsApiList: [
'onMenuShareTimeline'
]
});
在上面的代码中,我只设置了imgUrl这一个参数,实际上,还能够在这里设置标题等其他的参数。
wx.onMenuShareTimeline({
title: '', // 分享标题 link: '', // 分享链接,该链接域名必须与当前企业的可信域名一致 imgUrl: '', // 分享图标 success: function () {
// 用户确认分享后执行的回调函数 },
cancel: function () {
// 用户取消分享后执行的回调函数 }
});
现在,刷新一下,再次选择“分享到朋友圈”,就可以看到你设置的缩略图啦。
The End.
uniapp 分享缩略图过大怎么办_新版本微信下,如何设置分享到朋友圈的缩略图?...相关推荐
- 必须进行支持的游戏方可使用此功能_企业微信 3.0上线,开放朋友圈功能,又一风口?...
大家好我是辰由,微信作为一款国民级APP坐拥十几亿活跃用户,工作生活中必不可少,几乎每天都能够用得到,每一次的更新都能够牵动数十亿人的关注. 2019年12月23日企业微信2019年度发布会在广州举行 ...
- 分享到朋友圈没有缩略图?微信自定义标题描述及缩略图最简单完美的办法!...
先看看分享到朋友圈没有缩略图的原因 微信为规范自定义分享链接功能在网页上的使用,自2017年4月25日起,JSSDK"分享到朋友圈"及"发送给朋友"接口,自定义 ...
- 分享到朋友圈没有缩略图?微信自定义标题描述及缩略图最简单完美的办法!
首先看看分享到朋友圈没有缩略图的原因 微信为规范自定义分享链接功能在网页上的使用,自2017年4月25日起,JSSDK"分享到朋友圈"及"发送给朋友"接口,自定 ...
- android相册隐藏拍照按钮,你绝对不知道的4大手机“隐藏”拍照功能!学会100%惊艳朋友圈!...
原标题:你绝对不知道的4大手机"隐藏"拍照功能!学会100%惊艳朋友圈! 作者 | 蚂蚁MaE 编辑 | 智慧 Hello大家早上好鸭~我是智慧 最近我在朋友圈发了一张照片 底下都 ...
- 微信分享朋友圈固定缩略图 php,微信转发或分享朋友圈带缩略图、标题和描述的实现方法...
自己做博客以来,很早之前分享过文章至朋友圈,那个时候分享过去的文章自动获取页面的比例适合的图片为所缩略图: 后期就很少分享至朋友圈, 近来分享文章给朋友后,发现不带缩略图和简介了,觉得这样很不好看,百 ...
- 微信分享链接或网站文章到微信朋友圈,缩略图片不显示解决【老版资料】
如图:分享到朋友圈的链接没有显示图片,简介变成了网址, 如何让左侧那个图片显示尼??? 解决方法: 在我们的网站网页 html代码中的<body>之后(也就是网站的第一张图片)增加< ...
- 分享网站文章到微信朋友圈,缩略图怎么设置
在我们的网站网页 html 代码中的<body>之后增加 <img src="http://wap.qd0931.com/wap/sj_zqth/images/logo.j ...
- 微信分享链接或网站文章到微信朋友圈,缩略图片不显示,该如何解决?
如图:分享到朋友圈的链接没有显示图片,简介变成了网址, 如何让左侧那个图片显示尼??? 解决方法: 在我们的网站网页 html代码中的<body>之后(也就是网站的第一张图片)增加< ...
- python发朋友圈_用 Python 发一个高逼格的朋友圈
原标题:用 Python 发一个高逼格的朋友圈 源 /痴海文 /痴海 分享一个非常骚气的发朋友圈姿势.效果如下. 利用今天教给大家的 python 脚本,把一张图重新分隔成 9 张.上传到朋友圈,最后 ...
最新文章
- Java学习笔记二十五:Java面向对象的三大特性之多态
- Python学习笔记:Io编程序列化
- 关于交集(Intersect)和差集(Except)
- python 创建空的numpy数组_数据分析-NumPy内置函数创建数组
- 超励志!从中专生到教授,他32岁成为国家杰青!
- 中快捷搜索_同事用1分钟,我用半小时,原来是因为这8个Word快捷键,秒杀一切办公技巧...
- IDEA的使用,手把手带你快速入门IDEA
- 曲线图绘制软件_OpenFoam离心泵数值仿真及不同CFD软件间对比
- Centos 6 编译安装 Apache 2.4
- A - 饭卡(动态规划 01背包)
- 数据结构严蔚敏 栈基本操作 C语言实现
- rapidminer java_RapidMiner在Java应用程序中的集成
- 网站速度对谷歌SEO优化的影响
- 【LOJ2542】【PKUWC2018】—随机游走(Min-Max容斥+树形dp+FMT)
- 崔希凡JavaWeb笔记day19-day21(2016年10月4日17:35:51)
- Intel Me更新
- WebRTC -- 添加选择音频输入输出设备功能
- 华中科技大学计算机徐永兵,华中科技大学计算机学院导师及科研方向.doc
- 【FreeSwitch开发实践】外呼网关配置(拨打电话)
- TreeView 入门
热门文章
- pythonscrapy爬虫 崔庆才_Scrapy爬虫(一):专题概要
- 复苏与增长:美通社2020亚太区企业新闻稿发布趋势数字读解
- 专题研究 - 汽车车内声品质评价研究 (一)
- PFNet:Camouflaged Object Segmentation with Distraction Mining——论文简述
- 如何在linux系统上配置必要的服务器环境
- 在解压缩某些文件时出现问题检查计算机上,解压缩超大文件时出现问题
- Fluent报错调试系列(一)
- 解决‘parent.relativePath‘ of POM xxx points at yyy instead of zzz please verify your project structure
- SpringBoot——Thymeleaf常见属性-使用th:each遍历数组、List、Map
- SpringBoot:ERROR: column “***“ is of type numeric but expression is of type character varying