Chrome为何随机生成VM实例？如何强制selfie_segmentation WASM脚本无VM运行

首先明确浏览器控制台日志里的@VM+数字前缀的本质：这是浏览器对动态插入、内联、通过eval/Blob URL加载的脚本自动生成的临时标识，并不是脚本本身自带的属性，出现该标识说明当前运行的selfie_segmentation_…_simd_wasm_bin.js是运行时动态生成注入的，而非静态加载的固定资源，这种动态加载方式经常会伴随WASM绑定上下文异常，进而导致程序卡住。

具体解决方法 #

• 替换动态加载逻辑为静态加载
  先将selfie_segmentation_…_simd_wasm_bin.js以及对应的wasm资源文件全部下载到项目本地静态资源目录，直接在页面头部通过<script>标签提前引入该js文件，不要使用Mediapipe SDK默认的运行时动态拉取逻辑。
• 初始化时显式指定静态资源路径
  初始化SelfieSegmentation实例时，通过locateFile配置强制所有关联资源走本地静态路径，示例配置如下：

  const selfieSegmentation = new SelfieSegmentation({
    locateFile: (file) => {
      return `/你的本地静态资源目录路径/${file}`;
    },
    // 额外添加配置禁用WASM流式编译，避免动态生成临时脚本标识
    wasmLoaderOptions: { compileStreaming: false }
  });
  

• 禁用Blob/eval类动态执行逻辑
  如果你当前项目中存在将该js文件内容用Blob包裹、通过URL.createObjectURL生成临时地址加载的逻辑，全部删除，直接走静态资源请求加载即可，Blob加载的脚本一定会被浏览器标记为VM临时资源。

完成以上调整后，浏览器就会使用真实的静态文件路径标记控制台日志，不会再生成VM前缀，对应的运行阻塞问题也会同步解决。

内容的提问来源于stack exchange，提问作者Dimitrios Ververidis