如何使用Brython导入库

6
我希望在Brython中导入自己的库。文档这一页介绍了如何通过将适当的目录添加到Python路径来实现,但我无法使其工作,因为我无法让Brython导入sys
以下是Brython文档第一页的最简单示例代码:
<html>
<head>
<script src="../src/Brython3.2.8/brython.js"></script>
</head>
<body onload="brython()">
<script type="text/python">
  from browser import document, alert

  def echo(ev):
    alert(document["zone"].value)

  document['mybutton'].bind('click', echo)
</script>
<input id="zone"><button id="mybutton">click !</button>
</body>
</html>

这很好用。

但如果我尝试导入sys:

<html>
<head>
<script src="../src/Brython3.2.8/brython.js"></script>
</head>
<body onload="brython()">
<script type="text/python">
  import sys
  from browser import document, alert

  def echo(ev):
    alert(document["zone"].value)

  document['mybutton'].bind('click', echo)
</script>
<input id="zone"><button id="mybutton">click !</button>
</body>
</html>

那么HTML将会显示,但是按钮不会有任何作用。

Chrome浏览器的控制台会显示以下错误:

brython.js:6929 XMLHttpRequest cannot load file:///C:/Users/XXXXXXXXX/XXXXXX/src/Brython3.2.8/Lib/sys.py?v=1476283159509. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
    $download_module    @ brython.js.6929
    import_py           @ brython.js.6929
    exec_module         @ brython.js.6929
etc etc

那么,我如何在Brython中导入sys,在Python中如何导入自己的库?
谢谢。
3个回答

4

您需要在HTML代码中包含brython_stdlib.js。因此,您的HTML应该如下所示:

<html>
    <head>
        <script src="../src/Brython3.2.8/brython.js"></script>
        <script src="../src/Brython3.2.8/brython_stdlib.js"></script>
    </head>
    <body onload="brython()">
        <script type="text/python">
            import sys
            from browser import document, alert

            def echo(ev):
                alert(document["zone"].value)

            document['mybutton'].bind('click', echo)
        </script>
        <input id="zone"><button id="mybutton">click !</button>
   </body>
</html>

0

Brython 无法 从用户计算机上任何 Python 安装的任何 Python 包中导入。它通过转译为 JavaScript 并在浏览器的 Javascript 引擎中运行来工作。它不知道任何本地 Python 安装,并且不需要存在任何此类安装。

使用 Python 标准库

添加一个脚本标签以包含 brython_stdlib.js 和基本的 brython.js。几个 CDN 已经提供了这个功能。

Python 标准库的 Brython 实现与参考实现并不完全匹配。有关包含内容和组织方式的详细信息,请参见 文档

从文档内导入您自己的代码

出于组织目的,HTML 文档中的 Python 代码可以分成多个 <script> 标签。标签的 id 属性给出了一个“模块名称”,可以在其他脚本中的 import 语句中使用,只要该脚本已经执行。文档中包含一个示例:

<script type="text/python" id="module">
def hello():
    return "world"
</script>

<script type="text/python">
from browser import document
import module

document.body <= module.hello()
</script>

浏览器将首先加载第一个<script>标签,创建一个名为module的Python模块(JavaScript表示),其中包含hello函数。第二个脚本标记将能够import该模块并像在Python中一样使用该函数。

从服务器导入您自己的代码

按照文档中所述,在适当的位置上使文件可用。 Brython的import语句实现(等效地,__import__内置函数)将尝试使用AJAX在服务器上查找代码。

将您自己的代码作为编译后的Brython软件包导入

文档中所述,使用Brython软件包(pip install brython)创建代表Python代码的JavaScript文件。(对于第三方库,还要检查是否已经有这样的JavaScript文件来自CDN。)

假设我们有一个创建名为example的包的项目。导航到包含该包的文件夹(根据项目的组织方式,可以是src或项目文件夹),然后运行brython-cli make_package example
这应该会生成一个example.brython.js文件。将其放置在服务器上的某个位置,并配置服务器以在特定URL处托管该文件。然后将相应的标记添加到客户端页面源代码(或生成该页面的模板)中。
之后,在Brython代码中就可以使用import examplefrom example import ...等语句了。
或者,使用brython-cli modules,如“优化”部分所述,创建一个表示整个服务器端部分的组合库JavaScript文件。

0

源代码: https://github.com/imvickykumar999/Brython/blob/master/index.html#L36

已部署代码: https://imvickykumar999.github.io/Brython/

<!doctype html>
<html>

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Brython</title>

  <script
    type="text/javascript"
    src="https://cdn.jsdelivr.net/npm/brython@3.8.9/brython.min.js">
  </script>

  <script
    type="text/javascript"
    src="https://cdn.jsdelivr.net/npm/brython@3.8.9/brython_stdlib.js">
  </script>

  <link
    rel="stylesheet"
    href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
    integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk"
    crossorigin="anonymous">

</head>
  <body onload="brython()">

    <style>
    body {
        /* background-color: yellow; */
        background-image: url(https://images.unsplash.com/photo-1573196872258-41425124bf5d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1050&q=80);
/*         background-repeat: no-repeat; */
    }
    </style>

    <script type="text/python">

      from browser import document

      def calc(a, b, o):
        d = { '+' : a+b,
              '-' : a-b,
              '*' : a*b,
              '/' : a/b,
              '%' : a%b
            }

        return f"({a}{o}{b})=({d[o]})"

      a = float(input('Enter first number : '))
      b = float(input('Enter second number : '))
      o = input('Enter the Operator (+,-,*,/,%) : ')

      document <= calc(a, b, o)

    </script>
  </body>
</html>

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接