在浏览器中运行Python:PyScript入门指南

Python已成为众多数据专业人士的标准编程语言。它不仅在数据处理、机器学习模型开发及简单应用开发方面非常有用,而且应用广泛。

传统上,运行Python程序通常需要在本地系统配置环境,或使用付费的云服务器服务。然而,还有一种高效的替代方案,可以直接在浏览器中运行Python,这就是PyScript。

本文将介绍如何使用PyScript,在平台内运行Python及开发应用。

Run Python in Your Browser with PyScript: A Beginner’s Guide

你是否充满好奇?让我们正式开始吧。


Python与PyScript

PyScript是由Anaconda团队开发的开源平台,旨在让用户能够在浏览器中运行Python。它的目标是让Python真正无处不在,无需依赖任何工具生态或服务器环境,只需一个浏览器(和网络连接)即可。

PyScript平台使用简便。你仅需做最基本的设置,便可在浏览器中创建并运行Python应用。在PyScript平台中开发的应用也可分享和扩展(免费用户最大支持1 MB),且不限制你创建应用的数量。

接下来,让我们开始用PyScript来运行Python脚本。首先,你需要注册一个PyScript.com账号。任选一种认证方式完成注册后,你会进入如下所示的PyScript仪表盘页面。

Run Python in Your Browser with PyScript: A Beginner’s Guide

在仪表盘页面,你可以创建新项目,或查看PyScript为你准备的示例项目,从中获得灵感来开发自己的应用。这些示例丰富多样,值得学习和借鉴。


Run Python in Your Browser with PyScript: A Beginner’s Guide

在本教程中,我们将通过自己创建项目,学习如何在PyScript中运行Python。选择“创建新项目”,你会看到类似下图的全新Python开发环境。


Run Python in Your Browser with PyScript: A Beginner’s Guide

默认情况下,PyScript应用需要以下三个文件:

  • index.html:作为系统前端页面;

  • pyscript.json或pyscript.toml:用于描述应用的Python运行环境;

  • Python脚本(通常命名为main.py):用于控制应用的具体逻辑。

现在,我们将通过PyScript运行Python,并在平台上创建一个简单应用。这个应用将生成虚假信息并以HTML形式显示。

首先,进入已有的pyscript.toml文件,填写如下信息:

name = "PyScript信息生成器"
description = "一个用于生成虚假信息的简单应用"
packages = ["faker"]

你可以根据需要修改应用名称和描述,但最重要的是packages字段。我们将在应用中使用Faker库来生成姓名、地址、电话号码等虚假信息。

接下来,设置index.html文件。此文件已包含默认代码,我们只需完善Body标签部分即可。可使用如下代码来添加生成信息的按钮和占位符:

<button py-click="get_information">获取新的个人信息</button>
<div id="name"></div>
<div id="address"></div>
<div id="phone"></div>

如上代码所示,按钮标签中含有py-click="get_information"属性。当按钮被点击时,将调用main.py中定义的get_information函数。同时,我们为Python输出内容分别预设了不同id的div标签。

Python代码如下:

from faker import Faker
from pyscript import document

def get_information(event):
    fake = Faker()
    name_text = document.querySelector("#name")
    name_text.innerText = f"姓名: {fake.name()}"

    address_text = document.querySelector("#address")
    address_text.innerText = f"地址: {fake.address()}"

    phone_text = document.querySelector("#phone")
    phone_text.innerText = f"电话: {fake.phone_number()}"

上述代码通过PyScript库从HTML页面中获取信息,实现index.html和main.py之间的协作,使Python应用正常运行。

最终,你的Python应用看起来会类似于下图所示:


Run Python in Your Browser with PyScript: A Beginner’s Guide


恭喜你!你已经成功通过PyScript运行了Python脚本。如果你想进一步了解或回顾所开发的Python应用,可以访问相关页面。此外,强烈建议参考PyScript官方文档,探索更多PyScript的强大功能。


结论

Python是最受欢迎的编程语言之一,而PyScript为不想折腾环境的用户提供了一种全新运行方式。本文介绍了如何使用PyScript并开发了一个简单的Python应用,且全程免费。

希望本文对你有所帮助!

### Python 脚本与浏览器交互的方式 要使 Python 脚本能够在浏览器运行并与之交互,可以采用多种技术和框架来实现这一目标。以下是几种常见的解决方案及其特点: #### 使用 Flask 实现 Web 应用程序 Flask 是一种轻量级的 Python Web 框架,能够帮助开发者创建动态网页并处理 HTTP 请求和响应。通过 Flask 构建的应用程序可以在本地或远程服务器上运行,并允许用户通过浏览器访问。 - **基本原理**:Flask 提供了一个路由机制,用于定义 URL 和对应的视图函数之间的映射关系。当客户端发送请求到指定的 URL 时,Flask 将调用相应的视图函数并将返回的内容呈现给用户[^1]。 ```python from flask import Flask, request, jsonify app = Flask(__name__) @app.route('/add', methods=['POST']) def add(): data = request.json result = data['a'] + data['b'] return jsonify({'result': result}) if __name__ == '__main__': app.run(debug=True) ``` 上述代码展示了如何接收来自前端的数据并通过计算后将其作为 JSON 响应返回给浏览器。 --- #### 利用 PyScript 运行Python 代码 PyScript 是一项新兴技术,它使得可以直接在 HTML 文件内部嵌入 Python 代码片段,并由浏览器解释执行而无需额外配置环境。 - **优势**:简化了传统意义上需要后台支持才能完成的任务流程;适合初学者或者希望快速构建原型项目的人群使用[^4]。 ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>PyScript Example</title> <script defer src="https://pyscript.net/latest/pyscript.js"></script> </head> <body> <py-script> def greet(name): return f'Hello {name}!' print(greet('World')) </py-script> </body> </html> ``` 此例子说明了怎样利用 `<py-script>` 标签将简单的逻辑引入页面之中[^4]。 --- #### 结合 Brython 执行 JavaScript 替代方案 Brython (Browser Python) 可看作是对标准 CPython 的重新编译版本之一,在保留大部分语法特性的同时兼容主流浏览器平台上的 DOM API 访问能力。 - **工作方式**:加载完成后会替换掉原始标签中的内容为实际渲染后的效果;同时也可以像操作常规 JS 对象一样操纵文档节点树结构[^5]。 ```javascript // Assuming brython is already loaded into the page. document.addEventListener("DOMContentLoaded", function() { window.brython(1); }); ``` 配合下面这段 pythonic 风格声明即可轻松控制 UI 组件行为模式[^5]: ```python from browser import document, alert def echo(event): alert(f"You entered: {event.target.value}") input_field = document["my-input"] button = document["submit-btn"] button.bind("click", lambda ev: echo(ev)) ``` 以上实例演示了绑定事件监听器的过程以及触发弹窗提示框功能的具体做法[^5]。 --- ### 总结 每种方法都有其适用场景和技术局限性。如果追求高效稳定的服务端架构,则推荐选用成熟的 WSGI 接口规范下的应用框架如 Django 或者本文提到的小巧灵活型代表——Flask 来搭建完整的 RESTful API 接口服务; 若仅仅是为了展示教学用途或是简单实验性质的话,那么尝试一下新颖有趣的跨语言混合编程工具链比如 pyscript/brython 不失为明智之举[^4][^5].
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值