uni-app H5公众号JSSDK uni-app在H5如何调用微信接口-uni-app-PHP中文网

uni-app h5中调用微信js-sdk需满足三前提：运行于微信webview、h5域名已备案、动态加载官方sdk；签名由后端生成，url须与地址栏完全一致，分享接口须在wx.ready中调用。

uni-app h5公众号jssdk uni-app在h5如何调用微信接口

uni-app H5 里直接调用 `wx.config` 会失败

因为微信 JSSDK 只在微信内置浏览器（即微信客户端打开的网页）中生效，而 uni-app 的 H5 模式默认运行在任意浏览器里——哪怕你用手机 Chrome 打开，wx 对象也根本不存在。不是配置错，是环境不支持。真正能调用的前提只有一个：页面必须运行在微信 WebView 中，且 URL 已在公众号后台「JS接口安全域名」里备案。

检查当前环境是否为微信：用 /(MicroMessenger|WeChat)/.test(navigator.userAgent) 判断，但仅作提示，不能替代真实环境
确保 H5 页面地址（注意是用户访问的完整 URL，含 https:// 和路径）已填入公众号后台 → 「公众号设置」→ 「功能设置」→ 「JS接口安全域名」
uni-app 编译为 H5 后，process.env.NODE_ENV === 'production' 且运行在微信中，才可继续下一步；开发时 localhost 无法调用，连本地代理都不行

如何在 uni-app H5 中安全注入微信 JS-SDK

不能靠 npm install weixin-js-sdk 或直接 import wx from 'weixin-js-sdk' —— 这个包只是类型定义和轻量封装，核心依赖仍需微信官方 CDN 提供的 https://res.wx.qq.com/open/js/jweixin-1.6.0.js。必须手动动态加载，且要在 wx 尚未定义时完成。

不要在 main.js 或组件 onLoad 里直接 document.write 或 appendChild script 标签，容易重复加载或时机过早

推荐封装一个 loadWxSdk 函数，在需要调用 JSSDK 前（比如点击分享按钮时）按需加载：

function loadWxSdk() {
  return new Promise((resolve, reject) => {
    if (window.wx) return resolve(window.wx)
    const script = document.createElement('script')
    script.src = 'https://res.wx.qq.com/open/js/jweixin-1.6.0.js'
    script.onload = () => resolve(window.wx)
    script.onerror = reject
    document.head.appendChild(script)
  })
}

加载成功后仍需 wx.config，它的 jsApiList 必须精确列出你要用的接口，比如 ['updateAppMessageShareData', 'updateTimelineShareData']，多写或少写都会导致对应接口不可用

`wx.config` 失败最常见的三个原因

即使环境对、域名对、SDK 加载对，wx.config 依然大概率报 config:invalid signature 或 config:invalid url domain。这不是前端代码问题，而是签名环节出错。

signature 必须由后端生成：前端传 nonceStr、timestamp、url（注意是当前页面完整 URL，不含 hash，且要 encodeURIComponent 处理特殊字符），后端用 jsapi_ticket + 这三者拼接 SHA1
url 字段必须和浏览器地址栏完全一致（包括 http/https、大小写、末尾斜杠、query 参数顺序），uni-app 的路由模式（如 hash 或 history）会影响实际 URL，建议统一用 history 模式并服务端配置 fallback
后端返回的 jsapi_ticket 必须是有效期内（2小时）且未被限频的，调试时可先用固定 ticket 测试签名逻辑是否正确，排除缓存干扰

uni-app 里调用分享接口的实际写法

微信从 1.4.0 开始废弃 onMenuShareAppMessage 等老接口，必须用 updateAppMessageShareData 和 updateTimelineShareData。它们不返回 promise，也不触发回调，只在用户点分享时生效——所以必须在页面就绪后尽早调用，而不是等用户点击才设。

不要在 mounted 或 onLoad 里直接调，得等 wx.config 成功后的 ready 回调里执行：

wx.ready(() => {
  wx.updateAppMessageShareData({ title: '标题', desc: '描述', link: location.href, imgUrl: 'https://xxx.jpg' })
  wx.updateTimelineShareData({ title: '标题', link: location.href, imgUrl: 'https://xxx.jpg' })
})