next.js 单击按钮时执行服务器端shell脚本

kgsdhlau 于 2022-11-05 发布在 Shell

关注(0)|答案(1)|浏览(195)

我正在尝试执行一个位于服务器上的shell脚本。我需要在执行后得到这个shell脚本的（字符串）结果。但是，这个脚本应该只有在我的ReactJS应用程序中的某个按钮被按下时才会被触发。
我花了大量的时间寻找答案。到目前为止，所有的答案都指向一个想法，即创建一个Web服务，然后让应用程序在单击按钮时调用该服务。但没有一个答案指出这是如何实现的，也没有任何答案指向任何讨论这种方法的文章。（如果这是一个基本方法，请抱歉，我上个月刚刚从Udemy学习了ReactJS。）
您是否介意创建一个简单的代码来演示“shell脚本web服务”和按钮（onClick）之间的通信？或者至少提供一个讨论这种方法的文章链接？
谢谢你的帮助。
编辑：到目前为止，我尝试的是How to execute shell command in Javascript。但是评论说这在浏览器上不起作用。我猜这就是我需要在我的Web服务中编写的代码？

next.js

来源：https://stackoverflow.com/questions/71646984/execute-server-side-shell-script-on-button-click

1条答案

按热度按时间

bihw5rsg1#

最后，我得到了它。下面是我所做的。
步骤1：创建一个页面/api/execute. js（适当地命名文件）
第2步：将这个示例shell脚本（ls命令）放入execute.js

export default function handler(req, res) {
  const execSync = require('child_process').execSync;
  // import { execSync } from 'child_process';  // replace ^ if using ES modules

  const output = execSync('ls', { encoding: 'utf-8' });  // the default is 'buffer'
  const splitted = output.split(/\r?\n/);  
  const filtered = splitted.filter( e => {
    return e !== '';
  });

  res.status(200).json(JSON.stringify(filtered))
}

步骤3：在react组件中，添加一个带有onClick处理函数的按钮，如下所示：

<Button primary onClick={this.execCommand}>Execute Shell Command</Button>

步骤4：创建execCommand函数：

async execCommand() {
    const req = await fetch("/api/execute");
    const data = await req.json();
    console.log(data);
}

步骤5：单击按钮，然后在浏览器控制台上查看输出。
干杯干杯干杯

赞(0）回复(0）举报 2022-11-05

我来回答

next.js 单击按钮时执行服务器端shell脚本

1条答案

相关问题

热门标签

最新问答