百度360必应搜狗淘宝本站头条
python类型转换python串口编程python计时python异常python进度条
当前位置：网站首页 > 技术资源 > 正文

PyScript:让Python在HTML中运行（html调用python程序）

off999 2024-11-10 10:33 17 浏览 0 评论

大家好，我是DD，已经是封闭在家的第51天了！

最近一直在更新Java新特性（https://www.didispace.com/java-features/）和IDEA Tips（https://www.didispace.com/idea-tips/）两个原创专栏，其他方向内容的动态关注少了。昨天天晚上刷推的时候，瞄到了这个神奇的东西，觉得挺cool的，拿出来分享下：

相信你看到图，不用我说，你也猜到是啥了吧？html里可以跑python代码了！

看到好多Python公众号已经开始猛吹未来了，但乍看怎么觉得有点像JSP？或者一些模版引擎？是进步还是倒退呢？与其瞎想，不如仔细看看这个东东的能力吧！

根据官方介绍，这个名为PyScript的框架，其核心目标是为开发者提供在标准HTML中嵌入Python代码的能力，使用 Python调用JavaScript函数库，并以此实现利用Python创建Web应用的功能。

看到介绍里提到了调用JavaScript函数库的能力，看来跟JSP或者模版引擎还是有区别的。

PyScript 快速体验

官方给了一个例子，可以帮助我们观的感受这个开发框架的能力，不妨跟着DD看看，它能做啥吧！

第一个案例，hello world

代码很简单，就下面这几行。你只需要创建一个html文件，然后复制进去就可以了。

<html>
  <head>
    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
  </head>
  <body> 
    <py-script> 
        print('Hello, World!') 
    </py-script> 
  </body>
</html>

保存好之后，在浏览器里打开就能看到这样的页面了：

回头再看看这个html里的内容，三个核心内容：

  • 引入pyscript的样式文件：<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
  • 引入pyscript的脚本文件：<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
  • <py-script>标签中写具体的python代码来输出Hello World

如果你懒得自己敲代码的话，本文的两个案例代码我打包放在公众号了，需要的朋友可以关注公众号“程序猿DD”，回复：pyscript 获取。

第二个案例，数据定义 + 数据展示

先创建一个data.py文件，然后加入前面的代码。功能很简单，就是随机生成（x，y）的坐标

import numpy as np

def make_x_and_y(n):
    x = np.random.randn(n)
    y = np.random.randn(n)
    return x, y

再创建一个html文件，加入下面的代码

<html>
    <head>
      <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
      <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
      <py-env>
        - numpy
        - matplotlib
        - paths:
          - /data.py
      </py-env>
    </head>

  <body>
    <h1>Let's plot random numbers</h1>
    <div id="plot"></div>
    <py-script output="plot">
    import matplotlib.pyplot as plt
    from data import make_x_and_y

    x, y = make_x_and_y(n=1000)

    fig, ax = plt.subplots()
    ax.scatter(x, y)
    fig
    </py-script>
  </body>
</html>

这里就稍微复杂一些了，除了hello world中的几个要点外，这里还有这几个要关注的地方：

  • <py-env>标签：这里声明要引入的包和要引入的文件（上面创建的data.py）
  • <py-script output="plot">：这里定义了要在<div id="plot"></div>中输出的内容，可以看到这里的逻辑都是用python写的

这个页面的执行效果是这样的：

是不是很神奇呢？整个过程中都没有大家熟悉的cs、js内容，就完成了这样一个图的页面实现。

小结

最后，谈谈在整个尝试过程中，给我的几个感受：

  1. 开发体验上高度统一，对于python开发者来说，开发Web应用的门槛可以更低了
  2. 感觉性能上似乎有所不足，几个复杂的案例执行有点慢，开始以为是部分国外cdn的缘故，后来移到本地后，还是慢。这部分可能还需要进一步优化。

这个开发框架目前还只是alpha版本，未来一定还会有更多特性与优化出来，总体上我觉得这个框架还是非常cool的，尤其对于刚学会Python，或者只会Python，但又想快速开发Web应用的小伙伴来说，可能将会是个不错的选择，那你觉得这个框架如何？未来会不会火？留言区聊聊吧！

相关推荐

第九章:Python文件操作与输入输出

9.1文件的基本操作9.1.1打开文件理论知识：在Python中，使用open()函数来打开文件。open()函数接受两个主要参数：文件名和打开模式。打开模式决定了文件如何被使用，常见的模式有：&...

Python的文件处理

一、文件处理的流程1.打开文件，得到文件句柄并赋值给一个变量2.通过句柄对文件进行操作3.关闭文件示例：d=open('abc')data1=d.read()pri...

Python处理文本的25个经典操作

Python处理文本的优势主要体现在其简洁性、功能强大和灵活性。具体来说，Python提供了丰富的库和工具，使得对文件的读写、处理变得轻而易举。简洁的文件操作接口Python通过内置的open()函数...

Python学不会来打我(84)python复制文件操作总结

上一篇文章我们分享了python读写文件的操作，主要用到了open()、read()、write()等方法。这一次是在文件读写的基础之上，我们分享文件的复制。#python##python自学##...

python 文件操作

1.检查目录/文件使用exists()方法来检查是否存在特定路径。如果存在，返回True；如果不存在，则返回False。此功能在os和pathlib模块中均可用，各自的用法如下。#os模块中e...

《文件操作(读写文件)》

一、文件操作基础1.open()函数核心语法file=open("filename.txt",mode="r",encoding="utf-8"...

栋察宇宙(二十一):Python 文件操作全解析

分享乐趣，传播快乐，增长见识，留下美好。亲爱的您，这里是LearingYard学苑！今天小编为大家带来“Python文件操作全解析”欢迎您的访问！Sharethefun,spreadthe...

值得学习练手的70个Python项目(附代码)，太实用了

Python丰富的开发生态是它的一大优势，各种第三方库、框架和代码，都是前人造好的“轮子”，能够完成很多操作，让你的开发事半功倍。下面就给大家介绍70个通过Python构建的项目，以此来学习Pytho...

python图形化编程:猜数字的游戏

importrandomnum=random.randint(1,500)running=Truetimes=0##总的次数fromtkinterimport*##导入所有tki...

一文讲清Python Flask的Web编程知识

刚入坑Python做Web开发的新手，还在被配置臃肿、启动繁琐折磨？Flask这轻量级框架最近又火出圈，凭5行代码启动Web服务的极致简洁，让90后程序员小张直呼真香——毕竟他刚用这招把部署时间从半小...

用python 编写一个hello，world

第一种：交互式运行一个hello，world程序：这是写python的第一步，也是学习各类语言的第一步，就是用这种语言写一个hello，world程序.第一步，打开命令行窗口，输入python，第二步...

python编程:如何使用python代码绘制出哪些常见的机器学习图像?

专栏推荐绘图的变量单变量查看单变量最方便的无疑是displot（）函数，默认绘制一个直方图，并你核密度估计（KDE）sns.set(color_codes=True)np.random.seed(su...

如何编写快速且更惯用的 Python 代码

Python因其可读性而受到称赞。这使它成为一种很好的第一语言，也是脚本和原型设计的流行选择。在这篇文章中，我们将研究一些可以使您的Python代码更具可读性和惯用性的技术。我不仅仅是pyt...

Python函数式编程的详细分析(代码示例)

本篇文章给大家带来的内容是关于Python函数式编程的详细分析（代码示例），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。FunctionalProgramming，函数式编程。Py...

编程小白学做题:Python 的经典编程题及详解，附代码和注释(七)

适合Python3+的6道编程练习题（附详解）1.检查字符串是否以指定子串开头题目描述：判断字符串是否以给定子串开头（如"helloworld"以"hello&...

取消回复欢迎 你 发表评论:

一周热门
最近发表
标签列表
Copyright Your WebSite.Some Rights Reserved.