Cordova iOS内置WKWebView下内联Web Worker使用importScripts的方案咨询

方案1：改用独立Worker文件（推荐） #

内联Worker因无关联实际文件路径导致self.location为null，最直接的解决方式是把Worker代码抽成独立JS文件，放在项目www目录下。比如创建www/worker.js，主页面调用时直接指定路径：

const worker = new Worker('./worker.js');

此时Worker的self.location会正常指向该文件路径，importScripts可以直接使用相对路径加载其他脚本：

// worker.js 内部
importScripts('./utils/helper.js');

方案2：手动注入基础路径到内联Worker #

如果必须保留内联写法，可在主页面先获取当前页面的基础路径，再把路径嵌入Worker代码中：

// 主页面获取当前页面的基础路径（去掉文件名部分）
const baseUrl = window.location.origin + window.location.pathname.replace(/[^/]+$/, '');

// 构造内联Worker代码，注入基础路径
const workerScript = `
  const BASE_URL = '${baseUrl}';
  // 用BASE_URL拼接脚本路径
  importScripts(BASE_URL + 'libs/worker-utils.js');
  
  // 剩余Worker逻辑...
`;

// 创建内联Worker
const blob = new Blob([workerScript], { type: 'application/javascript' });
const worker = new Worker(URL.createObjectURL(blob));

这样Worker就能通过手动传入的BASE_URL加载所需脚本，无需依赖self.location。

方案3：修改Cordova配置放宽Worker安全限制 #

针对Worker无法加载本地JS的安全限制，可在config.xml中添加WKWebView相关配置，放宽文件访问权限：

<platform name="ios">
  <!-- 允许Worker从file://URL访问其他本地资源 -->
  <preference name="WKWebViewAllowFileAccessFromFileURLs" value="true" />
  <preference name="WKWebViewAllowUniversalAccessFromFileURLs" value="true" />
</platform>

这些配置能解除WKWebView对本地文件跨路径访问的限制，让Worker正常加载项目内的其他JS文件。

额外提示 #

• 若使用Cordova iOS 8.0.0，建议先查阅官方更新日志，确认是否有针对Worker路径问题的原生修复。
• 独立Worker文件方案不仅解决路径问题，还更便于代码调试和维护，优先推荐。

内容的提问来源于stack exchange，提问作者David Martin