score:0
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!
score:0
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
score: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
score:1
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.
score:2
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>
Source: stackoverflow.com
Related Query
- Powerpoint viewer for react?
- React Hook Warnings for async function in useEffect: useEffect function must return a cleanup function or nothing
- React PropTypes: Allow different types of PropTypes for one prop
- React prop validation for date objects
- OnChange event using React JS for drop down
- How to get rid of underline for Link component of React Router?
- Typescript react - Could not find a declaration file for module ''react-materialize'. 'path/to/module-name.js' implicitly has an any type
- Multiple path names for a same component in React Router
- Does React keep the order for state updates?
- react hooks useEffect() cleanup for only componentWillUnmount?
- How to create unique keys for React elements?
- How React JS index.js file contacting index.html for id references?
- Using mixins vs components for code reuse in Facebook React
- How to specify (optional) default props with TypeScript for stateless, functional React components?
- syntax highlighting for react code in sublime
- Can you use es6 import alias syntax for React Components?
- react Material-ui, How do I know I can use onClick for button?
- React - getting a component from a DOM element for debugging
- React Hooks: Why is .current null for useRef Hook?
- TypeScript workaround for rest props in React
- How to disable source maps for React JS Application
- How to test style for a React component attribute with Enzyme
- componentWillReceiveProps, componentDidUpdate for React Hook
- Checking for Undefined In React
- React JSX: Iterating through a hash and returning JSX elements for each key
- Typescript types for React checkbox events and handlers?
- How to config ESLint for React on Atom Editor
- React and TypeScript—which types for an Axios response?
- React testing library on change for Material UI Select component
- For loop in react render method
More Query from same tag
- Modal Textarea reloads with every click
- Interpolate a component into a string
- Reactjs - react-reponsive-carousel
- Styling Grid to have more elements than text
- How to extend or merge Styled Components theme
- Preventing blue path rectangle in react-simple-maps
- change classname of element based on route in react router
- 405 - Uncaught (in promise) Error: Request failed with status code 405
- How to use react-i18next <Trans> Component to display array elements?
- Pagination - creating a new document
- Algolia: Reset of refinement when opening a drawer
- socketio client is receiving "double + 1" events
- Matcher error: received value must be a mock or spy function
- How to work react-table and react-contextmenu frankensteined together
- Please verify that the package.json has a valid "main" entry
- How to compress json to get it with `bodyParser.json`
- Delay load on every page with reach-router
- Problem about response data from Slice to index.js - React redux toolkit
- React Button Click Event Not working correctly
- useState conflicts with async operations in React
- how to delete element from array
- Rendered fewer hooks than expected error in the return statement
- React map function - return one item at random
- Picking up a prop when passed from grandparent to parent component
- Property 'value' does not exist on 'EventTarget' in TypeScript
- ComponentDidMount redux-saga action not working
- Why this react hook cause infinite loop?
- Is there a way to add a badge on marker in react-leaflet?
- React render state not the real state
- Styled Components & React: Click event