Office文档到HTML转换以使用JavaScript在浏览器中查看

Question

We are working on AngularJS application. The requirement is to show documents in new tab in HTML format. Thus we are implementing one converter that basically will convert office documents (doc, docx and odt) into HTML viewer. We have implemented converter using Apache POI . We have written three converter to convert doc, docx and odt into HTML.

PROBLEM

Text conversion working fine, but the problem arise when the doc contain any image. So the converter extract image by downloading image on my local system, reference code :

protected void doGenerateHTMLFile( String fileInName )
        throws IOException
    {

        String root = "target";
        String fileOutName = root + "/" + fileInName + ".html";

        long startTime = System.currentTimeMillis();

        XWPFDocument document = new XWPFDocument( AbstractXWPFPOIConverterTest.class.getResourceAsStream( fileInName ) );

        XHTMLOptions options = XHTMLOptions.create();// .indent( 4 );
        // Extract image
        File imageFolder = new File( root + "/images/" + fileInName );
        options.setExtractor( new FileImageExtractor( imageFolder ) );
        // URI resolver
        options.URIResolver( new FileURIResolver( imageFolder ) );

        OutputStream out = new FileOutputStream( new File( fileOutName ) );
        XHTMLConverter.getInstance().convert( document, out, options );

    }

Now next task is to show the converted doc into HTML (it include local file system path for containing image) will not show the image as JS :

 Not allowed to load local resource: file:///C:/Users/admin/M_Test/image/image1.JPG

UPDATE

I have changed the path of images to my website path as : http:\\localhost:111\\temp\\ebe6a869-3df7-4ef4-b798-5ed323e4090f\\images\\myimage/wor‌​d/media/image1.JPG at options.URIResolver(new FileURIResolver(new File(sLocalHostImagePath)));

But on conversion it appending the path of my project like : C:\\MY_DRIVE\\PROJECTS\\OutSource\\svn\\IAP-Dynamic-Sql\\http:\\localhost:111\\temp\\ebe6‌​a869-3df7-4ef4-b798-5ed323e4090f\\images\\myimage/word/media/image1.JPG ,

how it can only be my localhost path?

Thus in all we are not able to load doc into well format in new tab.

Is this a correct approach to convert doc into HTML or any better approach can be adopted?

Answer 1

Instead of writing custom code to covert these, you might want to make use of mammoth JS library.Might be 4 years too late, it seems :) but anyways its a library for displaying doc, docx documents by converting them to html on the browser side as well as can be handled on the backend.

• Library Supports - JavaScript, both the browser and node.js. Available on npm. Python. Available on PyPI. WordPress. Java/JVM. Available on Maven Central. .NET. Available on NuGet.
• Link: https://mike.zwobble.org/projects/mammoth/ (Demo and Article)
• Github: https://github.com/mwilliamson/mammoth.js