H5p using react

Forums: 

Hi guys,

I tried to create new interactive content using .h5p file. I have uploaded the file successfully, however, I'm not able to save it as I'm getting an error "You must choose an H5P content type or upload an H5P file.".

I tried to create it on https://h5p.org/node/add/h5p-content

 

Thank you

H5P file: 
thomasmars's picture

Hi,
You're not allowed to upload new libraries to h5p.org for security reasons. Please try to upload it at your own local development site and see if you get the same message.

Hi,
But as on h5p.org, it is written that h5p is completely free and open source technology, so I should have been able to upload new content. If it is not possible at all, can you provide me some steps on how to upload it on a local development site which is built using react.

thomasmars's picture

Hi, being open source and allowing anyone to upload content is not equivalent. Allowing this would open h5p.org up to malicious attacks.
Installation & setup steps for setting up a local development site can be found in our documentation. Please let us know what you've tried so far and where you are stuck if you need help.

Hi,

Thanks for the info,
I've created new content on h5p.org and embed it in my Reactjs app using an iframe and this works fine. I've also created ".h5p" file which I want to use in my Reactjs project. So I want steps on how to use this ".h5p" file in Reactjs (if possible) because I want to gather user data. And the documentation provided on "h5p.org" only helps us on how to use it with Drupal, Moodle or WordPress.

thomasmars's picture

Hi,
Yes, our core is in PHP so we don't have an integration directly with node if you want to run it on a Node backend. The ".h5p" file can thus not be used directly within your React project. What you can do is upload the ".h5p" file to a server that supports H5Ps and then embed the view within your React app. See "upload existing content" and "embed content" for more info on how to achieve this.

Thanks for the help

 

How do I host a .h5p file on a h5p CLI server to embed it and use it in my react project without using Moodle, Drupal or Joomla?

otacke's picture

Hi nshah!

You can see how it works in action in the recording of a developer webinar.

Best,
Oliver

Thank you so much Oliver! It was very helpful. 

Regards,

Niyati

 

otacke's picture

Hi Niyati!

Glad I could be of assistance!

Best,
Oliver