异步等待与 Task 的同步事件/操作,同时使用 CefSharp 从 Web 浏览器/网页截取屏幕截图



我要做的是:

我有一个 CefSharpChromiumWebBrowser(WPF 控件(,我想在该浏览器中截取网页的屏幕截图。屏幕上的ChromiumWebBrowser没有截屏的方法。但是我可以通过将事件处理程序附加到浏览器的OnPaint事件来获取呈现。 这样我得到一个位图,即屏幕截图。该过程基于以下答案:https://stackoverflow.com/a/54236602/2190492

现在我正在创建一个应该负责截屏的类CefSharpScreenshotRecorder。它应接受浏览器实例,将事件处理程序附加到OnPaint事件,并获取位图。此过程的所有状态都应封装在该CefSharpScreenshotRecorder类中。 我希望能够异步使用我的类。因为我们必须等到 OnPaint 事件被触发。触发该事件(并调用事件处理程序(时,事件处理程序中将提供位图。那么这个位图应该是最初调用的异步方法的结果(如CefSharpScreenshotRecorder.TakeScreenshot(...cefBrowserInstance...).当然,一切都必须在不阻塞/滞后 UI 的情况下发生。

我对 C# 中的异步编程不是很熟悉。 我遇到的问题是我找不到一种方法来制作一个可等待的方法,该方法仅在调用时代表 OnPaint 事件处理程序返回。 我什至不知道是否存在任何代码功能来创建此逻辑。

这可以使用TaskCompletionSource来实现。这样,您可以将同步(例如事件驱动(代码包装到异步方法中,而无需使用Task.Run.

class CefSharpScreenshotRecorder
{
private TaskCompletionSource<System.Drawing.Bitmap> TaskCompletionSource { get; set; }
public Task<System.Drawing.Bitmap> TakeScreenshotAsync(
ChromiumWebBrowser browserInstance, 
TaskCreationOptions optionalTaskCreationOptions = TaskCreationOptions.None)
{
this.TaskCompletionSource = new TaskCompletionSource<System.Drawing.Bitmap>(optionalTaskCreationOptions);
browserInstance.Paint += GetScreenShotOnPaint;
// Return Task instance to make this method awaitable
return this.TaskCompletionSource.Task;
}
private void GetScreenShotOnPaint(object sender, PaintEventArgs e)
{ 
(sender as ChromiumWebBrowser).Paint -= GetScreenShotOnPaint;
System.Drawing.Bitmap newBitmap = new Bitmap(e.Width, e.Height, 4 * e.Width, PixelFormat.Format32bppPArgb, e.Buffer);
// Optional: save the screenshot to the hard disk "MyPictures" folder
var screenshotDestinationPath = Path.Combine(
Environment.GetFolderPath(Environment.SpecialFolder.MyPictures), 
"CefSharpBrowserScreenshot.png");
newBitmap.Save(screenshotDestinationPath);
// Create a copy of the bitmap, since the underlying buffer is reused by the library internals
var bitmapCopy = new System.Drawing.Bitmap(newBitmap);
// Set the Task.Status of the Task instance to 'RanToCompletion'
// and return the result to the caller
this.TaskCompletionSource.SetResult(bitmapCopy);
}
public BitmapImage ConvertToBitmapImage(System.Drawing.Bitmap bitmap)
{
using(var memoryStream = new MemoryStream())
{
bitmap.Save(memoryStream, ImageFormat.Png);
memoryStream.Position = 0;
BitmapImage bitmapImage = new BitmapImage();
bitmapImage.BeginInit();
bitmapImage.StreamSource = memoryStream;
bitmapImage.CacheOption = BitmapCacheOption.OnLoad;
bitmapImage.EndInit();
bitmapImage.Freeze();
}
}
}

使用示例(工作(:

MainWindow.xaml

<Window>
<StackPanel>
<Button Click="TakeScreenshot_OnClick" Height="50" Content="Take Screenshot"/>
<ChromiumWebBrowser x:Name="ChromiumWebBrowser"
Width="500"
Height="500"
Address="https://stackoverflow.com/a/57695630/3141792" />
<Image x:Name="ScreenshotImage" />
</StackPanel>
</Window>

MainWindow.xaml.cs

private async void TakeScreenshot_OnClick(object sender, RoutedEventArgs e)
{
var cefSharpScreenshotRecorder = new CefSharpScreenshotRecorder();
System.Drawing.Bitmap bitmap = await cefSharpScreenshotRecorder.TakeScreenshotAsync(this.ChromiumWebBrowser);
this.ScreenshotImage.Source = cefSharpScreenshotRecorder.ConvertToBitmapImage(bitmap);
}

编辑

如果您只是对从网页拍摄快照感兴趣,请查看CefSharp.OffScreen(可通过NuGet包管理器获得(。ChromiumWebBrowser类公开一个返回现成System.Drawing.BitmapScreenshotAsync方法。下面是 GitHub 上项目存储库中的一个示例。

例:

class CefSharpScreenshotRecorder
{
private TaskCompletionSource<System.Drawing.Bitmap> TaskCompletionSource { get; set; }
public async Task<System.Drawing.Bitmap> TakeScreenshotAsync(
ChromiumWebBrowser browser, 
string url, 
TaskCreationOptions optionalTaskCreationOptions = TaskCreationOptions.None)
{
if (!string.IsNullOrEmpty(url))
{
throw new ArgumentException("Invalid URL", nameof(url));
}
this.TaskCompletionSource = new TaskCompletionSource<Bitmap>(optionalTaskCreationOptions);
// Load the page. In the loaded event handler 
// take the snapshot and return it asynchronously it to caller
return await LoadPageAsync(browser, url);
}
private Task<System.Drawing.Bitmap> LoadPageAsync(IWebBrowser browser, string url)
{
browser.LoadingStateChanged += GetScreenShotOnLoadingStateChanged;
browser.Load(url);
// Return Task instance to make this method awaitable
return this.TaskCompletionSource.Task;
}
private async void GetScreenShotOnLoadingStateChanged(object sender, LoadingStateChangedEventArgs e)
{ 
browser.LoadingStateChanged -= GetScreenShotOnLoadingStateChanged;
System.Drawing.Bitmap screenshot = await browser.ScreenshotAsync(true);
// Set the Task.Status of the Task instance to 'RanToCompletion'
// and return the result to the caller
this.TaskCompletionSource.SetResult(screenshot);
}
}

使用示例:

public async Task CreateScreenShotAsync(ChromiumWebBrowser browserInstance, string url)
{
var recorder = new CefSharpScreenshotRecorder();   
System.Drawing.Bitmap screenshot = await recorder.TakeScreenshotAsync(browserInstance, url);
}

你真的不需要一个单独的类来保存状态。您可以使用本地函数(或Action<object, PaintEventArgs>委托(,编译器将生成一个类供您保存状态(如果存在任何状态(。这些隐藏类称为闭包。

public static Task<Bitmap> TakeScreenshotAsync(this ChromiumWebBrowser source)
{
var tcs = new TaskCompletionSource<Bitmap>(
TaskCreationOptions.RunContinuationsAsynchronously);
source.Paint += ChromiumWebBrowser_Paint;
return tcs.Task;
void ChromiumWebBrowser_Paint(object sender, PaintEventArgs e)
{
source.Paint -= ChromiumWebBrowser_Paint;
using (var temp = new Bitmap(e.Width, e.Height, 4 * e.Width,
PixelFormat.Format32bppPArgb, e.Buffer))
{
tcs.SetResult(new Bitmap(temp));
}
}
}

选项TaskCreationOptions.RunContinuationsAsynchronously可确保任务的延续不会在 UI 线程中同步运行。当然,如果您在 WPF 应用程序的上下文中没有configureAwait(false)的情况下await任务,则继续 然后重新计划以在 UI 线程中运行,因为configureAwait(true)是默认值。

作为一般规则,我会说TaskCompletionSource的任何用法都应该异步指定TaskCreationOptions.RunContinuationsAsyncly。就个人而言,我认为该标志的语义更合适,也更不令人惊讶。[引文]


免责声明:创建位图的代码部分是从另一个答案复制然后修改的(请参阅注释(,但尚未经过测试。

最新更新