Headless Moodle: Iframe authentication

Headless Moodle: Iframe authentication

by Feras Abdulazem -
Number of replies: 0

Hello everyone!

I'm building a PWA-App using React in the frontend and would like to use Moodle as my backend. (so basically using Moodle as an headless LMS/CMS).

The "Moodle mobile web service" seems to cover all my needs, and to my knowledge, the mobile app uses this service as well.

The only problem i have, is handling H5P-content. 

I have installed the "Interactive Content – H5P" plugin (the official H5P plugin), to handel editing/publishing H5P content, which seems to work fine. 

For the frontend, I have tried embedding the content using an iframe, but I can't get the authentication to work correctly. The embed script (moodle/mod/hvp/embed.php) accepts two optional parameters, an userid and a secret. the userid is obvious, however I don't understand, what the "secret" is (and I've already tried using the authentication token, which didn't work ;) )   

(i will always get the error "You do not have access to this content. Try logging in.")

so my question is:

how can I authenticate the user to show the H5P content in an iframe? or are there any alternatives to iframes?

the H5P content dose work in the Moodle App and it uses an iframe, right?

System:

  • Moodle: 3.9.4+ (Build: 20210211)
  • Interactive Content – H5P: 1.21.0

Iframe code:

``` typeScript

<iframe
   src={`/api/mod/hvp/embed.php?id=5&secret=${token}&userid=${userId}`}
   width="2186"
   height="1255"
   frameBorder="0"
   allowFullScreen
></iframe>

```

many thanks! smile    

Average of ratings: -