通过前端网页调用python代码并传入参数

已于 2023-08-30 12:58:53 修改
阅读量1.4k 收藏 7
点赞数 2
分类专栏： 学习 文章标签： 前端 python 开发语言
于 2023-08-30 12:58:15 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/faithful1/article/details/132578833
版权

需求：有一段python代码“NSGA-II生成派车方案.py”，需要运行，但是调用这段代码的方式只能通过一个网页index.html，并且代码需要的参数只能通过网页前端的输入框传入。
image.png

前端网页调用python代码(使用ActiveX)

ActiveX是COM规范的一种实现，前身是OLE(Object Linking and Embedding)。一般读成：ActiveX Ctronl,译成：ActiveX控制，ActiveX控件。即可用于桌面也可用于网络，是封装、跨平台(兼容)与重用技术的延伸。封装与重用技术大概经历了以下几个历史阶段：
明码复用：就是写的代码，例如一个函数，通过复制粘贴方式重用;
静态库：把代码进行封装，只让使用者看到接口，不能看到具体内容，但是编译时静态库将一起载入，导致可执行文件庞大，且不宜升级，如果库中的内容有改动，则必须再次编译。
动态库：动态库发行接口不变的情况下，无须再编译主程序，升级方便，而且可以实现动态载入。
COM技术：但是动态库有环境兼容问题，C#写的动态库C++访问可能会有一定的问题，再一个如果同一台计算机中有N个程序要用到同一个动态库，那么要载入N次。COM技术能解决此问题，通过引用计数技术，只载入一次，大家共用资源，COM技术接口是统一的与语言无关，解决各种语言之间兼容问题。
COM+、DCOM技术：COM技术不能解决网络资源共享问题，只适用于单机，COM+、DCOM技术解决了此问题。不同计算机可通过网络远程共享资源。
ActiveX技术：在COM+、DCOM基础上发展了可视化，事件驱动，Web调用等。主要是Web上的应用，通过ActiveX技术能让Web像桌面程序一样与其他软件交互，如让Web与其他软件通过TCP/UDP方式通信; 也可以通过ActiveX让Web与串口通信。

这里需要使用IE浏览器打开以下网页

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"> 
    <title>Index Page</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f2f2f2;
            margin: 0;
            padding: 0;
        }
        
        .container {
            max-width: 1000px;
            margin: 0 auto;
            padding: 20px;
            background-color: #fff;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        }
        
        h1 {
            text-align: center;
            margin-bottom: 20px;
        }
        
        input[type="text"] {
            width: 100%;
            padding: 10px;
            max-width: 980px;
            margin-bottom: 10px;
            border: 1px solid #ccc;
            border-radius: 4px;
        }
        
        button {
            width: 100%;
            font-family: Arial, sans-serif;
            margin-bottom: 10px;
            font-weight: bolder;
            font-size: 20px;
            align-items: center;
            padding: 10px;
            background-color: #4caf50;
            color: #fff;
            border: none;
            border-radius: 4px;
            cursor: pointer;
        }

        p{
            font-family: Arial, sans-serif;
        }
        
        button:hover {
            background-color: #3e598e;
            color: rgb(89, 226, 15);
        }

        img {
            max-width: 100%;
            height: auto;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>车辆路径规划系统</h1>
        <img src="./pic2.png" alt="your image">
        <p>派车日期：</p>
        <input type="text" placeholder="输入派车日期,格式如2001-01-01" id="date">
        <button onclick="success()">生成派车方案</button>
        <button type="reset" id="reset" onclick="resetInput()">重置输入框</button>
    </div>
    <script>
        function success(){
            command = 'python D:/python新模型/NSGA-II生成派车方案.py'
            var ws = new ActiveXObject("WScript.Shell");
            var date = document.getElementById('date').value;

            var pattern = /^\d{4}-\d{2}-\d{2}$/; // 定义正则表达式，匹配'2001-01-01'格式的字符串
            if (!pattern.test(date)) { 
                alert('数据输入格式有误，请重新输入！'); 
                resetInput()
            } else {
                console.log(command+' '+date+'成功执行！');
                ws.run(command+' '+date);
                alert('派车方案已经生成！请在项目文件夹的'+date+'日派车结果.xlsx中查看')
            }
        }

        function resetInput() {
            var input = document.getElementById("date");
            input.value = "";
        }
    </script>
</body>
</html>

点击以上网页中的按钮，相当于在cmd中执行了以下命令“python D:/python新模型/NSGA-II生成派车方案.py”。这行命令的作用就是运行“D:/python新模型/NSGA-II生成派车方案.py”的代码。但是如果调用这段代码需要参数，我们如何将参数传入这段代码呢？

将参数传入python文件

这里传入参数可以使用sys库。假设“python D:/python新模型/NSGA-II生成派车方案.py”的详细代码如下

import sys
def run(arg):
	print(arg)
arg = sys.argv[1]
run(arg)

在cmd中调用这段代码，可以使用以下命令

python D:/python新模型/NSGA-II生成派车方案.py

如果需要传入参数，需要在命令后加上参数 arg，这里的arg可以替换为任何需要传递的参数

python D:/python新模型/NSGA-II生成派车方案.py arg

以上，我们已经完成了所有操作，只需要使用IE浏览器打开index.html网页，然后在输入框中输入我们传递的参数‘2001-01-01’，点击‘生成派车方案’按钮后，就会自动调用python文件，并传入参数，运行结果如下。
image.png
这里可以看到，返回结果为2001-01-01，说明程序运行正常，且参数传递成功！

TUUG
关注
  • 2
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
专栏目录
python flask框架实现传数据到js的方法分析
01-21
本文实例讲述了python flask框架实现传数据到js的方法。分享给大家供大家参考，具体如下： 首先要清楚后台和前端交互所采用的数据格式。 一般选JSON，因为和js完美贴合。 后台返回的数据进行序列化 在/...
人脸识别代码（用HTML调用Python）
05-07
这是一段人脸识别人脸检测等的python代码，包含了多个检测算法，并且做了一个HTML的网页交互界面。如果有问题，可以联系我。
前端运行python代码几种方式_前端项目部署方式
weixin_39769703的博客
11-25 963
前端项目部署方式目前我们很多项目还都是手动部署,部署的时候容易出错,还会引起网站短时间不可用.所以,我们将部署的工作放到jenkins上,让jenkins代替我们打包/发送至服务器/上传静态资源至cdn.现在整理了一下自动化部署的方式,分为静态网站部署和动态网站部署两部分.自动化部署的思路如下:1.触发构建(手动触发,代码仓库更新触发,其他项目构建触发);2.jenkins从代码仓库获取代码;3....
python执行python脚本命令,命令行运行python代码
w666666Wwwwwww的博客
02-23 466
大家都知道，排查问题的思路，第一步肯定是去查看日志，若这个 bug 隐藏的比较深，只有在特定场景下才会现身，那么还需要开发者，复现这个 bug，方能优化代码。pyc是一种二进制文件，是由py文件经过编译后，生成的文件，是一种byte code，py文件变成pyc文件后，加载的速度会有所提高。当你使用 import 导入一个包或模块时，Python 会去一些目录下查找，而这些目录是有优先级顺序的，正常人会使用。现在我使用如下命令，将该项目进行打包，其中 demo 是项目的文件夹名，
前端运行python代码几种方式_前端和python
weixin_39572794的博客
11-24 2059
广告关闭腾讯云11.11云上盛惠 ，精选热门产品助力上云，云服务器首年88元起，买的越多返的越多，最高返5000元！如果您细心对比过 json python sdk 和 xml python sdk 的文档，您会发现并不是一个简单的增量更新。 xml python sdk 在架构、可用性和安全性上有了非常大的提升，而且在易用性、健壮性和传输性能上也做了非常大的改进。 如果您想要升级到 xml py...
vue.js调用python测接口，实现响应式的输出代码
keyboard专栏
12-23 435
【代码】vue.js调用python测接口，实现响应式的输出代码。
学习python之编写简单简单连接数据库并执行查询操作
12-23
python 连接数据库操作, 方法如下: 在本机的mysql 数据库中有一个名为yao的库，其中有一个名为user的表，表中的内容如图 下面，则是python连接数据库的方法，及查找出表中的内容，代码如下： #! /usr/bin/python # filename conn.py import MySQLdb # 载入连接数据库模块 try: # 尝试连接数据库 conn = MySQLdb.connect("localhost","root","www","yao",charset="utf8") # 定义连接数据库的信息 exc
python:接口间数据传递与调用方法
09-19
今天小编就为大家分享一篇python:接口间数据传递与调用方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
python实现一个简单的接口与前端交互
热门推荐
大小都是愁的成长之路
06-22 1万+
python实现一个简单的接口与前端交互
JavaScript实现调用Python程序（附完整源码）
希望我的博客，能帮上你解决学习中工作中所遇到的问题
11-07 792
JavaScript实现调用Python程序（附完整源码）
在网页中执行python
08-22 2757
2、在这testpyscript.html和data.py文件目录下执行终端，也就命令行（windows）在网页中执行python,脚本，也就是在html中写python，或者引入python脚本代码。也就引入pyscript库，调用python脚本。
什么？你没听错，前端脚本也能运行Python 啦
前端达人
03-23 927
Pyodide旨在将Python的功能带到浏览器中。它是一个编译为WebAssembly的Python解释器，可以让您直接在网页中运行Python代码（类似JS）。这意味着您可以在Web应用程序中使用Python，而无需设置单独的服务器或后端。在本文中，我们将探讨Pyodide是什么，它如何工作以及如何在您自己的项目中使用它。延伸阅读：什么是WebAssembly？WebAssembly是一种低级...
pyno-router:通过nodejs后端将httphttps请求路由到python函数
05-13
PyNo路由器 这是一个简单的节点程序包，用于将http / https请求路由到python函数。 从Web UI前端调用python函数非常有用。 随时进行自己的更改和实验。 执照 以下应用程序以GNU GPLv3许可证发布。 请查看存储库中包含的LICENSE文件以获取更多信息。 用法 到目前为止，此应用程序接受来自GET请求的数据。 POST请求支持将在以后的版本中添加。 使用以下命令克隆存储库。 git clone https://github.com/IamVman/pyno-router.git 安装依赖项 导航到根目录并在npm命令下面运行，以安装缺少的依赖项或进行首次设置。 确保package.json文件位于根目录中。 npm install -g npm npm install 安装依赖项后，使用node server.js运行服务器 将数据传递到python
Django中URL的参数传递的实现
01-01
在Django中有非常强大的URL模块，可以按照开发者的想法来制定清晰的URL，同时支持正则表达式。此外，在URL中还可以传递参数。 1. Django处理请求的方式 1） Django通过URLconf模块来进行判断。通常情况下，这就是ROOT_URLCONF配置的价值，但是如果请求携带了一个urlconf的属性（通常被中间件设置），那么这个被携带的urlconf将会替代ROOT_URLCONF的配置。 2） Django会调用Python模块并寻找各种urlpatterns。这是一个属于django.conf.urls.url()实例的python列表。 3） Django会遍历每个URL
python&登录网站验证码的生成与识别系统(django)
11-21
用python实现登录网站验证码功能： 设计两种验证码： 1 图形验证码，用python web框架Django能够实现动态刷新。 2 滑动验证码： 1.服务端随机生成小拼块和带有抠图缺口的背景图片，并保存随机抠图位置坐标； 2.前端实现滑动交互，将小拼块拖到缺口上还原完整图，记录到用户拖动距离值； 3.前端将用户拖动距离值传入服务端，服务端校验误差是否在容许范围内 1、在验证码校验中，一旦校验失败，后台自动调用一次验证码刷新函数，保证后端验证码的随机性； 2、前端正常的浏览器操作在校验失败后调用刷新请求，保证每次失败后前端验证码的随机性； 3、后台进行验证码校验失败次数统计：设置一定时间间隔内相同 IP 允许验证失败的最大次数，一旦达到上限，则拒绝提供服务，类似账号锁定。针对登录、验证码校验等重要功能，添加失败次数统计，以应对暴力破解的请求行为
网页端调用客户端的cs 程序
08-18
网页端调用客户端的cs 程序
基于python+django的登录网站验证码的生成与识别系统的实现.zip
06-09
3.前端将用户拖动距离值传入服务端，服务端校验误差是否在容许范围内 1、在验证码校验中，一旦校验失败，后台自动调用一次验证码刷新函数，保证后端验证码的随机性； 2、前端正常的浏览器操作在校验失败后调用刷新...
JEECG表格选中状态怎么去掉
weixin_39031037的博客
04-19 599
官网代码（在取消选中状态的时候不生效）
C++ WebServer的细节理解
最新发布
我的博客
04-22 630
在非阻塞模式下，如果 I/O 操作不能立即完成（例如，因为没有数据可读 或 写缓冲区满），系统不会让调用进程阻塞等待，而是立即返回一个错误（通常为 EAGAIN 或 EWOULDBLOCK）。先查询文件描述符 fd 当前的标志，然后将 O_NONBLOCK 标志加入其中，并通过 F_SETFL 来更新文件描述符，最终实现将该文件描述符切换为非阻塞模式。这意味着，如果没有待处理的连接请求（即没有客户端尝试连接到服务器），accept() 会一直阻塞，直到有新的连接请求到达或发生其他特定条件（如超时）为止。
带有前端python调用api
04-07
以下是一个简单的例子，演示如何使用Python调用API并在前端中显示结果： 1. 在Python中编写一个函数来调用API ```python import requests def get_weather(city): url = 'https://api.openweathermap.org/data/2.5/weather?q={}&appid=API_KEY'.format(city) response = requests.get(url) data = response.json() return data ``` 该函数使用requests库向OpenWeatherMap API发送请求，并返回JSON格式的响应数据。 2. 在Flask中创建一个简单的Web应用程序 ```python from flask import Flask, render_template, request app = Flask(__name__) @app.route('/') def index(): return render_template('index.html') @app.route('/weather', methods=['POST']) def weather(): city = request.form['city'] data = get_weather(city) temperature = data['main']['temp'] description = data['weather'][0]['description'] return render_template('weather.html', temperature=temperature, description=description) ``` 该应用程序包含两个路由：主页和天气页面。主页使用模板引擎渲染HTML页面，而天气页面根据用户输入的城市名称调用get_weather函数并显示温度和天气描述。 3. 创建HTML模板 ```html <!DOCTYPE html> <html> <head> <title>Weather App</title> </head> <body> <form method="POST" action="/weather"> <label for="city">Enter city:</label> <input type="text" id="city" name="city"> <input type="submit" value="Get Weather"> </form> </body> </html> ``` 该模板包含一个简单的表单，用户可以在其中输入城市名称并提交。 4. 创建另一个HTML模板来显示天气信息 ```html <!DOCTYPE html> <html> <head> <title>Weather App - {{ temperature }}°F, {{ description }}</title> </head> <body> <h1>{{ temperature }}°F</h1> <p>{{ description }}</p> </body> </html> ``` 该模板显示当前温度和天气描述。 5. 运行应用程序 在命令行中运行以下命令启动Flask应用程序： ``` FLASK_APP=app.py flask run ``` 现在，您可以在浏览器中访问应用程序并输入城市名称来获取天气信息。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

TUUG

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值