快上网专注成都网站设计 成都网站制作 成都网站建设
成都网站建设公司服务热线:028-86922220

网站建设知识

十年网站开发经验 + 多家企业客户 + 靠谱的建站团队

量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决

使用微信接口自定义分享的网页信息(缩略图,标题,描述)-创新互联

使用微信接口自定义分享的网页信息(缩略图,标题,描述)

创新互联建站长期为数千家客户提供的网站建设服务,团队从业经验10年,关注不同地域、不同群体,并针对不同对象提供差异化的产品和服务;打造开放共赢平台,与合作伙伴共同营造健康的互联网生态环境。为甘肃企业提供专业的成都网站制作、成都做网站,甘肃网站改版等技术服务。拥有10余年丰富建站经验和众多成功案例,为您定制开发。

今天分享一个实用功能,就是网站内容分享到微信朋友圈带缩略图,一般网友可能没注意,默认直接分享是没缩略图的,那怎么实现这个功能呢,微信开发团队已经帮我们开发好了接口,我们调用就可以了。

使用微信接口自定义分享的网页信息(缩略图,标题,描述)

首先我们需要一个认证了的微信公众号,目前一个微信公众号可以绑定3个网站,在"设置"-"公众号设置"-"功能设置"

使用微信接口自定义分享的网页信息(缩略图,标题,描述)

然后把自己服务器的ip加到白名单里面,可以设置多个。在"设置"-"安全中心"

使用微信接口自定义分享的网页信息(缩略图,标题,描述)

配置好了之后就可以,调试代码了。微信提供了几个demo,可以根据自己的网站语言去下载。常见的大部分网站是用php语言写的。本文就用php为例。下载好了对应的demo文件之后,需要修改的也长差不多是3个文件程序,主页,列表,详情页面,这3个页面调用微信接口,然后把值分配到模板里面去,大部分的网站是程序和html文件分离的,如果你的代码是混合写的就省去了一个步骤。

获取好了需要的数据之后填写在对应的值里面,下面是主要的html调用代码,根据程序那边分配的变量输出数据

var currLink = location.href.split('#')[0];   var title = 'GetwxLink';   var imgUrl = 'http://www.gettool.cn/GetwxLink/';   var desc = 'web desc';   wx.config({   // debug: true,   appId: 'wx7cd9d5fd98****',   timestamp: 1525050****,   nonceStr: 'MNCoBRfI43d****',   signature: 'b352682b94b63ca5058b1c1ead821db35c*****',   jsApiList: ['onMenuShareTimeline','onMenuShareAppMessage','onMenuShareQQ']   });     wx.hideOptionMenu();   wx.ready(function(){   wx.showOptionMenu();   wx.onMenuShareTimeline({   title: title, //   link: currLink, // 分享链接   imgUrl: imgUrl, // 分享图标   success: function () {   },   cancel: function () {   }   });     wx.onMenuShareAppMessage({   title: title, // 分享标题   desc: desc, // 分享描述   link: currLink, // 分享链接   imgUrl: imgUrl, // 分享图标   type: '', // 分享类型,music、video或link,不填默认为link   dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空   success: function () {   },   cancel: function () {   }   });     wx.onMenuShareQQ({   title: title, // 分享标题   desc: desc, // 分享描述   link: currLink, // 分享链接   imgUrl: imgUrl, // 分享图标   type: '', // 分享类型,music、video或link,不填默认为link   dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空   success: function () {   },   cancel: function () {   }   });   });

使用微信接口自定义分享的网页信息(缩略图,标题,描述)

这样差不多就完成了,当然在调式过程中你可能会遇到各种问题,这时候可以看看官方文档。这个也不复杂,需要的就是耐心调试,感兴趣的朋友快去试试吧,有不明白的欢迎留言

GetwxLink

另外有需要云服务器可以了解下创新互联cdcxhl.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


当前名称:使用微信接口自定义分享的网页信息(缩略图,标题,描述)-创新互联
当前路径:http://6mz.cn/article/dcsocp.html

其他资讯