feat: 本地优先启动服务拦截
This commit is contained in:
53
src/index.js
53
src/index.js
@@ -119,12 +119,10 @@ function registerServiceWorker() {
|
||||
}
|
||||
}
|
||||
|
||||
// 启动应用(MSW 异步初始化,不阻塞首屏渲染)
|
||||
function startApp() {
|
||||
// Create root
|
||||
// 渲染应用
|
||||
function renderApp() {
|
||||
const root = ReactDOM.createRoot(document.getElementById('root'));
|
||||
|
||||
// ✅ 先渲染应用,不等待 MSW
|
||||
// StrictMode 已启用(Chakra UI 2.10.9+ 已修复兼容性问题)
|
||||
root.render(
|
||||
<React.StrictMode>
|
||||
@@ -139,33 +137,30 @@ function startApp() {
|
||||
</React.StrictMode>
|
||||
);
|
||||
|
||||
// ✅ 后台异步启动 MSW(不阻塞首屏渲染)
|
||||
if (process.env.NODE_ENV === 'development' && process.env.REACT_APP_ENABLE_MOCK === 'true') {
|
||||
const initMSW = async () => {
|
||||
try {
|
||||
const { startMockServiceWorker } = await import('./mocks/browser');
|
||||
await startMockServiceWorker();
|
||||
console.log(
|
||||
'%c[MSW] ✅ Mock Service Worker 已在后台启动',
|
||||
'color: #4CAF50; font-weight: bold;'
|
||||
);
|
||||
} catch (error) {
|
||||
console.error('[MSW] ❌ Mock Service Worker 启动失败:', error);
|
||||
}
|
||||
};
|
||||
|
||||
// 使用 requestIdleCallback 在浏览器空闲时初始化,不阻塞首屏
|
||||
if ('requestIdleCallback' in window) {
|
||||
requestIdleCallback(() => initMSW(), { timeout: 3000 });
|
||||
} else {
|
||||
// 降级:使用 setTimeout(0) 延迟执行
|
||||
setTimeout(initMSW, 0);
|
||||
}
|
||||
}
|
||||
|
||||
// 注册 Service Worker
|
||||
// 注册 Service Worker(非 Mock 模式)
|
||||
registerServiceWorker();
|
||||
}
|
||||
|
||||
// 启动应用
|
||||
async function startApp() {
|
||||
// ✅ 开发环境 Mock 模式:先启动 MSW,再渲染应用
|
||||
// 确保所有 API 请求(包括 AuthContext.checkSession)都被正确拦截
|
||||
if (process.env.NODE_ENV === 'development' && process.env.REACT_APP_ENABLE_MOCK === 'true') {
|
||||
try {
|
||||
const { startMockServiceWorker } = await import('./mocks/browser');
|
||||
await startMockServiceWorker();
|
||||
console.log(
|
||||
'%c[MSW] ✅ Mock Service Worker 已启动,开始渲染应用',
|
||||
'color: #4CAF50; font-weight: bold;'
|
||||
);
|
||||
} catch (error) {
|
||||
console.error('[MSW] ❌ Mock Service Worker 启动失败,继续渲染应用:', error);
|
||||
}
|
||||
}
|
||||
|
||||
// 渲染应用
|
||||
renderApp();
|
||||
}
|
||||
|
||||
// 启动应用
|
||||
startApp();
|
||||
Reference in New Issue
Block a user