先要明白的是，javascript和python都是解釋型語言，它們的運(yùn)行是需要具體的runtime的。
- Python： 我們最常安裝的Python其實(shí)是cpython，就是基于C來運(yùn)行的。除此之外還有像pypy這樣的自己寫了解釋器的，transcrypt這種轉(zhuǎn)成js之后再利用js的runtime的。基本上，不使用cpython作為python的runtime的最大問題就是通過pypi安裝的那些外來包，甚至有一些cpython自己的原生包（像 collections 這種）都用不了。
- JavaScript： 常見的運(yùn)行引擎有g(shù)oogle的V8，Mozilla的SpiderMonkey等等，這些引擎會(huì)把JavaScript代碼轉(zhuǎn)換成機(jī)器碼執(zhí)行。基于這些基礎(chǔ)的運(yùn)行引擎，我們可以開發(fā)支持JS的瀏覽器（比如Chrome的JS運(yùn)行引擎就是V8）；也可以開發(fā)功能更多的JS運(yùn)行環(huán)境，比如Node.js，相當(dāng)于我們不需要一個(gè)瀏覽器，也可以跑JS代碼。有了Node.js，JS包管理也變得方便許多，如果我們想把開發(fā)好的Node.js包再給瀏覽器用，就需要把基于Node.js的源代碼編譯成瀏覽器支持的JS代碼。
在本文敘述中，假定：
- 主語言： 最終的主程序所用的語言
- 副語言： 不是主語言的另一種語言
例如，python調(diào)用js，python就是主語言，js是副語言
TL; DR
適用于：
- python和javascript的runtime（基本特指cpython[不是cython！]和Node.js）都裝好了
- 副語言用了一些復(fù)雜的包（例如python用了numpy、javascript用了一點(diǎn)Node.js的C++擴(kuò)展等）
- 對(duì)運(yùn)行效率有要求的話:
- python與javascript之間的交互不能太多，傳遞的對(duì)象不要太大、太復(fù)雜，最好都是可序列化的對(duì)象
- javascript占的比重不過小。否則，python調(diào)js的話，啟動(dòng)Node.js子進(jìn)程比實(shí)際跑程序還慢；js調(diào)python的話，因?yàn)閖s跑得快，要花很多時(shí)間在等python上。
- 因?yàn)镮PC大概率會(huì)用線程同步輸入輸出，主語言少整啥多進(jìn)程多、線程之類的并發(fā)編程
有庫！有庫！有庫！
python調(diào)javascript
- JSPyBridge ： pip install javascript優(yōu)點(diǎn)：作者還在維護(hù)，回issue和更新蠻快的。支持比較新的python和node版本，安裝簡單基本支持互調(diào)用，包括綁定或者傳回調(diào)函數(shù)之類的。缺點(diǎn) ：沒有合理的銷毀機(jī)制， import javascript 即視作連接JS端，會(huì)初始化所有要用的線程多線程。如果python主程序想重啟對(duì)JS的連接，或者主程序用了多進(jìn)程，想在每個(gè)進(jìn)程都連接一次JS，都很難做到，會(huì)容易出錯(cuò)。
- PyExecJS ： pip install PyExecJS ，比較老的技術(shù)文章都推的這個(gè)包優(yōu)點(diǎn)： 支持除了Node.js以外的runtime，例如PhantomJS之類的缺點(diǎn)： End of Life，作者停止維護(hù)了
javascript調(diào)python
（因?yàn)榕c我的項(xiàng)目需求不太符合，所以了解的不太多）
- JSPyBridge ： npm i pythonia
- node-python-bridge : npm install python-bridge
- python-shell ： npm install python-shell
原理
首先，該方法的前提是兩種語言都要有安裝好的runtime，且能通過命令行調(diào)用runtime運(yùn)行文件或一串字符腳本。例如，裝好cpython后我們可以通過 python a.py 來運(yùn)行python程序，裝好Node.js之后我們可以通過 node a.js 或者 node -e "some script" 等來運(yùn)行JS程序。
當(dāng)然，最簡單的情況下，如果我們只需要調(diào)用一次副語言，也沒有啥交互（或者最多只有一次交互），那直接找個(gè)方法調(diào)用CLI就OK了。把給副語言的輸入用stdin或者命令行參數(shù)傳遞，讀取命令的輸出當(dāng)作副語言的輸出。
例如，python可以用 subprocess.Popen ， subprocess.call ， subprocess.check_output 或者 os.system 之類的，Node.js可以用 child_process 里的方法， exec 或者 fork 之類的。 需要注意的是，如果需要引用其他包，Node.js需要注意在 node_modules 所在的目錄下運(yùn)行指令，python需要注意設(shè)置好PYTHONPATH環(huán)境變量。
# Need to set the working directory to the directory where `node_modules` resides if necessary
>>> import subprocess
>>> a, b = 1, 2
>>> print(subprocess.check_output(["node", "-e", f"console.log({a}+{b})"]))
b'3\n'
>>> print(subprocess.check_output(["node", "-e", f"console.log({a}+{b})"]).decode('utf-8'))
3
// Need to set PYTHONPATH in advance if necessary
const a = 1;
const b = 2;
const { execSync } = require("child_process");
console.log(execSync(`python -c "print(${a}+${b})"`));
//<Buffer 33 0a>
console.log(execSync(`python -c "print(${a}+${b})"`).toString());
//3
//
如果有復(fù)雜的交互，要傳遞復(fù)雜的對(duì)象，有的倒還可以序列化，有的根本不能序列化，咋辦？
這基本要利用 進(jìn)程間通信（IPC） ，通常情況下是用 管道（Pipe） 。在 stdin ， stdout 和 stderr 三者之中至少挑一個(gè)建立管道。
假設(shè)我用 stdin 從python向js傳數(shù)據(jù)，用 stderr 接收數(shù)據(jù)，模式大約會(huì)是這樣的：
（以下偽代碼僅為示意，沒有嚴(yán)格測(cè)試過，實(shí)際使用建議直接用庫）
- 新建一個(gè)副語言（假設(shè)為JS）文件 python-bridge.js ：該文件不斷讀取 stdin 并根據(jù)發(fā)來的信息不同，進(jìn)行不同的處理；同時(shí)如果需要打印信息或者傳遞object給主語言，將它們適當(dāng)序列化后寫入 stdout 或者 stderr 。process.stdin.on('data', data => { data.split('\n').forEach(line => { // Deal with each line // write message process.stdout.write(message + "\n"); // deliver object, "$j2p" can be any prefix predefined and agreed upon with the Python side // just to tell python side that this is an object needs parsing process.stderr.write("$j2p sendObj "+JSON.stringify(obj)+"\n); }); } process.on('exit', () => { console.debug('** Node exiting'); });
- 在python中，用Popen異步打開一個(gè)子進(jìn)程，并將子進(jìn)程的之中的至少一個(gè)，用管道連接。大概類似于:cmd = ["node", "--trace-uncaught", f"{os.path.dirname(__file__)}/python-bridge.js"] kwargs = dict( stdin=subprocess.PIPE, stdout=sys.stdout, stderr=subprocess.PIPE, ) if os.name == 'nt': kwargs['creationflags'] = subprocess.CREATE_NO_WINDOW subproc = subprocess.Popen(cmd, **kwargs)
- 在需要調(diào)用JS，或者需要給JS傳遞數(shù)據(jù)的時(shí)候，往 subproc 寫入序列化好的信息，寫入后需要 flush ，不然可能會(huì)先寫入緩沖區(qū)：subproc.stdin.write(f"$p2j call funcName {json.dumps([arg1, arg2])}".encode()) subproc.stdin.flush() # write immediately, not writing to the buffer of the stream
- 對(duì)管道化的 stdout / stderr ，新建一個(gè)線程，專門負(fù)責(zé)讀取傳來的數(shù)據(jù)并進(jìn)行處理。是對(duì)象的重新轉(zhuǎn)換成對(duì)象，是普通信息的直接打印回主進(jìn)程的 stderr 或者 stdout 。def read_stderr(): while subproc.poll() is None: # when the subprocess is still alive, keep reading line = self.subproc.stderr.readline().decode('utf-8') if line.startswith('$j2p'): # receive special information _, cmd, line = line.split(' ', maxsplit=2) if cmd == 'sendObj': # For example, received an object obj = json.loads(line) else: # otherwise, write to stderr as it is sys.stderr.write(line) stderr_thread = threading.Thread(target=read_stderr, args=(), daemon=True) stderr_thread.start()這里由于我們的 stdout 沒有建立管道，所以node那邊往 stdout 里打印的東西會(huì)直接打印到python的 sys.stdout 里，不用自己處理。
- 由于線程是異步進(jìn)行的，什么時(shí)候知道一個(gè)函數(shù)返回的對(duì)象到了呢？答案是用線程同步手段，信號(hào)量（Semaphore）、條件（Condition），事件（Event）等等，都可以。以 python的條件 為例：func_name_cv = threading.Condition() # use a flag and a result object in case some function has no result func_name_result_returned = False func_name_result = None def func_name_wrapper(arg1, arg2): # send arguments subproc.stdin.write(f"$p2j call funcName {json.dumps([arg1, arg2])}".encode()) subproc.stdin.flush() # wait for the result with func_name_cv: if not func_name_result_returned: func_name_cv.wait(timeout=10000) # when result finally returned, reset the flag func_name_result_returned = False return func_name_result同時(shí)，需要在讀stderr的線程 read_stderr 里解除對(duì)這個(gè)返回值的阻塞。需要注意的是，如果JS端因?yàn)橐馔舛顺隽耍?subproc 也會(huì)死掉， 這時(shí)候也要記得取消主線程中的阻塞 。def read_stderr(): while subproc.poll() is None: # when the subprocess is still alive, keep reading # Deal with a line line = self.subproc.stderr.readline().decode('utf-8') if line.startswith('$j2p'): # receive special information _, cmd, line = line.split(' ', maxsplit=2) if cmd == 'sendObj': # acquire lock here to ensure the editing of func_name_result is mutex with func_name_cv: # For example, received an object func_name_result = json.loads(line) func_name_result_returned = True # unblock func_name_wrapper when receiving the result func_name_cv.notify() else: # otherwise, write to stderr as it is sys.stderr.write(line) # If subproc is terminated (mainly due to error), still need to unblock func_name_wrapper func_name_cv.notify()當(dāng)然這是比較簡單的版本，由于對(duì)JS的調(diào)用基本都是線性的，所以可以知道只要得到一個(gè)object的返回，那就一定是 func_name_wrapper 對(duì)應(yīng)的結(jié)果。如果函數(shù)多起來的話，情況會(huì)更復(fù)雜。
- 如果想 取消對(duì)JS的連接 ，首先應(yīng)該先關(guān)閉子進(jìn)程，然后等待讀 stdout / stderr 的線程自己自然退出，最后 一定不要忘記關(guān)閉管道 。并且 這三步的順序不能換 ，如果先關(guān)了管道，讀線程會(huì)因?yàn)?stdout / stderr 已經(jīng)關(guān)了而出錯(cuò)。subproc.terminate() stderr_thread.join() subproc.stdin.close() subproc.stderr.close()
如果是通過這種原理javascript調(diào)用python，方法也差不多，javascript方是Node.js的話，用的是 child_process 里的指令。
優(yōu)點(diǎn)
- 只需要正常裝好兩方的runtime就能實(shí)現(xiàn)交互，運(yùn)行環(huán)境相對(duì)比較好配。
- 只要python方和javascript方在各自的runtime里正常運(yùn)行沒問題，那么連上之后運(yùn)行也基本不會(huì)有問題。（除非涉及并發(fā)）
- 對(duì)兩種語言的所有可用的擴(kuò)展包基本都能支持。
缺點(diǎn)
- 當(dāng)python與JavaScript交互頻繁，且交互的信息都很大的時(shí)候，可能會(huì)很影響程序效率。因?yàn)閮H僅通過最多3個(gè)管道混合處理普通要打印的信息、python與js交互的對(duì)象、函數(shù)調(diào)用等，通信開銷很大。
- 要另起一個(gè)子進(jìn)程運(yùn)行副語言的runtime，會(huì)花一定時(shí)間和空間開銷。
品|開源中國
文|局長
知名 Python 發(fā)行版 Anaconda 開發(fā)商近日宣布了可在瀏覽器端運(yùn)行的 Python —— PyScript。
根據(jù)官方的介紹，PyScript 是一個(gè)開發(fā)框架，為開發(fā)者提供了在標(biāo)準(zhǔn) HTML 中嵌入編寫 Python 代碼的能力、使用 Python 調(diào)用 JavaScript 函數(shù)庫，以及創(chuàng)建 Python Web 應(yīng)用。PyScript 旨在提供“一等公民(first-class)”的編程語言，它具有一致的風(fēng)格化規(guī)則、更具表現(xiàn)力且更易于學(xué)習(xí)。
PyScript 示例代碼
<py-script>
"Hello World"
</py-script>
<py-script src="/my_own_file.py"></py-script>
<py-env>
- bokeh
- numpy
- paths:
- /utils.py
</py-env>
PyScript 核心特性
- Python in the browser：啟用 drop-in content、外部文件托管（基于 Pyodide 項(xiàng)目），以及不依賴服務(wù)器端配置的應(yīng)用程序托管
- Python 生態(tài)：提供流行的 Python 和科學(xué)計(jì)算軟件包（例如 numpy, pandas, scikit-learn 等）
- Python with JavaScript：在 Python 和 JavaScript 對(duì)象和命名空間之間進(jìn)行雙向通信
- 環(huán)境管理：開發(fā)者可定義要引入哪些包和文件，以便頁面代碼的運(yùn)行
- 可視化應(yīng)用開發(fā)：開發(fā)者可使用現(xiàn)成的 UI 組件，如按鈕、容器、文本框等
- 靈活的框架：開發(fā)者可以利用它在 Python 中直接創(chuàng)建和分享新的可插拔和可擴(kuò)展的組件
PyScript 目標(biāo)
- 提供干凈簡單的 API
- 支持標(biāo)準(zhǔn) HTML
- 擴(kuò)展 HTML 以讀取穩(wěn)定且可靠的自定義組件
- 提供可插拔、可擴(kuò)展的組件系統(tǒng)
PyScript 基于 Pyodide 構(gòu)建，Pyodide 由編譯成 WebAssembly 的 CPython 3.8 解釋器組成，允許在網(wǎng)頁瀏覽器中運(yùn)行 Python。Pyodide 可以安裝來自 PyPi 的任何 Python 包。Pyodide 還包括一個(gè)外部函數(shù)接口，可以將 Python 包暴露給 JavaScript，并將瀏覽器 UI，包括 DOM，暴露給 Python。
關(guān)于 PyScript 運(yùn)行原理的更多信息查看：https://engineering.anaconda.com/2022/04/welcome-pyscript.html
目前 PyScript 處于 alpha 測(cè)試階段，下載和安裝地址：https://pyscript.net/
面介紹過Django項(xiàng)目創(chuàng)建app，里面演示時(shí)直接返回了一個(gè)HttpResponse。但是實(shí)際開發(fā)中很少直接返回一個(gè)HttpResponse，一般都是使用html。這里就來介紹一下具體怎么使用。
創(chuàng)建html
在app的目錄下面新建一個(gè)templates文件夾，在這個(gè)文件夾中可以新建html：
使用html
直接在view.py中通過render方法加載：
這里運(yùn)行的時(shí)候可能會(huì)遇到找不到html的報(bào)錯(cuò)。具體原因不清楚，但是解決方法比較簡單，直接到settings.py文件指定一下templates的地址：
運(yùn)行一次之后，就可以刪除了，之后運(yùn)行都會(huì)自動(dòng)到當(dāng)前app目錄下的templates文件夾下面找html。一般這個(gè)DIRS是配置根目錄的templates地址的，不知道為什么第一次運(yùn)行的時(shí)候沒有到當(dāng)前app下找templates。
靜態(tài)文件引用
html的中經(jīng)常要引用一些靜態(tài)文件，這些靜態(tài)文件必須放到同一個(gè)app下面的static文件夾里面：
不過上面這種引用方式比較死板，直接將靜態(tài)文件的地址寫死了。比較推薦的方式是這種方式：
這里加載的static，其實(shí)是settings.py中的這個(gè)變量：
這樣引用靜態(tài)文件的好處是萬一路徑變更，可以直接改STATIC_URL，不用改模板文件中的引用。
最終運(yùn)行的效果是一樣的：
總結(jié)
現(xiàn)在實(shí)際工作中基本都是前后端分離的，django項(xiàng)目主要是作為后端工程，很少需要python工程師寫html及其他靜態(tài)文件。不過作為初學(xué)者，了解一下django中靜態(tài)文件的使用也是可以的。
像我最近的工作中幾個(gè)測(cè)開做測(cè)試平臺(tái)，沒有前端工程師支持，就只能自己寫html，畢竟老話說的好，技多不壓身。
