完善移动壳系统分享目标解析
移动 Expo 壳解析统一分享目标并调用 React Native 系统分享面板 补充直接分享、缓存作品目标和空分享目标的移动壳测试 更新宿主壳方案和项目共享决策记录
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
import * as Linking from 'expo-linking';
|
||||
import { Share } from 'react-native';
|
||||
import { afterEach, describe, expect, test, vi } from 'vitest';
|
||||
|
||||
import {
|
||||
@@ -11,6 +12,7 @@ import {
|
||||
import {
|
||||
configureMobileHostBridgeNavigation,
|
||||
handleMobileHostBridgeMessage,
|
||||
resetMobileHostBridgeForTest,
|
||||
} from './mobileHostBridge';
|
||||
|
||||
vi.mock('expo-clipboard', () => ({
|
||||
@@ -85,7 +87,8 @@ function expectFailed(response: HostBridgeResponse) {
|
||||
|
||||
afterEach(() => {
|
||||
vi.mocked(Linking.openURL).mockReset();
|
||||
configureMobileHostBridgeNavigation(null);
|
||||
vi.mocked(Share.share).mockReset();
|
||||
resetMobileHostBridgeForTest();
|
||||
});
|
||||
|
||||
describe('handleMobileHostBridgeMessage', () => {
|
||||
@@ -180,6 +183,60 @@ describe('handleMobileHostBridgeMessage', () => {
|
||||
expect(Linking.openURL).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
test('share.open 使用直接分享 payload 调起系统分享', async () => {
|
||||
const response = await send(
|
||||
request('share.open', {
|
||||
title: '测试作品',
|
||||
message: '来玩这个作品',
|
||||
url: 'https://app.genarrative.world/works/detail?work=PZ-1',
|
||||
}),
|
||||
);
|
||||
|
||||
expectOk(response);
|
||||
expect(Share.share).toHaveBeenCalledWith({
|
||||
title: '测试作品',
|
||||
message:
|
||||
'来玩这个作品\nhttps://app.genarrative.world/works/detail?work=PZ-1',
|
||||
url: 'https://app.genarrative.world/works/detail?work=PZ-1',
|
||||
});
|
||||
});
|
||||
|
||||
test('share.open 使用缓存作品目标生成作品详情链接', async () => {
|
||||
expectOk(
|
||||
await send(
|
||||
request('share.setTarget', {
|
||||
target: {
|
||||
type: 'genarrative:share-target',
|
||||
payload: {
|
||||
title: '暖灯猫街',
|
||||
message: '来玩这个作品',
|
||||
work: 'PZ-00000001',
|
||||
},
|
||||
},
|
||||
}),
|
||||
),
|
||||
);
|
||||
|
||||
const response = await send(request('share.open'));
|
||||
|
||||
expectOk(response);
|
||||
expect(Share.share).toHaveBeenCalledWith({
|
||||
title: '暖灯猫街',
|
||||
message:
|
||||
'来玩这个作品\nhttps://app.genarrative.world/works/detail?work=PZ-00000001',
|
||||
url: 'https://app.genarrative.world/works/detail?work=PZ-00000001',
|
||||
});
|
||||
});
|
||||
|
||||
test('share.open 没有可分享内容时拒绝请求', async () => {
|
||||
const response = await send(request('share.open', {}));
|
||||
|
||||
const failedResponse = expectFailed(response);
|
||||
|
||||
expect(failedResponse.error.code).toBe('invalid_request');
|
||||
expect(Share.share).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
test('移动壳未接入真实导出能力时明确返回 unsupported', async () => {
|
||||
const response = await send(
|
||||
request('file.exportText', {
|
||||
|
||||
@@ -20,6 +20,8 @@ import {
|
||||
} from '../../../packages/shared/src/contracts/hostBridge';
|
||||
import { resolveMobileShellWebViewUrl } from './mobileShellNavigation';
|
||||
|
||||
const WEB_APP_ORIGIN = 'https://app.genarrative.world';
|
||||
|
||||
export const MOBILE_HOST_CAPABILITIES: HostBridgeCapability[] = [
|
||||
'host.getRuntime',
|
||||
'host.events',
|
||||
@@ -143,13 +145,73 @@ async function runHaptics(payload: unknown) {
|
||||
return true;
|
||||
}
|
||||
|
||||
function stringField(value: unknown, field: string) {
|
||||
if (!value || typeof value !== 'object') {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const fieldValue = (value as Record<string, unknown>)[field];
|
||||
if (typeof fieldValue !== 'string') {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const text = fieldValue.trim();
|
||||
return text || undefined;
|
||||
}
|
||||
|
||||
function shareTargetPayload(value: unknown) {
|
||||
if (!value || typeof value !== 'object') {
|
||||
return value;
|
||||
}
|
||||
|
||||
const target = value as Record<string, unknown>;
|
||||
return target.target ?? value;
|
||||
}
|
||||
|
||||
function workDetailUrl(work: string) {
|
||||
return `${WEB_APP_ORIGIN}/works/detail?work=${encodeURIComponent(work)}`;
|
||||
}
|
||||
|
||||
function webAppPathUrl(path: string) {
|
||||
return new URL(path, WEB_APP_ORIGIN).toString();
|
||||
}
|
||||
|
||||
function normalizeSharePayload(value: unknown): ShareOpenPayload | null {
|
||||
const target = shareTargetPayload(value);
|
||||
const payload =
|
||||
target && typeof target === 'object'
|
||||
? (target as Record<string, unknown>).payload ?? target
|
||||
: target;
|
||||
|
||||
if (!payload || typeof payload !== 'object') {
|
||||
return null;
|
||||
}
|
||||
|
||||
const title = stringField(payload, 'title');
|
||||
const message = stringField(payload, 'message');
|
||||
const directUrl = stringField(payload, 'url') ?? stringField(payload, 'href');
|
||||
const work = stringField(payload, 'work');
|
||||
const path = stringField(payload, 'path') ?? stringField(payload, 'targetPath');
|
||||
const url = directUrl ?? (work ? workDetailUrl(work) : undefined) ?? (path ? webAppPathUrl(path) : undefined);
|
||||
|
||||
if (!title && !message && !url) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return {
|
||||
...(title ? { title } : {}),
|
||||
...(message ? { message } : {}),
|
||||
...(url ? { url } : {}),
|
||||
};
|
||||
}
|
||||
|
||||
async function openShare(payload: unknown) {
|
||||
const sharePayload =
|
||||
payload && typeof payload === 'object'
|
||||
? (payload as ShareOpenPayload)
|
||||
: currentShareTarget && typeof currentShareTarget === 'object'
|
||||
? (currentShareTarget as ShareOpenPayload)
|
||||
: undefined;
|
||||
normalizeSharePayload(payload) ?? normalizeSharePayload(currentShareTarget);
|
||||
if (!sharePayload) {
|
||||
throw invalidRequest('share target is required');
|
||||
}
|
||||
|
||||
const url = sharePayload?.url;
|
||||
const message = [sharePayload?.message, url].filter(Boolean).join('\n');
|
||||
|
||||
@@ -255,3 +317,8 @@ export async function handleMobileHostBridgeMessage(
|
||||
sendResponse(failure(parsed, normalizeError(error)));
|
||||
}
|
||||
}
|
||||
|
||||
export function resetMobileHostBridgeForTest() {
|
||||
currentShareTarget = null;
|
||||
navigation = null;
|
||||
}
|
||||
|
||||
@@ -20,7 +20,7 @@
|
||||
|
||||
- 背景:后续需要移动端 App 和桌面端 App,但现有主站、固定玩法 runtime、小程序壳和未来 AI H5 sandbox 已经以 H5 为主线;如果移动端重写 React Native UI、桌面端重写 Rust/Tauri UI,会形成玩法、登录、支付、分享和运行态的多套实现。
|
||||
- 决策:移动端原生壳采用 `Expo + React Native`,桌面端壳采用 `Tauri`。两者都只作为 `native_app` 宿主壳和 HostBridge adapter,不重写现有 React H5 主站,不把固定内置玩法迁到 React Native / Rust UI,也不让 AI 生成 H5 游戏直接访问完整 HostBridge。Expo 壳通过 `react-native-webview` 承接 H5 与 native 通信,Tauri 壳通过受控 command 和 capabilities 承接桌面能力;新增能力必须先进入 HostBridge 契约和测试。
|
||||
- 2026-06-17 首轮落地:新增 `packages/shared/src/contracts/hostBridge.ts`、`src/services/host-bridge/nativeAppHostBridge.ts`、`apps/mobile-shell/` 和 `apps/desktop-shell/`。壳只声明并实现真实可用能力;移动壳使用真实品牌图标资产并支持 `genarrative://`、iOS associated domain、Android app link 到同源 H5 路径,`navigation.openNativePage` 只接受同源 H5 route 并切换 WebView URL,不伪造尚未存在的原生页面,且通过 `host.events` 注入 `navigation.canGoBack` 返回栈状态事件;`app.openExternalUrl` 在 Expo 与 Tauri 两端都只允许 `http:`、`https:`、`mailto:`、`tel:` 外链协议;桌面壳已通过 Tauri clipboard-manager 接入 `clipboard.writeText`,并将 `share.setTarget` / `share.open` 实现为复制非空分享文本到系统剪贴板,`app.setTitle` 通过主窗口 API 同步非空窗口标题;桌面 `file.exportText` 通过 Tauri dialog 插件打开系统保存对话框并由 Rust 写入文本文件,但不把 dialog / fs 插件 command 直接暴露给 H5,成功只返回文件名和字节数,用户取消返回 `cancelled`;登录、支付、原生系统分享面板等未接入真实 SDK / 插件前必须返回 unsupported 并让 H5 fallback,生产代码禁止 mock 成功。
|
||||
- 2026-06-17 首轮落地:新增 `packages/shared/src/contracts/hostBridge.ts`、`src/services/host-bridge/nativeAppHostBridge.ts`、`apps/mobile-shell/` 和 `apps/desktop-shell/`。壳只声明并实现真实可用能力;移动壳使用真实品牌图标资产并支持 `genarrative://`、iOS associated domain、Android app link 到同源 H5 路径,`navigation.openNativePage` 只接受同源 H5 route 并切换 WebView URL,不伪造尚未存在的原生页面,且通过 `host.events` 注入 `navigation.canGoBack` 返回栈状态事件,`share.setTarget` / `share.open` 解析统一分享目标并调用 React Native 系统分享面板;`app.openExternalUrl` 在 Expo 与 Tauri 两端都只允许 `http:`、`https:`、`mailto:`、`tel:` 外链协议;桌面壳已通过 Tauri clipboard-manager 接入 `clipboard.writeText`,并将 `share.setTarget` / `share.open` 实现为复制非空分享文本到系统剪贴板,`app.setTitle` 通过主窗口 API 同步非空窗口标题;桌面 `file.exportText` 通过 Tauri dialog 插件打开系统保存对话框并由 Rust 写入文本文件,但不把 dialog / fs 插件 command 直接暴露给 H5,成功只返回文件名和字节数,用户取消返回 `cancelled`;登录、支付、原生系统分享面板等未接入真实 SDK / 插件前必须返回 unsupported 并让 H5 fallback,生产代码禁止 mock 成功。
|
||||
- 影响范围:`src/services/host-bridge/`、未来 `apps/mobile-shell/`、未来 `apps/desktop-shell/`、移动端支付 / 分享 / 深链 / 推送、桌面端系统能力、AI H5 sandbox 的 GameBridge 边界。
|
||||
- 验证方式:普通浏览器、小程序、Expo 壳、Tauri 壳都能返回正确 `getHostRuntime()`;未支持能力能回退 H5;固定玩法在各宿主中读取同一作品数据和运行态 snapshot;AI sandbox 无法直接调用 HostBridge;Tauri release 不允许任意远端页面调用桌面命令。
|
||||
- 关联文档:`docs/【前端架构】ExpoReactNative与Tauri宿主壳方案-2026-06-17.md`、`docs/【前端架构】宿主壳能力统一协议-2026-06-17.md`。
|
||||
|
||||
@@ -241,7 +241,7 @@ GameBridge 禁止:
|
||||
- iOS / Android 深链打开作品详情、创作页和邀请码。
|
||||
- 登录和支付先 fallback 到 H5;只把能力边界跑通。
|
||||
|
||||
当前状态:已新增 `apps/mobile-shell/`,通过 Expo development build 运行,`react-native-webview` 加载 H5 URL 并附加 `native_app` 宿主 query。移动壳使用真实品牌图标资产,已接入 `genarrative://` scheme、iOS associated domain 和 Android app link filter,启动和运行时 deep link 只会映射到同源 H5 路径并继续附加 HostBridge 上下文,外域和危险协议回退到默认主站入口。首轮真实能力包括 `host.getRuntime`、`host.events`、`share.open`、`share.setTarget`、`navigation.openNativePage`、`navigation.canGoBack`、`app.openExternalUrl`、`clipboard.writeText`、`haptics.impact` 和 Android 返回键回退;其中 `navigation.openNativePage` 在 Expo 壳内只接受同源 H5 route 并切换 WebView URL,不伪造尚未存在的登录、支付或其它原生页面,`navigation.canGoBack` 由 WebView 导航状态变化实时注入 H5,`app.openExternalUrl` 只允许 `http:`、`https:`、`mailto:`、`tel:` 外链协议。登录、支付和本地文件导出尚未接入渠道 SDK / 原生文档能力时明确返回 unsupported,让 H5 fallback 承接。
|
||||
当前状态:已新增 `apps/mobile-shell/`,通过 Expo development build 运行,`react-native-webview` 加载 H5 URL 并附加 `native_app` 宿主 query。移动壳使用真实品牌图标资产,已接入 `genarrative://` scheme、iOS associated domain 和 Android app link filter,启动和运行时 deep link 只会映射到同源 H5 路径并继续附加 HostBridge 上下文,外域和危险协议回退到默认主站入口。首轮真实能力包括 `host.getRuntime`、`host.events`、`share.open`、`share.setTarget`、`navigation.openNativePage`、`navigation.canGoBack`、`app.openExternalUrl`、`clipboard.writeText`、`haptics.impact` 和 Android 返回键回退;其中 `share.setTarget` / `share.open` 会解析统一分享目标里的 `title`、`message`、`url`、`work`、`path` 或 `targetPath` 并调用 React Native 系统分享面板;`navigation.openNativePage` 在 Expo 壳内只接受同源 H5 route 并切换 WebView URL,不伪造尚未存在的登录、支付或其它原生页面,`navigation.canGoBack` 由 WebView 导航状态变化实时注入 H5,`app.openExternalUrl` 只允许 `http:`、`https:`、`mailto:`、`tel:` 外链协议。登录、支付和本地文件导出尚未接入渠道 SDK / 原生文档能力时明确返回 unsupported,让 H5 fallback 承接。
|
||||
|
||||
### Phase 3:Tauri 桌面壳 MVP
|
||||
|
||||
|
||||
Reference in New Issue
Block a user