微信sdk更新,修正上传门头照照片错误

This commit is contained in:
2026-07-12 16:10:11 +08:00
parent e8823a0640
commit 656e906254
6 changed files with 126 additions and 27 deletions
@@ -39,6 +39,10 @@ function formatWechatUploadError(e: unknown): string {
return msg;
}
function shouldFallbackToNativePicker(msg: string): boolean {
return /permission|denied|接口未就绪|signature|JSSDK|签名校验|invalid signature|config:fail|未授权/i.test(msg);
}
function acceptsImages(accept: string) {
return accept.includes('image');
}
@@ -139,6 +143,7 @@ export default function OssUploadField({
setUploading(true);
setError('');
try {
weixinSdk.reset();
await weixinSdk.init();
await enqueueUpload(async () => {
const files = await weixinSdk.chooseImages({
@@ -152,6 +157,14 @@ export default function OssUploadField({
if (!files[0]) return;
await uploadSelectedFile(files[0]);
});
} catch (e) {
const msg = e instanceof Error ? e.message : '无法打开相册';
if (/cancel/i.test(msg)) return;
if (shouldFallbackToNativePicker(msg)) {
openNativeFilePicker();
return;
}
throw e;
} finally {
setUploading(false);
}
@@ -173,6 +186,10 @@ export default function OssUploadField({
} catch (e) {
const msg = e instanceof Error ? e.message : '无法打开相册';
if (/cancel/i.test(msg)) return;
if (shouldFallbackToNativePicker(msg)) {
openNativeFilePicker();
return;
}
showUploadError(formatWechatUploadError(e));
}
return;
@@ -208,7 +225,6 @@ export default function OssUploadField({
</button>
</div>
)}
{!useWechatPicker && (
<input
ref={inputRef}
type="file"
@@ -220,7 +236,6 @@ export default function OssUploadField({
if (file) void uploadSelectedFile(file);
}}
/>
)}
{isImage ? (
<button {...triggerProps} className={`partner-upload-preview${wide ? ' partner-upload-preview--wide' : ''}`}>
<img src={value} alt={label ?? '已上传'} />
@@ -137,6 +137,7 @@ export default function StoreCreatePage() {
useEffect(() => {
if (step !== 2 || !isWechatEnv()) return;
void refresh();
weixinSdk.reset();
void weixinSdk.init().catch(() => {
/* OssUploadField 点击时会再次初始化 */
});
+55 -5
View File
@@ -1,5 +1,11 @@
import { getRuntimePlatform, isIosDevice, isWechatDevTools } from './env';
import { ensureJssdkReady, normalizeJssdkPageUrl } from './jssdk';
import {
ensureJssdkReady,
getJssdkSignUrl,
initWechatJssdk,
normalizeJssdkPageUrl,
resetJssdkConfig,
} from './jssdk';
import type { WeixinSdkConfig } from './types';
export type ChooseWechatImageOptions = {
@@ -108,6 +114,45 @@ function localIdToFile(localId: string): Promise<File> {
});
}
function checkJsApi(apiName: string): Promise<boolean> {
return new Promise((resolve) => {
if (!window.wx?.checkJsApi) {
resolve(!!window.wx?.chooseImage);
return;
}
window.wx.checkJsApi({
jsApiList: [apiName],
success: (res) => resolve(!!res.checkResult?.[apiName]),
fail: () => resolve(false),
});
});
}
async function ensureChooseImageJssdk(config: WeixinSdkConfig): Promise<void> {
const jssdkOptions = {
apiBase: config.apiBase ?? '/api/v1',
clientApp: config.clientApp,
getAccessToken: config.getAccessToken,
jsApiList: ['chooseImage', 'getLocalImgData'],
};
await ensureJssdkReady(jssdkOptions);
let ready = await checkJsApi('chooseImage');
if (!ready) {
resetJssdkConfig();
await initWechatJssdk({ ...jssdkOptions, url: getJssdkSignUrl() });
ready = await checkJsApi('chooseImage');
}
if (!ready) {
throw new Error('微信选图接口未授权,请刷新页面后重试');
}
}
function isPermissionDeniedError(msg: string): boolean {
return /permission|denied|invalid signature|config:fail|signature|接口未就绪|offline verifying/i.test(msg);
}
function invokeChooseImage(
count: number,
sourceType: Array<'album' | 'camera'>,
@@ -144,13 +189,14 @@ export async function chooseWechatImages(
if (platform === 'wechat-h5') {
const sourceTypeKey = sourceType.join(',');
try {
await ensureJssdkReady({
const jssdkOptions = {
apiBase: config.apiBase ?? '/api/v1',
clientApp: config.clientApp,
getAccessToken: config.getAccessToken,
jsApiList: ['chooseImage', 'getLocalImgData'],
});
};
try {
await ensureChooseImageJssdk(config);
} catch (e) {
const errMsg = e instanceof Error ? e.message : 'JSSDK 初始化失败';
void reportChooseImageEvent(config, { status: 'fail', errMsg, sourceType: sourceTypeKey, stage: 'jssdk' });
@@ -171,6 +217,10 @@ export async function chooseWechatImages(
let lastError: Error | null = null;
for (let attempt = 0; attempt < maxAttempts; attempt++) {
if (attempt > 0) {
if (lastError && isPermissionDeniedError(lastError.message)) {
resetJssdkConfig();
await initWechatJssdk({ ...jssdkOptions, url: getJssdkSignUrl() });
}
await delay(800);
}
try {
@@ -180,7 +230,7 @@ export async function chooseWechatImages(
} catch (e) {
lastError = e instanceof Error ? e : new Error('无法打开相册');
const raw = lastError.message;
const retryable = /offline verifying|权限验证中|接口未就绪/i.test(raw);
const retryable = /offline verifying|权限验证中|接口未就绪/i.test(raw) || isPermissionDeniedError(raw);
if (attempt < maxAttempts - 1 && retryable) continue;
void reportChooseImageEvent(config, {
status: 'fail',
+3 -1
View File
@@ -7,6 +7,7 @@ export {
normalizeJssdkPageUrl,
getJssdkSignUrl,
captureIosJssdkEntryUrl,
resetJssdkConfig,
stripOAuthParamsFromLocation,
} from './jssdk';
export { formatScanFailMessage } from './scan';
@@ -42,7 +43,7 @@ export type { WeixinSdkConfig, WxApi, MiniProgramWx } from './types';
export { DEFAULT_JS_API_LIST } from './types';
import type { WeixinSdkConfig } from './types';
import { initWechatJssdk } from './jssdk';
import { initWechatJssdk, resetJssdkConfig } from './jssdk';
import { getWechatLocation, getWechatLocationDetailed } from './location';
import { scanQrCode } from './scan';
import { invokeWechatPay } from './pay';
@@ -59,6 +60,7 @@ import {
export function createWeixinSdk(config: WeixinSdkConfig) {
return {
init: () => initWechatJssdk({ ...config, apiBase: config.apiBase ?? '/api/v1' }),
reset: () => resetJssdkConfig(),
login: () => wechatLogin(config),
handleOAuthCallback: (params?: URLSearchParams) => handleWechatOAuthCallback(config, params),
bindPhone: (payload: { wxSessionKey: string; phone: string; code: string }) =>
+31 -4
View File
@@ -9,6 +9,20 @@ let scriptPromise: Promise<void> | null = null;
let configured = false;
let configuredUrl: string | null = null;
function pathnameOf(url: string): string {
try {
return new URL(url).pathname;
} catch {
return url.split('?')[0];
}
}
/** 清除 JSSDK 配置缓存(路由切换后须重新 wx.config) */
export function resetJssdkConfig(): void {
configured = false;
configuredUrl = null;
}
/** 参与 JSSDK 签名的页面 URL(去掉 hash、query;SPA 步骤参数不参与签名) */
export function normalizeJssdkPageUrl(rawUrl: string): string {
try {
@@ -19,12 +33,20 @@ export function normalizeJssdkPageUrl(rawUrl: string): string {
}
}
/** iOS 微信内 SPA签名 URL 须用首次进入页面的入口 URL,而非路由跳转后的当前 URL */
/** iOS 微信内 SPA同 pathname 内复用入口 URL;跨路由时更新入口并失效旧签名 */
export function captureIosJssdkEntryUrl(): void {
if (typeof window === 'undefined') return;
if (!isIosDevice() || !isWechatBrowser() || isWechatDevTools()) return;
if (sessionStorage.getItem(IOS_ENTRY_URL_KEY)) return;
sessionStorage.setItem(IOS_ENTRY_URL_KEY, normalizeJssdkPageUrl(window.location.href));
const current = normalizeJssdkPageUrl(window.location.href);
const existing = sessionStorage.getItem(IOS_ENTRY_URL_KEY);
if (!existing) {
sessionStorage.setItem(IOS_ENTRY_URL_KEY, current);
return;
}
if (pathnameOf(existing) !== pathnameOf(current)) {
sessionStorage.setItem(IOS_ENTRY_URL_KEY, current);
resetJssdkConfig();
}
}
/** 获取参与 JSSDK 签名的 URL */
@@ -32,7 +54,9 @@ export function getJssdkSignUrl(rawUrl?: string): string {
const current = normalizeJssdkPageUrl(rawUrl ?? (typeof window !== 'undefined' ? window.location.href : ''));
if (typeof window !== 'undefined' && isIosDevice() && isWechatBrowser() && !isWechatDevTools()) {
const entry = sessionStorage.getItem(IOS_ENTRY_URL_KEY);
if (entry) return entry;
if (entry && pathnameOf(entry) === pathnameOf(current)) {
return entry;
}
}
return current;
}
@@ -139,6 +163,9 @@ export async function ensureJssdkReady(options: {
}): Promise<void> {
captureIosJssdkEntryUrl();
const pageUrl = options.url ?? getJssdkSignUrl();
if (configuredUrl && pathnameOf(configuredUrl) !== pathnameOf(pageUrl)) {
resetJssdkConfig();
}
if (!isJssdkReady()) {
await initWechatJssdk({ ...options, url: pageUrl });
}
+5 -1
View File
@@ -19,7 +19,11 @@ export type WxApi = {
config: (options: WechatJssdkConfig & { debug?: boolean }) => void;
ready: (cb: () => void) => void;
error: (cb: (res: { errMsg: string }) => void) => void;
checkJsApi: (options: { jsApiList: string[]; success?: (res: Record<string, boolean>) => void }) => void;
checkJsApi: (options: {
jsApiList: string[];
success?: (res: { checkResult?: Record<string, boolean> }) => void;
fail?: (res: { errMsg: string }) => void;
}) => void;
getLocation: (options: {
type?: string;
success?: (res: WechatGpsLocation) => void;