微信自定义分享链接(设置标题+简介+图片)

起源:最近公司在做招募广告的html5页面,然后做出来后,产品提出一个问题,需要分享出去的链接是卡片形式,内容也要自己定义,这下就难到我了,因为是第一次遇到这种需求,果断百度,然而,我就像大家一样,看都看不懂,一大堆什么微信jssdk官方文档,看得我眼花缭乱,博客上面的也大多都是php形式的解释,也不知道怎么导入进来,然而接着去了解这个卡片分享,发现官方的分享卡片,是众多在微信生态中传播的html5静态页面的一个重点。所以我解决了这个问题之后,就来写这个博客,希望能帮助一些初步了解这个微信自定义分享链接的园友。

 

产品需要做的:

1.微信认证过的公众号:必须是经过认证的,没有认证的或者认证过期的都不可以;

2.经过备案的域名:必须是备案过的,不然是无法使用的;

3.绑定域名:首先你需要将需要分享的网址的域名绑定到微信公众平台上面,具体操作:先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”;

 

博主这次开发中,就遇到了第三点问题,我代码都写好了,后台也做好了,但是就是分享出去不是卡片形式

微信自定义分享链接(设置标题+简介+图片)

遇到 config:invalid url domain

微信自定义分享链接(设置标题+简介+图片)

 

后来发现是产品忘记绑定域名,设置白名单了。。。(域名不要加)

 

微信自定义分享链接(设置标题+简介+图片)

 

 

好,后来这个问题解决了,但是还是分享不成功,又进行一次排查,因为要在手机端上线才能看到效果,就一直上线一直改,改到下午5点,后来发现是产品appid给错了,我TM......

 

后台需要做的:

1.后台服务器:前台页面需要后台服务器传过来一些配置参数,比如appId、timestamp、nonceStr、signature这几个参数都是后台从微信公众平台获取到的, 需要后台进行配合;

2.获取access_token:利用公共号APPID、APPSECRET从微信服务器获取对应的access_token,这里是后台开发小伙伴的范围不多做解释;

后台需要传的参数格式:

微信自定义分享链接(设置标题+简介+图片)

 

 

前端你需要做的:

1.引入js文件 :在分享的页面需要引入一个微信官方的js文件;

<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wpzwxd.html