解决步骤

以下是使用 web-view 并配配合微信公众号提供的 网页授权 来实现

1、在小程序中做一个web-view页面，页面中只需要写微信 网页授权的链接就行了，注意appid请自行替换（公众号的）。

 onLoad() {this.setData({src: 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=`自己公众号openid`&redirect_uri=自己跳转的H5页面&response_type=code&scope=snsapi_base&state=123#wechat_redirect',})},

2、redirect_uri是我们第一步中的网页地址。**注意：**需要在公众号管理平台中配置授权域名

redirect_uri:必须是https开头，并且需要如下配置

3、redirect_uri的页面（H5页面）需要截取location.search获取code;返回微信小程序，需要安装weixin-js-sdk

4、拿到H5返回小程序的code值，调用后台接口就可以获取公众号的openId

具体代码

1、微信小程序的web-view页面

<web-view src="{{src}}" />

Page({data: {src: '',},onLoad() {this.setData({src: 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=自己的公众号openid&redirect_uri=需要跳转的H5页面&response_type=code&scope=snsapi_base&state=123#wechat_redirect',})}
});

2、Vue H5页面

<template><div class="wx-h5"></div>
</template>
<script>
import wx from "weixin-js-sdk";
import { showFullScreenLoading } from "@/utils/loading";
export default {name: "WXh5",mounted() {// 页面loadingshowFullScreenLoading("页面跳转中...", "", "wx-text-color");// 跳转到tarBar页面// wx.miniProgram.switchTab({ url: "****" });if (this.getUrlCode().code) {wx.miniProgram.redirectTo({url: `/subpackages/extension/index?code=${this.getUrlCode().code}`})}},methods: {getUrlCode() {// 截取url中的code方法var url = location.search// eslint-disable-next-line no-new-objectvar theRequest = new Object()if (url.indexOf('?') != -1) {var str = url.substr(1)var strs = str.split('&')for (var i = 0; i < strs.length; i++) {theRequest[strs[i].split('=')[0]] = strs[i].split('=')[1]}}return theRequest}}
};
</script><style lang="scss">
.wx-text-color {width: 90px;height: 105px;top: 50%;left: 50%;transform: translate(-50%, -50%);border-radius: 10px;.circular {.path {stroke: #fff;}}.el-loading-text {color: #fff;font-size: 12px;}
}
</style>

3、如上在微信小程序的/subpackages/extension/index页面的onLoad接收参数code,便可根据code获取公众号的openId

4、注意点：

微信小程序的web-view页面只能独立出来使用，不能在/subpackages/extension/index页面使用，不然返回到/subpackages/extension/index页面后，该页面的事件都会失效。

相关文章

基于ElementUi再次封装基础组件文档

---

基于ant-design-vue再次封装基础组件文档

---

vue3+ts基于Element-plus再次封装基础组件文档