vue_golang_微信JSSDK相关

最新推荐文章于 2023-02-06 14:40:28 发布

Simorel

最新推荐文章于 2023-02-06 14:40:28 发布

阅读量686

点赞数

分类专栏：前端 go # vue 文章标签：微信JSSDK

本文链接：https://blog.youkuaiyun.com/Simoral/article/details/83381232

版权

前端同时被 3 个专栏收录

86 篇文章

订阅专栏

vue

35 篇文章

订阅专栏

3 篇文章

订阅专栏

本文详细介绍微信JSSDK的使用方法，包括前后端代码实现、单页面应用配置及微信分享功能优化。涵盖golang后台代码与vue前台代码的具体实现，解决微信分享中常见问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

微信JSSDK相关

官方文档

文章目录

微信JSSDK相关

准备

去微信公众平台绑定安全域名
公众号基本配置
程序里面引入JS
我直接放在了index.html里面
config注入

注意：
SPA单页面应用的话，看需求吧，我们的应用只需要分享两个页面，所以只要在这两个页面的url之间来回调用分享就好。因为同一个url仅需调用一次。

golang后台代码

SimoralX参见我的github内的jssdk.go

vue前台代码

引入weixin-js-sdk包
引入axios包
SimoralX参见我的github内的wechat.js
注意： let splitUrl = reqUrl.split('#')[0];
vue的url必须去掉#
别使用history,因为部署的时候会出现错误，我也不知道可能这里的url造成的
微信二次分享
苹果和安卓的微信都会增加?from=singlemessage
苹果的微信二次分享会增加&isappinstalled=0
所以请求设置的link一定要去掉这些，不然不断分享，不断增长，这里我不需要这个参数，所以去掉了，由需要的可以保留。

配置index.html添加默认头像和标题

<head>
    <!-- 分享默认标题 -->
    <meta name="keywords" content="AAAAAA" />
   	<!-- 分享默认内容 -->
    <meta name="description" content="BBBBBB" />
</head>
<body>
	<!-- 设置微信分享默认logo -->
	<div style=" overflow:hidden; width:0px; height:0; margin:0 auto; position:absolute; top:-800px;"><img src="static/image/shareLogo.png"></div>
</body>