小程序直接跳转到公众号的方法
2021/4/19 20:28:09
本文主要是介绍小程序直接跳转到公众号的方法,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
实现效果
<iframe allowfullscreen="true" data-mediaembed="bilibili" id="8Zymm4x3-1618825835244" src="https://player.bilibili.com/player.html?aid=930201801&page=1"></iframe>小程序打开公众号的实现效果
小程序不能直接打开公众号首页,但是可以通过打开公众号的某一篇文章,然后进入到公众号内。
具体实现方法
- 在公众号后台创建一篇文章,最好以xx.weixin.qq.com为域名 ,否则可能出现小程序不识别的问题;
- 在小程序项目里创建一个webView的页面,访问的链接就是配置好的公众号文章链接;
- 在本地运行小程序,在需要跳转的地方添加方法,点击先跳转到webView页面,然后会访问到公众号文章里,文章的左上角有公众号的名称,点击名称,就可以直接跳转到公众号内了;
4.我用的是Taro的写法,大家也可以用原生的,下面放下我的代码
import Taro from '@tarojs/taro'; import { WebView } from '@tarojs/components'; import CommonPageComponent from '../../../pages/CommonPageComponent'; import util from '../../../pages/login/util'; //自己封装的解析h5 Url编码的方法 import { logUrlAddSeries } from '../../../utils/common/logReport'; // 自己封装的埋点方法 const plugin = Taro.requirePlugin('loginPlugin'); //自己封装好的登陆插件 export default class Concern extends CommonPageComponent { constructor(props) { super(props); this.state = { h5_url: '', url: '', articleUrl: 'https://mp.weixin.qq.com/s?__biz=MzUxNzA4NTQxNQ==&mid=100008693&idx=1&sn=bc6ac5115dd2bc2c604fb329dfa4e793&chksm=799f237d4ee8aa6b86572076bb1e9f3e24b3afb27ef40f106f2261bd20c26a1c28b20ce712a8#rd', //文章路径 }; } config = { navigationBarTitleText: '', }; componentWillMount() { // 开始需要先隐藏分享功能 Taro.hideShareMenu(); exportPoint(this.$router); const { articleUrl } = this.$router.params; if (articleUrl) { this.setState( { articleUrl: articleUrl, }, () => { this.init(); } ); } else { this.init(); } } componentDidShow() { this.onPageShow(); } componentDidHide() { this.onPageHide(); } init = () => { // 获取小程序参数,拼接webview的H5链接 let h5_url = encodeURIComponent(this.state.articleUrl); h5_url = util.transformH5Url(h5_url); util.h5Init({ ...{ returnPage: h5_url, pageType: 'h5' }, }); this.setState({ h5_url }, () => { this._genToken(); }); }; _genToken = () => { let { h5_url } = this.state; plugin .genToken({ h5_url, }) .then(res => { let { isSuccess, err_code, url, tokenkey, err_msg } = res; if (isSuccess && !err_code) { this.setState( { url: logUrlAddSeries(`${url}?to=${h5_url}&tokenkey=${tokenkey}`), }, () => { console.log({ url }); } ); } else { Taro.showModal({ title: '提示', content: err_msg || '页面跳转失败,请重试', success: resp => { if (resp.confirm) { this._genToken(); } }, }); } }); }; render() { return <WebView src={this.state.url} />; } }
我的代码里加了登陆态打通和埋点方法,大家不需要的可以去掉_genToken方法。
这篇关于小程序直接跳转到公众号的方法的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-03-30微信小程序的网络设置,及网络请求:wx.request(OBJECT)
- 2024-01-22基于taro搭建小程序多项目框架
- 2024-01-13小程序开发:在插件市场寻找步骤条组件并二开
- 2024-01-05钉钉小程序生态—企业机器人加互动卡片,改善用户体验的开始!
- 2023-12-29【UniApp】-uni-app-打包成小程序
- 2023-12-26性能翻倍!京东亿级体量小程序优化实践
- 2023-12-25小程序优化:第三方SDK过大解决方案
- 2023-11-26微信小程序文件预览和下载-文件系统
- 2023-11-2652天学习微信小程序计划No.2:注册小程序账号&安装开发者工具
- 2023-11-1952天学习微信小程序计划No.1:小程序简介