在Web Worker中使用Pyodide时如何实现stdin输入处理？

核心思路是利用SharedArrayBuffer + Atomics实现Web Worker与主线程的同步通信——因为Pyodide的stdin回调要求同步返回结果，异步的postMessage无法直接满足需求，必须让Worker阻塞等待主线程的输入响应后再返回内容。

实现步骤与代码示例 #

1. 主线程代码（负责接收用户输入并通知Worker）

// 主线程逻辑
const worker = new Worker('pyodide-worker.js');

// 初始化共享内存（长度按需调整，这里设1024字节足够存储常规输入）
const buffer = new SharedArrayBuffer(1024);
const inputArray = new Uint8Array(buffer);

// 将共享内存传递给Worker
worker.postMessage({ type: 'init-shared-buffer', buffer });

// 监听Worker的输入请求
worker.addEventListener('message', (e) => {
  if (e.data.type === 'request-input') {
    // 用prompt或自定义UI获取用户输入（这里用原生prompt示例）
    const userInput = prompt('请输入内容：') || '';
    
    // 将输入内容编码后写入共享内存，末尾加换行符模拟终端输入行为
    const encoder = new TextEncoder();
    const encodedContent = encoder.encode(userInput + '\n');
    inputArray.set(encodedContent, 0);
    
    // 通知Worker：输入已准备好
    Atomics.notify(inputArray, 0, 1);
  }
});

2. Web Worker代码（Pyodide初始化与stdin回调实现）

// pyodide-worker.js
importScripts('https://cdn.jsdelivr.net/pyodide/v0.25.0/full/pyodide.js');

let inputArray;

// 接收主线程传递的共享内存
self.addEventListener('message', (e) => {
  if (e.data.type === 'init-shared-buffer') {
    inputArray = new Uint8Array(e.data.buffer);
    initPyodide();
  }
});

async function initPyodide() {
  const pyodide = await loadPyodide();
  
  // 配置stdin处理函数
  pyodide.setStdin({
    stdin: () => {
      // 向主线程发送输入请求
      self.postMessage({ type: 'request-input' });
      
      // 阻塞等待主线程的通知（Atomics.wait会暂停Worker执行，直到收到notify）
      Atomics.wait(inputArray, 0, 0);
      
      // 从共享内存读取输入内容
      const decoder = new TextDecoder();
      let inputContent = '';
      let index = 0;
      while (inputArray[index] !== 0 && index < inputArray.length) {
        inputContent += decoder.decode(new Uint8Array([inputArray[index]]));
        index++;
      }
      
      // 重置共享内存，避免下次读取旧内容
      inputArray.fill(0);
      
      // 返回输入内容给Pyodide
      return inputContent;
    }
  });
  
  // 测试代码：运行需要stdin的Python逻辑
  pyodide.runPython(`
user_name = input("请输入你的名字：")
print(f"你好，{user_name}!")
`);
}

关键注意事项 #

• 跨源隔离配置：SharedArrayBuffer需要浏览器启用跨源隔离，服务器必须返回以下响应头：

  Cross-Origin-Opener-Policy: same-origin
  Cross-Origin-Embedder-Policy: require-corp
  

• 共享内存长度：根据业务需求调整SharedArrayBuffer的大小，确保能容纳用户的最大输入长度
• 输入格式处理：给输入内容添加换行符\n，匹配Pythoninput()函数读取到换行终止的行为

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