微信公众号跳转H5获取openid

微信公众号通过用户点击链接跳转到H5页面并获取openid的过程通常涉及以下几个步骤：

1. **生成授权URL**：首先，你需要在微信公众平台上申请得到一个`snsapi_base`或`snsapi_userinfo`权限的授权地址，这两个权限级别可以分别获取用户的公开信息和基础信息。

var appId = 'your_app_id';
var redirectUri = 'http://your_domain.com/callback'; // 小程序回调域名
var scope = 'snsapi_userinfo'; // 或者'snsapi_base'
var state = 'state_string'; // 可选，用于防止CSRF攻击，自定义字符串

var authorizeUrl = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appId}&redirect_uri=${encodeURIComponent(redirectUri)}&response_type=code&scope=${scope}&state=${state}#wechat_redirect`;

这里的`#wechat_redirect`表示微信处理完授权后会自动跳转回指定的回调地址。

2. **用户授权**：用户点击该链接后会在微信客户端打开授权界面，同意授权后会跳转回你设置的回调地址。

3. **回调处理**：当用户完成授权，微信服务器会将授权码(`code`)作为GET参数传递给你设置的回调地址。在回调页，需要发送请求到微信服务器换取`access_token`和`openid`。

axios.get('https://api.weixin.qq.com/sns/oauth2/access_token', {
  params: {
    appid: appId,
    secret: 'your_app_secret',
    code: request.query.code,
    grant_type: 'authorization_code'
  },
})
.then(response => {
  const accessToken = response.data.access_token;
  const openid = response.data.openid;
  // 使用access_token和openid做后续操作
})
.catch(error => {
  console.error('Error:', error);
});

这里假设你已经设置了axios库来发起HTTP请求，并且有对应的`app_secret`。

4. **保存openid**：获得`openid`后，可以在你的数据库或其他存储系统中保存，以便后续关联用户的其他操作。