Giới thiệu
Pyscript/Pyodide hỗ trợ khả năng tương tác tuyệt vời giữa JavaScript và Python. Python có thể gọi JavaScript và JavaScript có thể gọi Python. Các sự kiện DOM có thể sử dụng các hàm Python làm cuộc gọi lại. Bài viết này bao gồm Python gọi các chức năng JavaScript và cách truyền và nhận dữ liệu bằng proxy. Trong một bài viết khác, tôi đề cập đến việc gọi Python từ JavaScript và cách sử dụng Python trong các sự kiện.
Pyscript: Cuộc gọi lại sự kiện JavaScript
Pyodide gắn các hàm javascript vào không gian tên toàn cầu. Để nhập không gian tên toàn cầu vào Python bao gồm dòng này:
Nếu bạn sẽ gọi các hàm JavaScript Async, cũng thêm dòng này:
Gọi JavaScript từ Python
Ví dụ này xác định hàm JavaScript square[]
được gọi từ Python. Điều quan trọng là nhập mô -đun js
và gọi các hàm JavaScript bằng không gian tên js
. Đây là một ví dụ hoàn chỉnh mà bạn có thể sao chép và dán vào tệp cục bộ và tải vào trình duyệt. Tôi thích bắt đầu một máy chủ web Python đơn giản để chạy các ví dụ: python -m http.server 9000
. Các ví dụ trong tương lai sẽ không bao gồm nồi hơi HTML.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | Example1Example1
Nhập JSjs # Gọi hàm JS result=js.square[4]=js.square[4] print[result][result]
functionsquare[number]{square[number]{ returnnumber*number;returnnumber*number; Nhập JS
|
Nhập JS
# Gọi hàm JS
Nhập JSjs # Gọi hàm JSasyncio }=await js.square[4] print[result][result]
Nhập JSfunctionsquare[number]{ returnnumber*number;returnnumber*number; Nhập JS
|
Nhập JS
Nhập JSjs # Gọi hàm JSasyncio url="//api.ipify.org"="//api.ipify.org" }=await[await js.fetch[url]].text[] Gọi JavaScript Async từ Python['My Public IP: {}'.format[result]]
|
Nhập JS
# Gọi hàm JS
File"",line5,inTypeError:'pyodide.JsProxy'objectisnotiterable]"",line5,inTypeError:'pyodide.JsProxy'objectisnotiterable] |
}
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | Nhập JSjs result=js.get_object[]=js.get_object[] forrinresult:rinresult: print[r]print[r] functionget_object[]{get_object[]{ return{return{ "a":4,"a": 4, "b":"4""b":"4" };}; Nhập JS
|
Nhập JS
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | Nhập JSjs result=js.get_object[].to_py[]=js.get_object[].to_py[] forrinresult:rin result: print[r]print[r] functionget_object[]{get_object[]{ return{return{ "a":4,"a":4, "b":"4""b":"4" };}; Nhập JS
|
Nhập JS
# Gọi hàm JS
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | Nhập JSjs obj={={ "a":4,"a":4, "b":"8""b": "8" Nhập JS js.put_object[obj].put_object[obj] functionput_object[obj]{put_object[obj]{ Nhập JS// obj is a Proxy # Gọi hàm JSconsole.log["a = "+obj.get["a"]]; }console.log["b = "+obj.get["b"]]; Nhập JS
|
# Gọi hàm JS
}
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | Nhập JSjs # Gọi hàm JSpyodide import to_js obj={={ "a":4,"a":4, "b":"8""b":"8" Nhập JS js.put_object[to_js[obj]].put_object[to_js[obj]] functionput_object[obj]{put_object[obj]{ # Gọi hàm JS// obj is a Map }for[var[key, val]of obj]{ Gọi JavaScript Async từ Pythonconsole.log["Key: "+key," Value: "+ val]; }} }
|
Chuyển đổi từ điển thành đối tượng JavaScript
Để chuyển đổi từ điển, hãy sử dụng API Object.fromEntries[]
.
Phương pháp fromEntries[]
chuyển đổi một danh sách các cặp giá trị khóa [từ điển Python] thành một đối tượng.
Từ đối tượng nhập JSjs import Object headers={"Content-type":"application/json"}={"Content-type":"application/json"} objects=Object.fromEntries[to_js[headers]]= Object.fromEntries[to_js[headers]] |
Một ví dụ là gọi API JavaScript js
0. API js
0 yêu cầu tham số tiêu đề là một đối tượng JavaScript.
phản hồi = đang chờ js.fetch [=await js.fetch[ url,url, method="POST",method="POST", body=json.dumps[body],body=json.dumps[body], redirect="manual",redirect="manual", headers=Object.fromEntries[to_js[headers]]headers=Object.fromEntries[to_js[headers]] ] J = [Await trả lời.json []]. to_py []=[await response.json[]].to_py[] status=response.status=response.status |
Chuyển đổi đối tượng Bython Bytesio sang Blob JavaScript
Để chuyển đổi đối tượng byteo thành blob, thường được sử dụng với API tệp:
Từ JS Nhập Blob, Windowjs import Blob,window từ nhập khẩu pyodide vào_jspyodide import to_js # Đọc đối tượng byte và chuyển đổi dữ liệu thành javascript content=to_js[buf.read[]]=to_js[buf.read[]] # Tạo BLOB từ đối tượng nội dung và chỉ định loại nội dung của nó b=Blob.new[[content],{type:"image/png"}]=Blob.new[[content],{type:"image/png"}] # Ví dụ sử dụng Blob FileHandle = Await Window.ShowsaveFilePicker []= await window.showSaveFilePicker[] File = Await FileHandle.CreatewRitable []=await fileHandle.createWritable[] Await File.Write [b]file.write[b] đang chờ tệp.close []file.close[] |
Bản tóm tắt
Hy vọng, phần giới thiệu này giúp bạn hiểu cách gọi các chức năng JavaScript từ Python và Pass và nhận dữ liệu bao gồm các đối tượng. Khi Pyscript phát triển, tôi chắc chắn sẽ có nhiều chuyển đổi tự động hơn và nhiều chức năng hơn để hỗ trợ chuyển đổi loại.
Thêm thông tin
- Các bài viết khác mà tôi đã viết trên pyscript
- Phiên bản pyodide 0.20 Tài liệu
- to_js[]
- Object.fromEntries[]
Tín dụng nhiếp ảnh
Tôi viết các bài báo miễn phí về công nghệ. Gần đây, tôi đã tìm hiểu về & nbsp; pexels.com & nbsp; cung cấp hình ảnh miễn phí. Các & nbsp; hình ảnh & nbsp; trong bài viết này là lịch sự của & nbsp; ashithosh u & nbsp; tại pexels.
Tôi thiết kế phần mềm cho các hệ thống và trung tâm dữ liệu thuộc tầng lớp doanh nghiệp. Nền tảng của tôi là hơn 30 năm trong kho [SCSI, FC, ISCSI, mảng đĩa, hình ảnh] ảo hóa. Hơn 20 năm về bản sắc, an ninh và pháp y.
Trong hơn 14 năm qua, tôi đã làm việc trong đám mây [AWS, Azure, Google, Alibaba, IBM, Oracle] Thiết kế các giải pháp phần mềm lai và đa đám mây. Tôi là một MVP/GDE với một số.