javascript - 从 Vue 应用程序在终端中运行本地外部 python 脚本

标签 javascript firebase vue.js server

嗨,我是 vue js 和 firebase 的初学者。我正在使用 vue js 为网络入侵检测系统构建一个简单的 GUI。我编写了一个 python 脚本,允许我将输出从终端推送到 firebase。我目前正在本地主机上运行该应用程序:8080

但是,在我的 vue 应用程序中,我想在按下开始按钮时在终端中运行本地 python 脚本,并在按下停止按钮时终止进程。

I read online that doing it require a server. Does anyone have a good recommendation on how I can do it?

I hear that it may also be easier to just use 'child_process' from node js but I can't use it in vue js.

实现它的最佳/最简单方法是什么。

<template>
  <div id="new-packet">
    <h3>Start/Stop Analysis</h3>
    <button type="submit" class="btn">Start</button>
    <router-link to="/home" class="btn green">Stop</router-link>
  </div>
</template>

<script>
export default {
  name: 'new-packet',
  data () {
    return {}
  }
}
</script>

最佳答案

您可以按照@mustafa的建议使用FLASK/DJANGO为您的python函数设置restFul API,但如果您不想设置这些框架,那么您可以设置简单的http服务器处理程序 -

# This class contains methods to handle our requests to different URIs in the app
class MyHandler(SimpleHTTPRequestHandler):
    def do_HEAD(self):
        self.send_response(200)
        self.send_header('Content-type', 'text/html')
        self.end_headers()

    # Check the URI of the request to serve the proper content.
    def do_GET(self):
        if "URLToTriggerGetRequestHandler" in self.path:
            # If URI contains URLToTriggerGetRequestHandler, execute the python script that corresponds to it and get that data
            # whatever we send to "respond" as an argument will be sent back to client
            content = pythonScriptMethod()
            self.respond(content) # we can retrieve response within this scope and then pass info to self.respond
        else:
            super(MyHandler, self).do_GET() #serves the static src file by default

    def handle_http(self, data):
        self.send_response(200)
        # set the data type for the response header. In this case it will be json.
        # setting these headers is important for the browser to know what   to do with
        # the response. Browsers can be very picky this way.
        self.send_header('Content-type', 'application/json')
        self.end_headers()
        return bytes(data, 'UTF-8')

     # store response for delivery back to client. This is good to do so
     # the user has a way of knowing what the server's response was.
    def respond(self, data):
        response = self.handle_http(data)
        self.wfile.write(response)

# This is the main method that will fire off the server. 
if __name__ == '__main__':
    server_class = HTTPServer
    httpd = server_class((HOST_NAME, PORT_NUMBER), MyHandler)
    print(time.asctime(), 'Server Starts - %s:%s' % (HOST_NAME, PORT_NUMBER))
    try:
        httpd.serve_forever()
    except KeyboardInterrupt:
        pass
    httpd.server_close()
    print(time.asctime(), 'Server Stops - %s:%s' % (HOST_NAME, PORT_NUMBER))

然后您可以使用 AXIOS as 从 vue 调用服务器 -

new Vue({
  el: '#app',
  data () {
    return {
      info: null
    }
  },
  mounted () {
    axios
      .get('/URLToTriggerGetRequestHandler')
      .then(response => (this.info = response))
  }
})

我不认为你可以直接从 js 或 vue 调用 python 脚本。

关于javascript - 从 Vue 应用程序在终端中运行本地外部 python 脚本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57167822/

相关文章:

javascript - d3.js 使用 exit() 和 Enter() 进行子转换

javascript - 角色和用户的 Firestore 规则

javascript - 标题标签 html 内的 sup 标签

java - 我正在为 android 使用 Firebase Apple 登录

javascript - 如何在vuejs中追加多行

javascript - 如何在 vue.js 对象内循环数组

javascript - 将页面上的一堆输入存储到 JavaScript 数组中?

从 npm 安装的 firebase 部署和二进制文件?

node.js - (..).then 不是函数,firebase 云函数

javascript - 在模板 Vue 中插入一个脚本标签