electron - 我无法在 Electron 应用程序中放置任何图像，背景图像不起作用，img scr不起作用，我该怎么办？很奇怪

Question

我无法在 Electron 应用程序中放置任何图像，背景图像不起作用，img scr不起作用，canvas.drawImage不起作用我该怎么办？
明显的代码:

<img src="file://bg.jpg" width="50px" height="50px"> 
...
body{ background-image: url('file:///bg.jpg') 50px 50px repeat; }

Answer 1

image的来源是错误的。

您可以使用Absolute Path或Relative Path-Absolute V/s Relative Path

Use Relative Path as they are not bound to a base URL

现在回到您的问题， file://bg.jpg不是有效的路径。

确定项目的结构后，让我们考虑一下，您是否希望文件 index.html 和图像 bg.jpg 中的 background image和 <img />都位于同一目录中。

这意味着如果您的 files structure是这样的

project_folder
|
index.html
| main.js
| bg.jpg

然后，使用 file://bg.jpg代替 bg.jpg。

因此，您的代码变得像

<img src="bg.jpg" width="50px" height="50px"> 
...
body{ background-image: url('bg.jpg') 50px 50px repeat; }

NOTE: Only valid if both HTML file and image are in the same directory

如果 不是，则必须使用 relative路径访问图像