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

【问题标题】：Run local external python script in terminal from Vue application从 Vue 应用程序在终端中运行本地外部 python 脚本
【发布时间】：2019-07-23 15:43:46
【问题描述】：

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

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

我在网上看到这样做需要服务器。有没有人有好的建议我怎么做？

我听说只使用 'child_process' 从 node js 但我不能在 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>

【问题讨论】：

它不在 vue 的范围内 - 你需要一个能够运行 python 脚本的 jitter 范围 - node、electron、自定义 v8 实现
因此你会建议使用节点或电子或其他？因为它只是一个简单的按钮
如果是桌面 gui 使用 elektron (node)，在 vue ui 中添加电子插件并使用 child -process 或一些 python lib

标签： javascript firebase vue.js server

【解决方案1】：

您可以按照@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 从 vue 调用服务器了 -

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

我认为无论如何你都不能直接从 js 或 vue 调用 python 脚本。

【讨论】：

【解决方案2】：

您需要在本地机器上安装 django 或 flask。像她一样做一个restful apihttps://flask-restful.readthedocs.io/en/latest/quickstart.html#a-minimal-api

在里面写你的python
使用restful url从vue js调用python代码。

【讨论】：