WebKit Converter create blank image

Hi
I'm working with the HtmlToPdfConverter to create a thumbnail of a webpage with the ConvertToImage() function. Everything is working fine, but some urls are returning a blank/white image, for example https://web.schabi.ch/lernen/einmaleins or https://quasar.dev/. Both are javascript applications. On https://www.sbb.ch/de/ some parts are missing. I suspect that it has something to do with css transistions/animations. 

Any ideas to solve this? I already tried it with additional delay: webKitConverterSettings.AdditionalDelay = 10000;

Cheers,
Christof


9 Replies 1 reply marked as answer

GK Gowthamraj Kumar Syncfusion Team August 31, 2020 09:09 AM UTC

Hi Christof, 
 
Thank you for using  Syncfusion products. 
 
Our HTML converter may generate blank PDF/Image while converting HTTPS sites to PDF/image. For converting HTTPS sites to PDF or image, WebKit rendering engine requires OPENSSL libraries. So, please make sure the OPENSSL assemblies are available in the machine where the conversion takes place. Please refer below links for more details,  
 
However, the below mentioned OPENSSL assemblies can be placed in the Windows system folder of the machine. (for 64-bit machine, it should be place in $SystemDrive\Windows\SysWOW64 and for 32-bit machine, it should be place in $SystemDrive\Windows\System32).  
  • libeay32.dll
  • libssl32.dll
  • ssleay32.dll
 
Please let us know if you need any further assistance with this.    

Regards, 
Gowthamraj K 



CM Christof Müller August 31, 2020 09:13 AM UTC

Hi Gowthamraj
Thank you for your quick response. The DLLs are present and "normal" HTTPS-pages are converted correctly. It must be something else.

Regards,
Christof


GK Gowthamraj Kumar Syncfusion Team September 1, 2020 11:57 AM UTC

Hi Christof, 

On further analysis, we internally make use of the QtWebKit rendering engine for converting HTML to PDF. QtWebKit rendering engine preserves the output PDF document like how the input HTML file/URL is displayed on the WebKit based web browsers (safari, internal tool). The same behavior as replicates in our converter. Some URL sites are not loaded and other sites are missing styles in the browser itself. You can check these URL with Safari and internal tool, we have attached a screenshot of the webpage view in the safari browser for your reference. 

Safari
 
Steps to use the WebKit browser (internal tool):  
  1. Download and Extract the browser from above link. 
  2. Copy and Paste the fancybrowser.exe into QtBinariesWindows folder. 
  3. Run the fancybrowser.exe.  
  4. Browser window will open with default URL (www.google.com) and you can also modified the URL and check the web page behavior. 

However, the provided HTML file is converted properly in our Blink rendering engine. The provided URL is rendered as expected in Blink conversion.  Blink rendering engine internally using chrome headless browser for converting HTML to PDF. It will preserve the PDF document like how the input HTML is displayed in chromium based web browsers. Kindly please try our latest Blink rendering engine and let us know if it is suites your requirement.  

We have attached the sample and output documents (WebKit and Blink) for your reference. Please find the sample and document from below link, 

Note: Due to the GDI limitations and restriction of the Azure App service environment, the Blink rendering engine does not support conversion in Azure app service (Azure websites) and Azure function.     
  
Please try the above suggestions in your end and let us know if you need any further assistance with this.      

Regards, 
Gowthamraj K 


Marked as answer

CM Christof Müller September 2, 2020 01:45 PM UTC

Dear Gowthamraj

Thank you very much for the answer and tests! Great support. The sample documents shows that blink would be the rendering engine I need. Unfortunately, my site is running on Azure app service. So I have to find another way...

Best regards,
Christof




GK Gowthamraj Kumar Syncfusion Team September 3, 2020 12:30 PM UTC

Hi Christof, 

Thank you for your update.   
   
As we mentioned earlier, Blink does not support conversion in Azure app service (Azure websites) and Azure function. Azure app service environment does not have elevated permissions and enough rights to launch the browser for converting HTML to PDF. However, we can use the Blink rendering engine in Azure cloud service, it has elevated permissions and enough rights to launch the browser.   
  
Please refer the below KB link for HTML to PDF conversion in Azure cloud service using Blink,     

However, we can convert an HTML to PDF in Azure app service using the Blink with a Linux docker container. Please refer the below KB link, 
Please try the above suggestions in your end and let us know if you need any further assistance with this.  
 
Regards, 
Gowthamraj K 



ML Matt Lamourie December 30, 2020 06:30 AM UTC

Do you have a link to the 3 SSL binaries mentioned in the prerequisites:

  1. libeay32.dll
  2. libssl32.dll
  3. ssleay32.dll
You have provided a link to an installation package:

However we don't have permission to run installation packages downloaded from the internet. If all that is required is the 3 dlls, why an is an installation required? Are you able to provide just the dlls?

Thanks,
Matt



GK Gowthamraj Kumar Syncfusion Team December 31, 2020 12:24 PM UTC

Hi Matt, 

Thank you for contacting Syncfusion support. 

Yes. Due to security reasons, we have provided the link to an OpenSSL installation package. As per your request, we have attached the entire OpenSSL assemblies in the below link. The below mentioned OPENSSL assemblies can be placed in the Windows system folder of the machine. (for 64-bit machine, it should be place in $SystemDrive\Windows\SysWOW64 and for 32-bit machine, it should be place in $SystemDrive\Windows\System32).  
  • libeay32.dll
  • libssl32.dll
  • ssleay32.dll

Please find the assemblies from below link, 

Please let us know if you need any further assistance with this. 

Regards, 
Gowthamraj K 



DJ David Jackson February 11, 2021 06:51 PM UTC

How can you do this when deploying a web application as you do not have access to those folders


GK Gowthamraj Kumar Syncfusion Team February 12, 2021 12:33 PM UTC

Hi David, 

Thank you for your update. 

If you not able to access the folder while deploying, we can copy and paste the OpenSSL assemblies inside the QtBinaries folder for performing the HTML to PDF conversion. If you are hosting the application in Azure, by default, some Azure websites do not have the OPENSSL assemblies. So, these assemblies should be added to the website explicitly. We could not place the assemblies in system drive on Azure App service environment. Refer below steps to place the OPENSSL assemblies in Azure for converting HTTPS sites to PDF.  

.NET Framework

  1. Create a new folder in a project and copy the OPENSSL assemblies to that folder.
  • libeay32.dll
  • libssl32.dll
  • ssleay32.dll
  1. Include that folder in a project and set copy to the output directory as “Copy always”.
  2. Get the path of the OPENSSL assemblies folder in C# and set it to the environment variable.
 
.NET Core: 
 
  1. Copy the OPENSSL assemblies into the QtBinariesDotNetCore folder.
  2. Then set the copy to output directory as “Copy always” for all the files under QtBinariesDotNetCore folder.
  3. There is no need to set environment variable for OPENSSL, the converter can access the OPENSSL assemblies from the QtBinariesDotNetCore folder itself.

Refer below link for more information about adding OPENSSL assemblies in Azure. 

Please let us know if you need any further assistance with this. 

Regards, 
Gowthamraj K 


Loader.
Up arrow icon