Динамическое фоновое изображение URL в Taillide, извлеченное из локального файла через Electronjs Custom Protocol не раб ⇐ CSS

[Anonymous]

Я пытаюсь динамически загрузить файл изображения, хранящийся локально в каталоге App.get ('userData') (он же поддержка приложений в MacOS), через пользовательский протокол, в качестве фонового изображения с использованием Tail While с React. Вот какой-то упрощенный код того, что я пытаюсь сделать: < /p>
export function Cover() {

const [coverImagePath, setCoverImagePath] = useState('');

useEffect(() => {
const fetchInitialValues = async () => {
const path = `ocheeflow:///Users/xyz/Library/Application Support/ocheeflowxp/bg-images/sunset_wallpaper.jpg`;
setCoverImagePath(path);
};
fetchInitialValues();
}, []);

return (

style={{'--image-url': `url(${coverImagePath})`} as React.CSSProperties}
className='bg-[image:var(--image-url)] bg-no-repeat bg-cover bg-center'
>
Hello world


);
}
< /code>
Я получаю эту ошибку в консоли: < /p>
Uncaught (in promise) TypeError: Failed to construct 'URL': Invalid URL
at VM4 sandbox_bundle:2:55304
at Array.filter ()
at VM4 sandbox_bundle:2:55274
at logSecurityWarnings (VM4 sandbox_bundle:2:55804)
at VM4 sandbox_bundle:2:58073
< /code>
Фон просто выглядит черным (см. Изображение ниже). Я проверил этот код с помощью URL с общедоступного изображения (например, ponst path = , и отображается фоновое изображение, поэтому я не уверен, что можно даже использовать для извлечения локальных файлов. src = "https://i.sstatic.net/cgcyytgy.png"/>
Я знаю, что проблема не с моим пользовательским протоколом, как я использую его в другом месте в пользовательском интерфейсе моего приложения. PrettyPrint-Override ">app.on("ready", () => {
...

// Custom protocol handler to show images in renderer
protocol.handle('ocheeflow', (request) => {
const filePath = request.url.slice('ocheeflow://'.length);
const updatedPrefixPath = 'file://'+filePath;

return net.fetch(updatedPrefixPath);
});

...
});


Подробнее здесь: https://stackoverflow.com/questions/795 ... electronjs