Powerpoint viewer for react?

问题

I searched a lot for this but couldn't find any package or a guide on how to view a ".ppt" file on a webpage using react.js.

I'm allowing the user to upload a ".ppt" file, and I want him to be able to view that "Powerpoint" file in a web page, is that even possible?

I tried the following but it didn't work ...

<iframe
    src={`https://view.officeapps.live.com/op/embed.aspx?src=[${linkToPPTFile}]`}
    width="100%"
    height="600px"
    frameBorder="0"
></iframe>

Any help will be appreciated.

回答1:

It appears that particular Microsoft embed link no longer works. One way to make it happen is to store the PowerPoint file in a public folder online and create an embed code in PowerPoint for the Web (https://www.office.com/launch/powerpoint). The embed code should include an <iframe/> tag.

There's more information about the process here: https://support.office.com/en-us/article/Embed-a-presentation-in-a-web-page-or-blog-19668A1D-2299-4AF3-91E1-AE57AF723A60

回答2:

If you have backend, it is built with node.js and you will have full control over production server (i.e. able to install software there), you can try to covert to png using ppt-png package. Under the hood it uses libreoffice for ppt-pdf conversion and then imagemagick for pdf-png conversion and this is the best approach to task.

回答3:

There's some similar information here.

From what I read it seems like you could either convert the powerpoints to flash and display those, or potentially use some sort of tool like slideshare or a google slides extension.

Hope this helps!

回答4:

The only possible user-uploaded PPT solution I could find involves uploading a copy of the file to One Drive, using Microsoft's API: https://docs.microsoft.com/en-us/onedrive/developer/rest-api/concepts/upload?view=odsp-graph-online

You could then create a "sharing link" using the API. The URL to the shared file is returned in the API response (https://1drv.ms/...) and anyone using the link can access the document to view it online. See: https://docs.microsoft.com/en-us/onedrive/developer/rest-api/api/driveitem_createlink?view=odsp-graph-online

回答5:

I also had this similar issue. The problem is with this part src=[${linkToPPTFile}] of your iframe src. Remove the box brackets. It should just be:

<iframe src={https://view.officeapps.live.com/op/embed.aspx?src=${linkToPPTFile}} width="100%" height="600px" frameBorder="0" > </iframe>

来源：https://stackoverflow.com/questions/60116059/powerpoint-viewer-for-react