微信自定义分享链接信息
时间:2023-04-05 16:34:49
HTML5
Q:在微信中与好友分享网页链接时,总会看到一张可点击的卡片,里面有链接相关信息,上面有链接内容的标题、描述和图片。前端是否可以不借助其他工具自行架设?具体如何在页面中编写代码来控制在微信中分享页面时显示的相关信息?答:微信内部分享的链接(具体操作为:浏览页面时,使用右上角三个点的菜单按钮调出下方菜单并分享页面):标题可以链接到信息,标题会自动获取链接页面的
标签中的标题信息:微信的机制是获取页面的第一个300*300上图可见:图片大小在300px*300px以上。为了更好的效果,最好是方形的;设置为隐藏。
说明desc无法链接到信息。标题下方是网页的描述。这段内容在微信中默认显示为网页链接地址:如https://www.google.com/以及前端人员无法在页面中独立编写html、js等修改,只能借助微信提供的JS-SDK实现描述内容的自定义微信。具体实现方法请继续阅读。PS:如果是QQ分享网页,可以通过
标签设置描述内容:
Q:如何使用微信提供的JS-SDK自定义分享网页时显示的信息(标题、描述、图片)?答:官方文档:微信JS-SDK文档按照官方步骤即可。我整理出来放到页面的代码如下:注意:wx.config需要一些敏感信息,后台人员最好计算输出,所以整个项目代码都放在后台;我把下面的代码放在html里,让后台可以在里面写代码,后面的{$variable}是后台变量;在分享链接中分享要显示的图标或者图片地址。不能用相对地址,所以用绝对地址;如果wx.config信息没有问题,但是浏览器控制台没有日志信息,可以尝试清除浏览器缓存。问:在qq分享网页呢?如何设置标题、描述和图片?答:参考:手机QQAPI-腾讯移动Web开发平台/qqshow/ac/v4/global/logo.png"/>其他问题:直接在卡片上长按转发如果不转发,缩略图信息会失效吗?答:参考微信好友分享链接。再次被好友转发后,分享链接图标消失。如何解决?请赐教!