@quicktvui/web-cli 2.4.2 → 3.1.0

package/README.md

@@ -1,8 +1,8 @@
-# @quicktvui/web-cli v2
+# @quicktvui/web-cli v3
 
-QuickTVUI Web 开发服务器 CLI 工具，v2 采用委托构建 + Bundle 加载模式。
+QuickTVUI Web 开发服务器 CLI 工具，v3 采用委托构建 + Bundle 加载模式。
 
-## v2 架构变化
+## v3 架构说明
 
 | 项 | v1 | v2 |
 |---|---|---|
@@ -16,11 +16,11 @@ QuickTVUI Web 开发服务器 CLI 工具，v2 采用委托构建 + Bundle 加载
 ## 安装
 
 ```bash
-npm install @quicktvui/web-cli@2 --save-dev
+npm install @quicktvui/web-cli@3 --save-dev
 # 或
-yarn add @quicktvui/web-cli@2 --dev
+yarn add @quicktvui/web-cli@3 --dev
 # 或
-pnpm add @quicktvui/web-cli@2 -D
+pnpm add @quicktvui/web-cli@3 -D
 ```
 
 ## 前置要求
@@ -63,11 +63,11 @@ npx qt-web-cli
   -o, --open                自动打开浏览器
   -h, --help                显示帮助信息
   -v, --version             显示 CLI 版本
-  --info                    显示 CLI 和 web-renderer 版本
+  --info                    显示 CLI 和 web-runtime 版本
   --dev-script <name>       指定要运行的 npm script (默认: dev)
   --dist-dir <path>         指定构建产物目录 (默认: dist/dev)
   --no-auto-build           跳过自动调用 dev 脚本，仅启动服务器
-  --v1                      使用 v1 模式 (webpack 自构建，已废弃)
+  --v1                      已移除，仅保留参数兼容提示
 ```
 
 ### 使用场景
@@ -94,11 +94,11 @@ qt-web-cli --dev-script build
 # 使用 npm run build 替代 npm run dev
 ```
 
-#### 4. 使用 v1 模式
+#### 4. `--v1` 兼容提示
 
 ```bash
 qt-web-cli --v1
-# 回退到 v1 模式（webpack 自构建），已废弃
+# 提示 v1 已移除，请使用默认 web-runtime 模式
 ```
 
 ## 工作流程

package/bin/qt-web-cli.js

@@ -44,31 +44,29 @@ if (args.v || args.version) {
   process.exit(0)
 }
 
+function resolvePackageJson(possiblePaths) {
+  for (const pkgPath of possiblePaths) {
+    try {
+      return require(pkgPath)
+    } catch (e) {}
+  }
+  return null
+}
+
 // 显示详细信息
 if (args.info) {
   const cliPkg = require(path.join(__dirname, '../package.json'))
   console.log(`@quicktvui/web-cli v${cliPkg.version}`)
-  console.log(`  Mode: v2 (delegate build)`)
-  try {
-    let rendererPkg
-    const possiblePaths = [
-      '@quicktvui/web-renderer/package.json',
-      path.join(__dirname, '../../web-renderer/package.json'),
-      path.join(__dirname, '../../../web-renderer/package.json'),
-    ]
-    for (const pkgPath of possiblePaths) {
-      try {
-        rendererPkg = require(pkgPath)
-        break
-      } catch (e) {}
-    }
-    if (rendererPkg) {
-      console.log(`@quicktvui/web-renderer v${rendererPkg.version}`)
-    } else {
-      console.log('@quicktvui/web-renderer (not installed)')
-    }
-  } catch (e) {
-    console.log('@quicktvui/web-renderer (not installed)')
+  console.log(`  Mode: v2 (web-runtime)`)
+  const runtimePkg = resolvePackageJson([
+    '@quicktvui/web-runtime/package.json',
+    path.join(__dirname, '../../web-runtime/package.json'),
+    path.join(__dirname, '../../../web-runtime/package.json'),
+  ])
+  if (runtimePkg) {
+    console.log(`@quicktvui/web-runtime v${runtimePkg.version}`)
+  } else {
+    console.log('@quicktvui/web-runtime (not installed)')
   }
   process.exit(0)
 }
@@ -86,11 +84,11 @@ Options:
   -o, --open                自动打开浏览器
   -h, --help                显示帮助信息
   -v, --version             显示 CLI 版本
-  --info                    显示 CLI 和 web-renderer 版本
+  --info                    显示 CLI 和 web-runtime 版本
   --dev-script <name>       指定要运行的 npm script (默认: dev)
   --dist-dir <path>         指定构建产物目录 (默认: dist/dev)
   --no-auto-build           跳过自动调用 dev 脚本，仅启动服务器
-  --v1                      使用 v1 模式 (webpack 自构建，已废弃)
+  --v1                      已移除，仅保留参数兼容提示
 
 v2 模式 (默认):
   自动检测项目的 dev 脚本，调用 npm run dev 构建产物
@@ -98,14 +96,14 @@ v2 模式 (默认):
   支持热更新 (SSE)
 
 v1 模式 (--v1):
-  使用内置 webpack 配置自行构建项目 (已废弃)
+  已移除，web-cli 统一走 web-runtime
 
 Examples:
   qt-web-cli                      # v2 模式，自动构建+启动
   qt-web-cli --no-auto-build      # v2 模式，仅启动服务器（需先手动 npm run dev）
   qt-web-cli --dev-script build   # 使用 build 脚本替代 dev
   qt-web-cli --port 8080          # 指定端口
-  qt-web-cli --v1                 # 使用 v1 模式
+  qt-web-cli --v1                 # 提示 v1 已移除
   `)
   process.exit(0)
 }
@@ -117,8 +115,8 @@ Examples:
 async function main() {
   // 强制使用 v1 模式
   if (args.v1) {
-    signale.warn('v1 模式已废弃，建议迁移到 v2 模式')
-    return runV1()
+    signale.error('v1 模式已移除，请使用默认的 web-runtime 模式')
+    process.exit(1)
   }
 
   signale.pending('正在启动 QuickTVUI Web CLI v2 ...')
@@ -144,8 +142,8 @@ async function main() {
   const distFullPath = path.join(projectRoot, distDir)
 
   if (!devScript && !fs.existsSync(distFullPath)) {
-    signale.warn('项目未配置 dev 脚本且 dist/dev 目录不存在，回退到 v1 模式')
-    return runV1()
+    signale.error('项目未配置 dev 脚本，且 dist/dev 目录不存在，无法启动 web-runtime 模式')
+    process.exit(1)
   }
 
   // ============================================================================
@@ -336,127 +334,6 @@ async function main() {
   process.on('SIGTERM', cleanup)
 }
 
-// ============================================================================
-// v1 模式 (webpack 自构建，已废弃)
-// ============================================================================
-
-function runV1() {
-  signale.pending('正在启动 QuickTVUI Web CLI v1 (webpack 模式)...')
-
-  // 查找项目根目录
-  const projectRoot = findProjectRoot()
-  if (!projectRoot) {
-    signale.error('无法找到项目根目录')
-    process.exit(1)
-  }
-
-  signale.info(`项目根目录: ${projectRoot}`)
-
-  // 读取 package.json
-  let pkg = {}
-  try {
-    pkg = require(path.join(projectRoot, 'package.json'))
-  } catch (e) {}
-
-  // 检测入口文件
-  let mainEntry
-  let entryType
-
-  const entryCandidates = [
-    { name: 'src/main-native.ts', path: './src/main-native.ts', type: 'package' },
-    { name: 'src/main-native.js', path: './src/main-native.js', type: 'package' },
-    { name: 'src/main.ts', path: './src/main.ts', type: 'package' },
-    { name: 'src/main.js', path: './src/main.js', type: 'package' },
-    { name: 'main (package.json)', path: pkg.main, type: 'package' },
-  ]
-
-  for (const candidate of entryCandidates) {
-    if (!candidate.path) continue
-    const entryFullPath = path.resolve(projectRoot, candidate.path)
-    if (fs.existsSync(entryFullPath)) {
-      mainEntry = candidate.path
-      entryType = candidate.type
-      signale.info(`主入口: ${mainEntry}`)
-      break
-    }
-  }
-
-  if (!mainEntry) {
-    signale.error('无法找到有效的入口文件')
-    process.exit(1)
-  }
-
-  const mainEntryPath = path.resolve(projectRoot, mainEntry)
-
-  // 设置环境变量
-  process.env.NODE_ENV = 'development'
-  process.env.QUICKTVUI_PROJECT_ROOT = projectRoot
-  process.env.QUICKTVUI_MAIN_ENTRY = mainEntryPath
-  process.env.QUICKTVUI_ENTRY_TYPE = entryType
-  process.env.QUICKTVUI_PORT = String(args.port)
-
-  // 检测 OpenSSL 版本
-  const needLegacyProvider = checkOpenSSLVersion(process.versions.openssl)
-  if (needLegacyProvider) {
-    signale.warn(`检测到 OpenSSL ${process.versions.openssl}，已添加 --openssl-legacy-provider`)
-    process.env.NODE_OPTIONS = '--openssl-legacy-provider'
-  }
-
-  signale.pending(`启动开发服务器: http://localhost:${args.port}`)
-
-  // 使用 webpack Node API 启动开发服务器
-  const defaultConfigPath = path.resolve(__dirname, '../lib/webpack.config.js')
-  const userConfigPath = args.config ? path.resolve(projectRoot, args.config) : null
-  startDevServer(defaultConfigPath, args.port, args.open, userConfigPath)
-}
-
-/**
- * 使用 webpack Node API 启动开发服务器 (v1)
- */
-function startDevServer(configPath, port, shouldOpen, userConfigPath) {
-  const webpack = require('webpack')
-  const WebpackDevServer = require('webpack-dev-server')
-  const { merge } = require('webpack-merge')
-
-  let config = require(configPath)
-
-  if (userConfigPath) {
-    if (!fs.existsSync(userConfigPath)) {
-      signale.error(`自定义配置文件不存在: ${userConfigPath}`)
-      process.exit(1)
-    }
-    signale.info(`加载用户配置: ${userConfigPath}`)
-    const userConfig = require(userConfigPath)
-    config = merge(config, userConfig)
-  }
-
-  config.devServer = config.devServer || {}
-  config.devServer.port = port
-  config.devServer.open = false
-
-  const compiler = webpack(config)
-  const server = new WebpackDevServer(config.devServer, compiler)
-
-  server.startCallback((err) => {
-    if (err) {
-      signale.error('启动开发服务器失败:', err.message)
-      process.exit(1)
-    }
-    signale.success(`开发服务器已启动: http://localhost:${port}`)
-
-    if (shouldOpen) {
-      openBrowser(`http://localhost:${port}`)
-    }
-  })
-
-  process.on('SIGINT', () => {
-    server.stopCallback(() => {
-      signale.info('开发服务器已停止')
-      process.exit(0)
-    })
-  })
-}
-
 // ============================================================================
 // 工具函数
 // ============================================================================
@@ -483,13 +360,6 @@ function detectDevScript(pkg, scriptName) {
   return null
 }
 
-function checkOpenSSLVersion(version) {
-  if (!version) return false
-  const match = /^(\d+)\.(\d+)\.(\d+)/.exec(version)
-  if (!match) return false
-  return parseInt(match[1], 10) >= 3
-}
-
 function formatSize(bytes) {
   if (bytes < 1024) return bytes + ' B'
   if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + ' KB'

package/lib/DevServer.js

@@ -400,7 +400,7 @@ class DevServer {
     }
 
     // proxy 代理
-    if (pathname.startsWith('/proxy/')) {
+    if (pathname === '/proxy' || pathname.startsWith('/proxy/')) {
       this._handleProxy(req, res, pathname)
       return
     }
@@ -508,27 +508,48 @@ class DevServer {
   /**
    * 处理代理请求
    *
-   * URL 格式: /proxy/{http|https}/{host}[:port]/{path}[?query]
+   * URL 格式:
+   *   1. /proxy/{http|https}/{host}[:port]/{path}[?query]
+   *   2. /proxy?url={encodeURIComponent(fullUrl)}
    * 示例:
    *   /proxy/https/api.example.com/v1/data → https://api.example.com/v1/data
    *   /proxy/https/api.example.com:8443/v1/data → https://api.example.com:8443/v1/data
+   *   /proxy?url=https%3A%2F%2Fapi.example.com%2Fv1%2Fdata → https://api.example.com/v1/data
    */
   _handleProxy(req, res, pathname) {
-    // 从完整 URL 中提取查询参数（pathname 只有路径部分）
     const fullUrl = url.parse(req.url, true)
-    const queryString = fullUrl.search || ''
+    const rawTargetUrl = fullUrl.query && fullUrl.query.url
+
+    let protocol
+    let hostPort
+    let proxyPath
+
+    if (rawTargetUrl) {
+      try {
+        const targetUrl = new URL(rawTargetUrl)
+        protocol = targetUrl.protocol.replace(':', '')
+        hostPort = targetUrl.host
+        proxyPath = `${targetUrl.pathname}${targetUrl.search}`
+      } catch (e) {
+        res.writeHead(400, { 'Content-Type': 'text/plain' })
+        res.end('Invalid proxy url query param')
+        return
+      }
+    } else {
+      // 从完整 URL 中提取查询参数（pathname 只有路径部分）
+      const queryString = fullUrl.search || ''
+      const match = pathname.match(/^\/proxy\/(https?)\/([^/]+)(\/.*)?$/)
+      if (!match) {
+        res.writeHead(400, { 'Content-Type': 'text/plain' })
+        res.end('Invalid proxy URL format. Use: /proxy/{http|https}/{host}[:port]/{path}')
+        return
+      }
 
-    const match = pathname.match(/^\/proxy\/(https?)\/([^/]+)(\/.*)?$/)
-    if (!match) {
-      res.writeHead(400, { 'Content-Type': 'text/plain' })
-      res.end('Invalid proxy URL format. Use: /proxy/{http|https}/{host}[:port]/{path}')
-      return
+      protocol = match[1]
+      hostPort = match[2]
+      proxyPath = (match[3] || '/') + queryString
     }
 
-    const protocol = match[1]
-    const hostPort = match[2]
-    const proxyPath = (match[3] || '/') + queryString
-
     // 分离 host 和 port
     let hostname = hostPort
     let port = protocol === 'https' ? 443 : 80
@@ -538,17 +559,33 @@ class DevServer {
       port = parseInt(parts[1], 10) || port
     }
 
-    // 过滤掉 hop-by-hop 头，避免转发问题
-    const headers = { ...req.headers }
-    delete headers['host']
-    delete headers['connection']
-    delete headers['keep-alive']
-    delete headers['transfer-encoding']
-    delete headers['te']
-    delete headers['trailer']
-    delete headers['upgrade']
-    delete headers['proxy-connection']
-    headers['host'] = hostPort
+    // console.log('[Proxy] incoming request:', {
+    //   method: req.method,
+    //   requestUrl: req.url,
+    //   target: `${protocol}://${hostPort}${proxyPath}`,
+    //   range: req.headers && req.headers.range,
+    // })
+
+    // Media/file download proxy should forward a minimal header set.
+    // Forwarding browser-only headers (origin, referer, sec-fetch-*, cookies)
+    // can cause some signed upstream URLs to be rejected with 400.
+    const headers = {
+      host: hostPort,
+      'user-agent': req.headers['user-agent'] || 'Mozilla/5.0',
+      accept: req.headers.accept || '*/*',
+    }
+    if (req.headers.range) {
+      headers.range = req.headers.range
+    }
+    if (req.headers['if-range']) {
+      headers['if-range'] = req.headers['if-range']
+    }
+    if (req.headers['if-none-match']) {
+      headers['if-none-match'] = req.headers['if-none-match']
+    }
+    if (req.headers['if-modified-since']) {
+      headers['if-modified-since'] = req.headers['if-modified-since']
+    }
     // 标记请求来自代理（方便调试）
     headers['x-forwarded-for'] = req.socket.remoteAddress
     headers['x-forwarded-proto'] = protocol
@@ -564,6 +601,14 @@ class DevServer {
 
     const httpModule = protocol === 'https' ? require('https') : require('http')
     const proxyReq = httpModule.request(options, (proxyRes) => {
+      // console.log('[Proxy] upstream response:', {
+      //   method: req.method,
+      //   requestUrl: req.url,
+      //   target: `${protocol}://${hostPort}${proxyPath}`,
+      //   statusCode: proxyRes.statusCode,
+      //   contentType: proxyRes.headers['content-type'],
+      //   contentRange: proxyRes.headers['content-range'],
+      // })
       // 代理响应添加 CORS 头
       const responseHeaders = { ...proxyRes.headers }
       responseHeaders['access-control-allow-origin'] = this.corsOrigin
@@ -660,6 +705,7 @@ class DevServer {
         c.style.visibility = 'visible';
       }
     }
+
     scaleApp();
     window.addEventListener('resize', scaleApp);
   </script>

package/lib/entry-package.js

@@ -1,74 +1,7 @@
-// @quicktvui/web-cli - web entry
-// 通过 @quicktvui/web-renderer 导入所有依赖
-// 动态加载主入口，确保初始化顺序正确
+// Legacy v1 browser entry.
+// web-cli now serves web-runtime and lets web-runtime own the renderer bootstrap.
+// This stub intentionally avoids importing web-renderer directly.
 
-console.log('[Web Renderer] === Starting initialization ===')
-
-import {
-  initAsyncLocalStorage,
-  initAutoProxy,
-  setupSceneBuilder,
-  createWebEngine,
-  applyAllPatches,
-  TVFocusManager,
-  startWebEngine,
-  APP_NAME,
-  IJKPlayerComponent,
-} from '@quicktvui/web-renderer'
-import { setupGlobalErrorHandler } from './error-badge.js'
-
-// 初始化 async localStorage
-initAsyncLocalStorage()
-
-// 初始化自动代理
-initAutoProxy()
-
-// 注册 IJKPlayerComponent
-global.__WEB_COMPONENTS__ = global.__WEB_COMPONENTS__ || {}
-global.__WEB_COMPONENTS__['IJKPlayerComponent'] = IJKPlayerComponent
-
-// 设置 SceneBuilder
-setupSceneBuilder()
-
-// 创建 Web 引擎
-const engine = createWebEngine()
-
-// 应用所有补丁
-applyAllPatches(engine)
-
-// 初始化 TV 焦点管理器
-global.__TV_FOCUS_MANAGER__ = new TVFocusManager()
-console.log('[Web Renderer] TVFocusManager initialized')
-
-// 初始化错误提示组件（在 DOM 准备好后）
-if (document.readyState === 'loading') {
-  document.addEventListener('DOMContentLoaded', () => setupGlobalErrorHandler())
-} else {
-  setupGlobalErrorHandler()
-}
-console.log('[Web Renderer] Error badge initialized')
-
-// 注入全局 CSS
-const styleEl = document.createElement('style')
-styleEl.id = 'web-platform-reset'
-styleEl.textContent = `
-  #app, #app * { align-items: flex-start; }
-  [style*="align-items"] { align-items: var(--align-items, center) !important; }
-`
-document.head.appendChild(styleEl)
-console.log('[Web Renderer] Global CSS reset injected')
-
-// 动态加载主入口，等待加载完成后再启动引擎
-console.log('[Web Renderer] Importing main module...')
-import(__QUICKTVUI_MAIN_ENTRY__)
-  .then(() => {
-    console.log('[Web Renderer] Main module loaded')
-    console.log('[Web Renderer] Starting engine...')
-    startWebEngine(engine, APP_NAME)
-    setTimeout(() => {
-      console.log('[Web Renderer] === Initialization complete ===')
-    }, 1000)
-  })
-  .catch((err) => {
-    console.error('[Web Renderer] Failed to load main module:', err)
-  })
+throw new Error(
+  '[web-cli] v1 mode has been removed. Use the default web-runtime based flow instead of direct web-renderer bootstrap.'
+)

package/lib/index.js

@@ -74,16 +74,6 @@ function detectDevBundle(projectRoot) {
  * 检测 web renderer 类型（v1 兼容）
  */
 function detectWebRendererType(projectRoot) {
-  if (fs.existsSync(path.join(projectRoot, 'src/web/index.js'))) {
-    return 'local'
-  }
-  try {
-    const projectPkg = require(path.join(projectRoot, 'package.json'))
-    const deps = { ...projectPkg?.dependencies, ...projectPkg?.devDependencies }
-    if (deps['@quicktvui/web-renderer']) {
-      return 'package'
-    }
-  } catch (e) {}
   return 'package'
 }
 

package/lib/webpack.config.js

@@ -162,6 +162,14 @@ module.exports = {
         changeOrigin: true,
         secure: false,
         router: (req) => {
+          try {
+            const requestUrl = new URL(req.url, 'http://localhost')
+            const rawUrl = requestUrl.searchParams.get('url')
+            if (rawUrl) {
+              const targetUrl = new URL(rawUrl)
+              return `${targetUrl.protocol}//${targetUrl.host}`
+            }
+          } catch (e) {}
           const match = req.url.match(/^\/proxy\/(https?)\/([^/]+)(\/.*)?$/)
           if (match) {
             return `${match[1]}://${match[2]}`
@@ -169,6 +177,14 @@ module.exports = {
           return 'http://placeholder'
         },
         pathRewrite: (path, req) => {
+          try {
+            const requestUrl = new URL(path, 'http://localhost')
+            const rawUrl = requestUrl.searchParams.get('url')
+            if (rawUrl) {
+              const targetUrl = new URL(rawUrl)
+              return `${targetUrl.pathname}${targetUrl.search}`
+            }
+          } catch (e) {}
           const match = path.match(/^\/proxy\/(https?)\/[^/]+(\/.*)?$/)
           if (match) {
             return match[2] || '/'
@@ -257,6 +273,9 @@ module.exports = {
       {
         test: /\.js$/,
         exclude: /node_modules/,
+        resolve: {
+          fullySpecified: false,
+        },
         use: [
           {
             loader: 'babel-loader',

package/package.json

@@ -1,13 +1,17 @@
 {
   "name": "@quicktvui/web-cli",
-  "version": "2.4.2",
-  "description": "CLI tool for QuickTVUI web development v2 - delegate build & bundle loading",
+  "version": "3.1.0",
+  "description": "CLI tool for QuickTVUI web development v3 - delegate build & bundle loading",
   "author": "QuickTVUI Team",
   "license": "Apache-2.0",
   "bin": {
     "qt-web-cli": "./bin/qt-web-cli.js"
   },
   "main": "lib/index.js",
+  "scripts": {
+    "sync-runtime": "rm -rf runtime/*.js && cp ../web-runtime/dist/web-runtime.*.js runtime/",
+    "prepublishOnly": "npm run sync-runtime"
+  },
   "files": [
     "bin",
     "lib",
@@ -82,8 +86,5 @@
   },
   "engines": {
     "node": ">=16.0.0"
-  },
-  "scripts": {
-    "sync-runtime": "rm -rf runtime/*.js && cp ../web-runtime/dist/web-runtime.*.js runtime/"
   }
-}
+}