Problem with page.Request event

albertobelardi commented 2 months ago

Hi, I use the library PuppeteerSharp, I write a lot of code to figure out why I couldn't find a solution. The problem is that the event page.Request never raised. I use the latest version: 20.0.0. Below report a snippet of code that I use to complet the work. The source of the problem is that the image does not show up in the PDF.

Thanks

var htmlContent = @"
<html>
    <head><title>Test</title></head>
    <body>
        <img src='image.jpg' alt='My image to be convert in base64'>
    </body>
</html>";

var installedBrowser = await new BrowserFetcher().DownloadAsync(BrowserTag.Stable);
var options = new LaunchOptions
{
    ExecutablePath = installedBrowser.GetExecutablePath(),
    Headless = true,
    Args = new[] { "--disable-web-security" }
};
var browser = await Puppeteer.LaunchAsync(options);
var page = await browser.NewPageAsync();

await page.SetRequestInterceptionAsync(true);

page.Request += async (sender, e) =>
{
    if (e.Request.ResourceType == ResourceType.Image)
    {
        await Task.Run(() => Console.WriteLine($"Request image url: {e.Request.Url}"));
    }
};

await page.SetContentAsync(htmlContent);

await page.WaitForSelectorAsync("img");

await page.PdfAsync("output.pdf", new PdfOptions
{
    Format = PaperFormat.A4,
    PrintBackground = true
});

await browser.CloseAsync();

kblok commented 2 months ago

Where is that image.jpg located? because you are injecting the HTML.

albertobelardi commented 2 months ago

Right, the image won't load even if I put a full path like: <img src='file:///C:/folder_on_disk/chart.jpeg' alt='Local Image'> The event request raise only use this format in HTML: <img src='data:image/jpeg;base64,{img}' alt='Local Image'> But then I couldn't inject the base64 string into the HTML

kblok commented 2 months ago

And why do you need that event?

albertobelardi commented 2 months ago

I don't need of the event but the image visibile in the PDF file. What's wrong with the code snippet I posted? Why doesn't work?

albertobelardi commented 2 months ago

I would simply to say that in this context in the PDF you cannot see the image. The path is correct. This code does't work but for documentation in right. Can you help me?

var htmlContent = @"
<html>
    <head><title>Test</title></head>
    <body>
        <img src='file:///folder/to/the/images/chart.jpeg' alt='Local image'>
    </body>
</html>";

var browserFetcher = new BrowserFetcher()
{
    BaseUrl = BaseDirectory,
    Browser = SupportedBrowser.Chrome,
};

var installedBrowser = await browserFetcher.DownloadAsync(BrowserTag.Stable);

var options = new LaunchOptions
{
    ExecutablePath = installedBrowser.GetExecutablePath(),
    Headless = true,
    Args = new[]
    {
        "--no-sandbox", 
        "--disable-setuid-sandbox",
        "--disable-gpu",
        "--disable-web-security"
    }
};

var browser = await Puppeteer.LaunchAsync(options);

var page = await browser.NewPageAsync();

await page.SetContentAsync(htmlContent);

await page.WaitForSelectorAsync("img");

await page.PdfAsync(outputFilePath, new PdfOptions
{
    Format = PaperFormat.A4,
    PrintBackground = true
});

await browser.CloseAsync();

hardkoded / puppeteer-sharp

Problem with page.Request event #2781