vue怎么实现将自己网站分享到微信中形成小卡片

这篇文章主要介绍“vue怎么实现将自己网站分享到微信中形成小卡片”，在日常操作中，相信很多人在vue怎么实现将自己网站分享到微信中形成小卡片问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答”vue怎么实现将自己网站分享到微信中形成小卡片”的疑惑有所帮助！接下来，请跟着小编一起来学习吧！注册一个公众号，该公众号需要能认证的（企业认证）准备好你的站，前端展示的是vue，别的可以自己对应的转换。后端用java实现的，别的语言自己转换一下即可。请注意，公众号可以是订阅号，也可以是服务号，但是必须是需要企业可以认证的，个人虽然说有的也可以认证，但是没有调用分享接口的权限免费云主机域名。weixin-js-sdk帮助文档在这里，可以提现看看，免得后面看到之后，显得那么陌生~帮助文档下面我们来介绍一下实现步骤：打开微信公众平台，在“公众号设置”的“功能设置”里填写“JS接口安全域名”。不设置会被拦截，没法使用，大家可以仔细看看是如何设置的，第三点最重要：在【基本配置】里面，配置一下你的ip白名单，不设置没法获取access_token，没有toekn，一切都免谈。3. 在vue项目中，安装weixin-js-sdk的依赖：在需要分享的vue页面中写代码，先引入安装好的依赖。在methods中实现分享的功能：代码说明：url是我们要分享页面的链接，需要传递到后端进行加密签名（后端的代码我们待会儿看）getSing方法是后端进行签名的方法，安全起见，所有config初始化中的关键信息，都从后端往回拿。jsApiList是我们需要实现的功能的方法列表，逗号隔开。在created中调用一下getShareInfo方法：前端内容就这些，下面我们看看后端做了哪些操作。获取token：为什么要获取token，微信公众号开发中，不管你做啥操作，都需要这个token，并且有效时间是7200s,也就是两个小时，两小时后就失效，下面是java中获取token的代码：WX_GZH_API：APPID 和APPSECRET换成你自己的就行。获取api_ticket，这个是用在签名里面的，直接请求接口获取就行。这两个方法我都写了缓存，和是失效时间，并且在用的时候都会去判断缓存里面有没有值，没有的话，我们再去请求重新获取，而不是每次都请求获取，这样会造成接口请求频繁受到限制的问题。开始签名：签名的几个工具类如下所示：加密签名接口请求如下：到此，关于“vue怎么实现将自己网站分享到微信中形成小卡片”的学习就结束了，希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习，快去试试吧！若想继续学习更多相关知识，请继续关注百云主机网站，小编会继续努力为大家带来更多实用的文章！