Eel函数返回null

Question

我在用Eel模块开发python程序。但是有一个问题。它是从eel.getImgSrc(path)函数返回null来获取图像的字节数据。请看下面的代码:

——web/main.js

async function run(path) {
let n = await eel.getImgSrc(path)() //path is correct. but n is null.
console.log(n);
}

——app.py

@eel.expose
def getImgSrc(path):
f =  open(path, 'rb')
return f.read()

Answer 1

在Eel中，Python和JavaScript层通过来回传递JSON进行通信。在内部，Python端通过这样定义的函数传递Python返回值:jsn.dumps(obj, default=lambda o: None)，在你的例子中结果是字符串null。您可以通过仅为调试目的更新代码来确认此行为像这样:

@eel.expose
def getImgSrc(path):
f =  open(path, 'rb')
data = f.read()
print(json.dumps(data, default=lambda o: None))
return data

您将看到它打印出null。这就是为什么你会在JavaScript端看到null。

我不是Eel项目的开发人员，所以我无法解释为什么会发生这种情况(我只是在源代码中看到它)。但是现在您已经知道发生了这种情况，您可以通过找到一种方法对数据进行编码来解决问题，以便可以通过JSON传递数据。(您可以使用我上面发布的示例代码来检查它是否被正确编码。)

在网上搜索如何用Python将二进制数据编码成JSON并使用JavaScript解码将产生许多结果…所以选择一个适合你特殊需要的。一种常见的方法(Eel项目网站上的一个问题对此进行了讨论)是在Python端对数据进行base64编码，然后在JavaScript端对其进行解码。这不是理想的，但这是我过去使用过的一个可行的解决方案。你的代码应该是这样的…

——web/main.js

async function run(path) {
let n = await eel.getImgSrc(path)() // should no longer be null    
console.log(atob(n));
}

——app.py

@eel.expose
def getImgSrc(path):
f =  open(path, 'rb')
data = f.read()
data = base64.b64encode(data).decode("utf-8")
return data

此外，HTML图像标记可以接受base64编码的数据，因此您可以这样做:

async function run(path) {
let n = await eel.getImgSrc(path)() // should no longer be null    
let imageEl = document.getElementById('image');
imageEl.src = "data:image/jpeg;base64," + n;
// any other processing...
}

您可能需要调整这些示例以满足您的确切需求。