I'm trying to display images in my WPF application.
I'm getting a path for each image, and then creating an html website with which to display the image.
StringBuilder sb = new StringBuilder();
sb.Append("<html><body><img width='100%' height='100%' src='");
sb.Append(path);
sb.Append("'/></body></html>");
code = sb.ToString();
return code;
Is the code I use to generate the HTML returns valid HTML code - I have verified this by opening the code with my browser, which displays the image the way I want it to.
I'm calling this code from a method called getHtmlForImage(imagePath)
and then loading it into the browser:
string myHtml = getHtmlForImage(imagePath)
string fakeUrl = "http://interceptMe/"
browser.RegisterResourceHandler(fakeUrl, newMemoryStream(Encoding.UTF8.getBytes(myHtml)));
browser.Load(fakeUrl);
The path of a file looks like this:
"C:\\ProgramData\\ApplicationFolder\\Resources\\IMG1_05.JPG"
and the final HTML code looks like this:
<html><body><img width='100%' height='100%' src='C:\\ProgramData\\ApplicationFolder\\Resources\\IMG1_05.JPG'/></body></html>
Which doesn't display the image. This code works when pasted into a .html and opened with a standard browser. I have verified that the code is being intercepted by adding text to it - which is then properly displayed. Replacing the path given to getHtmlForImage()
with an image on the web displays the image as wanted, however not local images. Changing the RegisterResourceHandler
to:
browser.RegisterResourceHandler(fakeUrl, new MemoryStream(Encoding.UTF8.GetBytes(myHtml)), ResourceHandler.GetMimeType(".jpg"));
Displays the previously shown White box on black background - both for local images, as well as web-based images.
The reason for the multiple variables like code
and myHtml
is debugging.
Here's how to reproduce the bug in a new project:
Step 1: Make a new WPF project, import CefSharp and enbale AnyCpu support like in Github Issue 1714 - variant 1
Step 2: Add a Chromium Web Browser, and a button in MainWindow.xaml, like this:
<wpf:ChromiumWebBrowser x:Name="browser" Address="www.google.com" Grid.Column="0"></wpf:ChromiumWebBrowser>
<Button Content="BreakTheBrowser!" Grid.Column="1" Click="Button_Click"></Button>
Step 3: Initalize the browser in MainWindow.xaml.cs
with the following code:
public MainWindow() {
var settings = new CefSettings();
settings.BrowserSubprocessPath = @"x86\CefSharp.BrowserSubprocess.exe";
Cef.Initialize(settings, performDependencyCheck: false, browserProcessHandler: null);
InitializeComponent();
}
Step 4: Create a method called getHtmlForImage(string path)
like this:
private String getHtmlForImage(string path) {
string code;
StringBuilder sb = new StringBuilder();
sb.Append("<html><body><img width='100%' height='100%' src='");
sb.Append(path);
sb.Append("'/></body></html>");
code = sb.ToString();
return code;
}
Step 5: Add a button_click
event to the button, and in that click-event load the image:
private void Button_Click(object sender, RoutedEventArgs e) {
string path = "https://www.catster.com/wp-content/uploads/2017/11/A-Siamese-cat.jpg";
string myHtml = getHtmlForImage(path);
string fakeUrl = "http://interceptMe/";
browser.RegisterResourceHandler(fakeUrl, new MemoryStream(Encoding.UTF8.GetBytes(myHtml)), ResourceHandler.GetMimeType(".jpg"));
browser.Load(fakeUrl);
}
Step 6: Start the application, and click the button. The notorious white box, on black background, should appear.
Additional information:
- Cefsharp Version: 65.0.0, installed with NuGet yesterday
- Windows 10, 64 bit
- Using Visual Studio Enterprise 2017, Version 15.7.5
- .NET Framework Version 4.7.03.056