Use local file as background image

[floatingloud]

Hi Folks,
I am hoping to use CefSharp to replace WebView as it looks more capable, and so far seems to be less opaque than WebView2. I think it's a security thing, but CefSharp won't let me reference a local jpg from my webpage css. Is there a way around this please?

[EDIT] I have also tried reading the local image file and converting it to Base64, but CefSharp complains the URL is too long. Chromium itself doesn't have this issue as I have used Base64 images on websites.

[amaitland]

The simplest example is at

CefSharp/CefSharp.Wpf.Example/Views/BrowserTabView.xaml.cs

Line 162 in 7555ede

browser.RegisterResourceHandler(CefExample.BaseUrl + "/images/beach.jpg", beachImageStream, Cef.GetMimeType("jpg"));

There are actually quite a few options for loading content from disk, most of them are outlined in

• https://github.com/cefsharp/CefSharp/wiki/General-Usage#resource-handling
• https://github.com/cefsharp/CefSharp/wiki/General-Usage#request-interception
• https://github.com/cefsharp/CefSharp/wiki/General-Usage#scheme-handler
• https://github.com/cefsharp/CefSharp/wiki/General-Usage#loading-htmlcssjavascriptetc-from-diskdatabaseembedded-resourcestream

I have also tried reading the local image file and converting it to Base64, but CefSharp complains the URL is too long.

Are you embedding the image via a data uri in the css file?

[floatingloud]

Thanks for these examples. I really want to use *.jpg or *.gif from the local file system.

I tried using
background-image: url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD...
I thought this might work because I'm not asking CefSharp to access the local file system but, as I mentioned, it complains the URL is too long. WebView handles it okay.

[amaitland]

I really want to use *.jpg or *.gif from the local file system.

That's fine, use one of the other options like a scheme handler.

it complains the URL is too long

Generally I expect the behaviour to be the same as chromium at the exact same version and bitness.