Error when you import images in html HtmlFormatProvider

8 posts, 1 answers
  1. Андрей
    Андрей avatar
    7 posts
    Member since:
    Dec 2014

    Posted 31 May 2015 Link to this post

    Hi,

    I do HtmlFormatProvider.Import (html), in html have Images, there is an exception (ParamName: data)

    (Telerik ASP.NET AJAX 2015.1.104.45)

    Why?

  2. Answer
    Petya
    Admin
    Petya avatar
    975 posts

    Posted 01 Jun 2015 Link to this post

    Hi Андрей,

    For the time being, importing HTML that contains an image from an external source (i.e. on the web or a file) would not work. The library only supports images encoded as raw data. For all other cases you can use the import settings in order to capture the LoadFromUri event and load the image, for example like this:
    HtmlFormatProvider provider = new HtmlFormatProvider();
    provider.ImportSettings.LoadFromUri += (s, e) =>
    {
        string extension = Path.GetExtension(e.Uri);
        Uri uri = new Uri(e.Uri, UriKind.RelativeOrAbsolute);
        System.Net.WebClient oWebClient = new System.Net.WebClient();
        
        using (MemoryStream stream = new MemoryStream())
        {
            oWebClient.OpenRead(uri).CopyTo(stream);
            e.SetData(stream.ToArray());
        }
    };
    this.document = provider.Import(str);

    I hope this helps.

    Regards,
    Petya
    Telerik
  3. Андрей
    Андрей avatar
    7 posts
    Member since:
    Dec 2014

    Posted 01 Jun 2015 in reply to Petya Link to this post

    What is..."document " and "str"?

    this.document = provider.Import(str);

  4. Андрей
    Андрей avatar
    7 posts
    Member since:
    Dec 2014

    Posted 01 Jun 2015 in reply to Андрей Link to this post

    Now there are no errors, but then I export html and Images do not appear in the file docx (MS Word).

           

            DocxFormatProvider provider = new DocxFormatProvider();
            HtmlFormatProvider formatProvider = new HtmlFormatProvider();
            formatProvider.ImportSettings.LoadFromUri += (s, e) =>
            {
                string extension = Path.GetExtension(e.Uri);
                if (this.IsSupportedImageFormat(extension))
     
                {
                    Uri uri = new Uri(e.Uri, UriKind.RelativeOrAbsolute);
                    System.Net.WebClient oWebClient = new System.Net.WebClient();
     
                    using (MemoryStream stream = new MemoryStream())
                    {
                        var openRead = oWebClient.OpenRead(uri);
                        if (openRead != null)
                        {
                            openRead.CopyTo(stream);
                            e.SetData(stream.ToArray());
                        }
                    }
                     
                }
            };
    byte[] byteArray;
    RadFlowDocument document = formatProvider.Import(html);
    byteArray = provider.Export(document);

     // Response.BinaryWrite(byteArray);

  5. Petya
    Admin
    Petya avatar
    975 posts

    Posted 02 Jun 2015 Link to this post

    Hi Андрей,

    Could you confirm the images are properly downloaded? You can try saving them to files (i.e. the stream variable from your snippet) to see if everything is working correctly up until this point in the logic.

    In case the images are downloaded but are lacking in the exported DOCX, please send over a sample HTML document that we can test this with. I could not replicate an issue with the logic, so I'm not sure what might be causing such result on your end.

    Regards,
    Petya
    Telerik
  6. Андрей
    Андрей avatar
    7 posts
    Member since:
    Dec 2014

    Posted 02 Jun 2015 in reply to Petya Link to this post

    I am working in asp.net
    Image comes right, I checked.
    Without images docx document configured correctly.
    Here is the code (function ExportToWordClick makes exports to MS Word):

        private bool IsSupportedImageFormat(string extension)
        {
            if (extension != null)
            {
                extension = extension.ToLower();
            }
            return extension == ".jpg" ||
                extension == ".jpeg" ||
                extension == ".png" ||
                extension == ".bmp" ||
                extension == ".tif" ||
                extension == ".tiff" ||
                extension == ".ico" ||
                extension == ".gif" ||
                extension == ".wdp" ||
                extension == ".hdp";
        }
     
     
    protected void ExportToWordClick(object sender, EventArgs ea)
        {
            byte[] byteArray;
    string html = "<div id='p2'><span id=test1><img alt='' src='http://pravopmr.ru/Content/Images/News/attention.png' /></span>Test</div>";
      
            DocxFormatProvider provider = new DocxFormatProvider();
            HtmlFormatProvider formatProvider = new HtmlFormatProvider();
      
            formatProvider.ImportSettings.LoadFromUri += (s, e) =>
            {
                string extension = Path.GetExtension(e.Uri);
                if (this.IsSupportedImageFormat(extension))
      
                {
                    Uri uri = new Uri(e.Uri, UriKind.RelativeOrAbsolute);
                    System.Net.WebClient oWebClient = new System.Net.WebClient();
      
                    using (MemoryStream stream = new MemoryStream())
                    {
                        var openRead = oWebClient.OpenRead(uri);
                        if (openRead != null)
                        {
                            openRead.CopyTo(stream);
                            e.SetData(stream.ToArray());
                        }
                    }
                }
            };
      
            try
            {
                RadFlowDocument document = formatProvider.Import(html);
                RadFlowDocumentEditor editor = new RadFlowDocumentEditor(document);
                byteArray = provider.Export(document);
            }
            catch (Exception)
            {
                const string errorMsg = "Произошла ошибка экспорта текста документа. Просьба обратиться к разработчикам";
                RadFlowDocument document = formatProvider.Import(errorMsg);
      
                byteArray = provider.Export(document);
      
            }
      
            Response.Clear();
            Response.ContentType = "application/vnd.openxmlformats-officedocument.wordprocessingml.document";
            Response.AddHeader("Content-Disposition",
                               String.Format("attachment;filename={0}","test.docx"));
            Response.BinaryWrite(byteArray);
            Response.Flush();
            Response.Close();
            Response.End();
    }

  7. Petya
    Admin
    Petya avatar
    975 posts

    Posted 05 Jun 2015 Link to this post

    Hello Андрей,

    It looks like the image is actually in the exported DOCX, but it is not visible due to its size. This is related to the fact that it doesn't have width and height specified in the source HTML and when you import the document, the library internally sets (1,1) dimensions to such images.

    With the current version of the library the only workaround I can suggest is to specify the width and height properties of the image in the HTML:
    string html = "<div id='p2'><span id=test1><img alt='' src='http://pravopmr.ru/Content/Images/News/attention.png' height=\"42\" width=\"42\"/></span>Test</div>";

    We are currently working on a way for the size of images to be obtained from its source, so the suggested workaround will no longer be required. You can track this item in the public portal for the availability of the functionality, hopefully, it should be ready in time for the upcoming Q2 2015 release.

    I hope this is useful.

    Regards,
    Petya
    Telerik
  8. Андрей
    Андрей avatar
    7 posts
    Member since:
    Dec 2014

    Posted 06 Jun 2015 in reply to Petya Link to this post

    Thank you very much.
Back to Top