caf*_*172 6 html css python pyscript
我正在尝试调用我创建的 python 函数。但没有得到任何输出,也没有资源如何实现。
\n代码 :
\n<!DOCTYPE html>\n<html>\n<head>\n<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />\n<script defer src="https://pyscript.net/alpha/pyscript.js"></script>\n</head>\n<body>\n\n<p>Click on the "Choose File" button to upload a file:</p>\n\n<form>\n <input type="file" id="myFile" name="filename">\n <input type="submit" onClick="readfile(filename)" name="SUBMIT">\n</form>\n\n<py-script>\n\ndef readfile(filename):\n with open(filename) as mfile:\n head = [next(mfile) for x in range(1,5)]\n print(head)\n\n</py-script>\n\n</body>\n</html>\nRun Code Online (Sandbox Code Playgroud)\n如果有人提供像 \xe2\x80\xa6 这样的输入,那将会非常有帮助
\n如何将选定的文件传递给我的函数,并且 python 将被执行并在屏幕上返回输出。
\n在浏览器中编写 Python 时,必须重新考虑操作的执行方式。通常,Python 程序是过程化的。基于浏览器的应用程序是异步的。
第一步是启用异步功能:
import asyncio
Run Code Online (Sandbox Code Playgroud)
基于浏览器的程序无法直接访问本地文件系统。您的代码没有按照您的想法进行操作。
def readfile(filename):
with open(filename) as mfile:
head = [next(mfile) for x in range(1,5)]
print(head)
Run Code Online (Sandbox Code Playgroud)
您的代码正在从允许的浏览器虚拟文件系统中读取。您正在尝试处理来自 ` 元素的事件,但尝试访问不同的位置。
注意:我不知道“filename”的文件内容是什么,所以读取文件后我没有合并你的代码。
您的代码无法读取文件。您必须要求浏览器读取您的应用程序的文件。这是通过 FileReader 类执行的。
例子:
async def process_file(event):
# Currently, PyScript print() does not work in this
# type of code (async callbacks)
# use console.log() to debug output
fileList = event.target.files.to_py()
for f in fileList:
data = await f.text()
document.getElementById("content").innerHTML = data
# Add your own code to process the "data" variable
# which contains the content of the selected file
Run Code Online (Sandbox Code Playgroud)
另一个问题是您将 Python 函数作为回调传递。这是行不通的。相反,您必须调用create_proxy()为 Python 函数创建回调代理。浏览器将调用代理,然后代理调用您的 Python 函数。
例子:
# Create a Python proxy for the callback function
# process_file() is your function to process events from FileReader
file_event = create_proxy(process_file)
# Set the listener to the callback
document.getElementById("myfile").addEventListener("change", file_event, False)
Run Code Online (Sandbox Code Playgroud)
我在我的网站上放置了该解决方案的副本。您可以在页面上右键下载源代码。
完整的解决方案:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
<title>File Example</title>
</head>
<body>
<p>This example shows how to read a file from the local file system and display its contents</p>
<br />
<p>Warning: Not every file type will display. PyScript removes content with tags such as XML, HTML, PHP, etc. Normal text files will work.</p>
<br />
<p>No content type checking is performed to detect images, executables, etc.</p>
<br />
<label for="myfile">Select a file:</label>
<input type="file" id="myfile" name="myfile">
<br />
<br />
<div id="print_output"></div>
<br />
<p>File Content:</p>
<div style="border:2px inset #AAA;cursor:text;height:120px;overflow:auto;width:600px; resize:both">
<div id="content">
</div>
</div>
<py-script output="print_output">
import asyncio
from js import document, FileReader
from pyodide import create_proxy
async def process_file(event):
fileList = event.target.files.to_py()
for f in fileList:
data = await f.text()
document.getElementById("content").innerHTML = data
def main():
# Create a Python proxy for the callback function
# process_file() is your function to process events from FileReader
file_event = create_proxy(process_file)
# Set the listener to the callback
e = document.getElementById("myfile")
e.addEventListener("change", file_event, False)
main()
</py-script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)