如何在浏览器中显示 Node.js REPL

Question

如何在浏览器中显示 Node.js REPL

Yuv*_*als 5 javascript node.js read-eval-print-loop

我目前正在运行 Node.jsrepl来评估代码，使用常规的推荐 repl.startconst repl = Repl.start({ prompt }); 这会按预期启动控制台。我希望从我的浏览器向服务器发送代码，以便对其进行评估并将其显示在浏览器中，但是没有找到任何文档可以这样做。这可能吗？

Answer 1

And*_*chi 5

这有可能吗？

是的，而且它也非常危险，因为脚本可能需要一些文件系统实用程序并开始复制、删除或读取浏览器无法通过 Web 服务器访问的文件。

话虽这么说，假设您知道自己在问什么，这是一个如何实现类似目标的示例。

为简单起见，它使用套接字，但您可以使用 fetch 一次发送所有数据并接收输出结果。

包.json

{
  "name": "browser-repl",
  "main": "index.js",
  "dependencies": {
    "express": "^4.17.1",
    "pocket.io": "^0.1.4"
  }
}

Run Code Online (Sandbox Code Playgroud)

索引.html

<!doctype html>
<html>
  <head>
    <script src="/pocket.io/pocket.io.js"></script>
    <script>
    this.onload = () => {
      const socket = io();
      socket.on('eval', result => {
        repl.value += result;
      });
      sender.addEventListener('click', () => {
        const {value} = repl;
        repl.value = '';
        socket.emit('eval', value.trim() + '\n');
      });
    };
    </script>
  </head>
  <body>
    <textarea id="repl"></textarea>
    <button id="sender">evaluate</button>
  </body>
</html>

Run Code Online (Sandbox Code Playgroud)

索引.js

const repl = require('repl');
const app = require('express')();
const http = require('http').Server(app);
const io = require('pocket.io')(http);

app.get('/', function(req, res){
  res.sendFile(__dirname + '/index.html');
});

io.on('connection', function(socket){
  let connected = true;
  const r = repl.start({
    writer(data) {
      if (connected)
        socket.emit('eval', data);
      return data;
    }
  });
  socket.on('eval', function (input) {
    r.input.emit('data', input);
  });
  socket.on('disconnect', function () {
    connected = false;
    r.input.emit('data', '.exit\n');
  });
});

http.listen(3000, function(){
  console.log('listening on *:3000');
});

Run Code Online (Sandbox Code Playgroud)

您可以npm i在包含 3 个文件的文件夹中，然后运行node .或node index.js并转至http://localhost:3000/。

请随意在文本区域中输入1+1您喜欢的任何内容，然后按evaluate。

这显然是关于如何开始的提示，因此您的问题应该以某种方式得到回答。

问候

归档时间：	6 年，9 月前
查看次数：	732 次
最近记录：	6 年，9 月前