PyScript 中 'await' 语法错误排查与解决-html教程-PHP中文网

PyScript 中 'await' 语法错误排查与解决

DDD

发布： 2025-08-30 18:35:00

原创

575人浏览过

pyscript 中 'await' 语法错误排查与解决

摘要：本文旨在帮助开发者解决在使用 PyScript 构建项目时遇到的 SyntaxError: 'await' outside function 错误。我们将分析错误原因，并提供详细的修改方案，包括引入 asyncio 库、正确使用 async 函数以及处理未定义元素等问题，确保 PyScript 代码能够顺利执行。

在使用 PyScript 开发 Web 应用时，你可能会遇到 SyntaxError: 'await' outside function 这样的错误。这个错误通常表明你在一个非 async 函数中使用了 await 关键字。await 关键字只能在 async 函数内部使用，用于等待一个异步操作完成。

常见原因与解决方案

缺少 asyncio 库的导入

PyScript 应用如果使用了异步函数，需要显式导入 asyncio 库。在 <py-script> 标签内的 Python 代码头部添加以下语句：
```
import asyncio
```
登录后复制
在非 async 函数中使用 await

await 关键字必须在 async 函数内部使用。如果你的代码中包含了 await 语句，确保它位于一个使用 async 关键字定义的函数中。例如：
```
async def my_async_function():
    # 异步操作
    result = await some_async_operation()
    return result
```
登录后复制
如果你的代码中直接在顶层使用了 await，你需要将其放入一个 async 函数中，并调用这个函数。

例如，将以下代码：

法语写作助手
法语助手旗下的AI智能写作平台，支持语法、拼写自动纠错，一键改写、润色你的法语作文。

31

查看详情
```
await show(fileInput,'fileinput')
await show(uploadButton,'upload')
await show(to_pred,'to_predict')
uploadButton.on_click(process_file)
```
登录后复制
修改为：
```
async def init():
    uploadButton.on_click(process_file)
    await show(fileInput,'fileinput')
    await show(uploadButton,'upload')
    await show(to_pred,'to_predict')

init()
```
登录后复制
HTML 元素未定义

在你的代码中，可能引用了未在 HTML 中定义的元素。例如，代码中使用了 to_predict，但可能在 HTML 中没有相应的 <div id="to_predict"></div> 元素。请确保所有在 Python 代码中引用的 HTML 元素都已正确定义。

示例代码修改

针对提供的代码，以下是修改后的版本，修复了 await 错误并添加了必要的 asyncio 库导入：

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Linear Regression Predict</title>
    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css"/>
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>

    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vega@5"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vega-lite@5"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vega-embed@6"></script>
    <script type="text/javascript" src="https://unpkg.com/tabulator-tables@5.4.4/dist/js/tabulator.js"></script>
    <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-2.4.2.js"></script>
    <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-widgets-2.4.2.min.js"></script>
    <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-tables-2.4.2.min.js"></script>
    <script type="text/javascript" src="https://unpkg.com/@holoviz/panel@0.13.1/dist/panel.min.js"></script>
    <script type="text/javascript">
      Bokeh.set_log_level("info");
    </script>

    <py-env>
        - numpy 
        - pandas
        - scikit-learn
        - panel==0.13.1a2
    </py-env>

</head>
<body style="background-color:rgb(255, 255, 255)">
    <h1>Upload CSV</h1>

    <div id="fileinput"></div>
    <div id="upload"></div>
    <div id="to_predict"></div>
    <div id="op"></div>

    <p id="regression-op"></p>

    <py-script>
import asyncio
import pandas as pd 
from sklearn.linear_model import LinearRegression
from sklearn.model_selection import train_test_split
from panel.io.pyodide import show
import numpy as np
import panel as pn
import io

fileInput = pn.widgets.FileInput(accept=".csv")
uploadButton = pn.widgets.Button(name="Show Prediction",button_type='primary')
to_pred = pn.widgets.Spinner(name="Total Installs",value=500,step=50,start=50)

def process_file(event):
    if fileInput.value is not None:
      data = pd.read_csv(io.BytesIO(fileInput.value))
      x = data[['High']]
      y = data[['Volume']]

      lr = LinearRegression()
      lr.fit(x,y)
      y_hat = lr.predict(np.array(to_pred.value).reshape(1,-1))

      reg_op = Element('regression-op')
      reg_op.write(str(y_hat))

async def init():
    uploadButton.on_click(process_file)
    await show(fileInput,'fileinput')
    await show(uploadButton,'upload')
    await show(to_pred,'to_predict')

init()
    </py-script>
</body>
</html>

登录后复制

注意事项：

确保所有依赖库都已正确安装在 <py-env> 中。
检查 HTML 元素 ID 与 Python 代码中的引用是否一致。
在处理文件上传时，确保 io.BytesIO 能够正确读取文件内容。

总结

通过理解 await 关键字的使用限制，并结合 asyncio 库，可以有效解决 PyScript 中 SyntaxError: 'await' outside function 错误。同时，确保 HTML 元素定义完整，可以避免其他潜在的问题。希望本文能够帮助你顺利进行 PyScript 项目的开发。

以上就是PyScript 中 'await' 语法错误排查与解决的详细内容，更多请关注php中文网其它相关文章！