Loading local html/css/js files with CefSharp v65

Question

I am trying to load local html/css/js files using CefSharp v65 in WinForms.

I found other stack overflow posts regarding this but none of them used the new built-in version of FolderSchemeHandlerFactory, instead implementing their own version. Here is the documentation I read on the Scheme Handler: https://github.com/cefsharp/CefSharp/wiki/General-Usage under the "Scheme Handler" header.

Sources: Working with locally built web page in CefSharp

I tried using the new feature like so:

    public ChromiumWebBrowser browser;

    public void InitBrowser()
    {            
        var settings = new CefSettings();
        settings.RegisterScheme(new CefCustomScheme
        {
            SchemeName = "localfolder",
            SchemeHandlerFactory = new FolderSchemeHandlerFactory(
                rootFolder: @"..\..\..\..\CEFSharpExample\webpage",
                defaultPage: "index.html" // default
            )
        });

        Cef.Initialize(settings);

        string html = File.ReadAllText(@"..\..\..\webpage\index.html");
        browser = new ChromiumWebBrowser();
        browser.LoadHtml(html);
        this.Controls.Add(browser);
        browser.Dock = DockStyle.Fill;

    }

However, I am simply getting the html with no css, with no exceptions in the debugger. Does anyone understand how to leverage the new built-in functionality?

Assuming you are using WinForms, remove the call to LoadHtml and pass the start url into the ChromiumWebBrowser constructor, something like localfolder://anydomain.example/ — amaitland, Sep 14 '18 at 21:43
LoadHtml with a single param loads a data uri https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs — amaitland, Sep 14 '18 at 21:44
@amaitland that did the trick!! Can you explain why? (for me and anyone who views this in the future) — Kelly Flet, Sep 14 '18 at 22:07
Your requests weren't being made to the scheme handler as you were loading a data URI. — amaitland, Sep 14 '18 at 22:10

Kelly Flet · Accepted Answer · 2019-09-05T02:29:03.153

As pointed out by amaitland in the comments, my "requests weren't being made to the scheme handler as [I was] loading a data URI".

My updated, working code is as follows (a little more fleshed out in case you were wondering where everything was taking place):

public partial class Form1 : Form
{
    InitializeComponent();
    InitBrowser();
}

public ChromiumWebBrowser browser;

public void InitBrowser()
{
    var settings = new CefSettings();

    settings.RegisterScheme(new CefCustomScheme
    {
        SchemeName = "localfolder",
        DomainName = "cefsharp",
        SchemeHandlerFactory = new FolderSchemeHandlerFactory(
            rootFolder: @"C:\CEFSharpExample\webpage",
            hostName: "cefsharp",
            defaultPage: "index.html" // will default to index.html
        )
    });

    Cef.Initialize(settings);

    browser = new ChromiumWebBrowser("localfolder://cefsharp/");

    this.Controls.Add(browser);
    browser.Dock = DockStyle.Fill;   
}

Is it possible to do this with a single HTML file located in the resource folder? — A.bakker, Apr 04 '23 at 11:21

Loading local html/css/js files with CefSharp v65

1 Answers1

Linked