Oxx
Oxx

Reputation: 1

SCORM issues with packages that load content from an external domain on a popup window

I'm implementing SCORM playing functionality in a Next.js-based LMS. I have a functional player that can load and play SCORM packages stored in an S3 bucket, accessed via a Next.js API route acting as a proxy. This setup works perfectly for self-contained SCORM packages: I provide the SCORM API to the global window, packages find it, and I can track/save progress.

However, I’m facing issues with SCORM packages from sources like cloud.scorm.com. These packages don’t contain the actual SCORM content but instead load it by:

I'm particularly having issues with the popup. Since these packages attempt to access window.parent to locate the SCORM API but are on a different domain, the browser’s cross-origin restrictions block access, and I can't figure out how to bridge this communication.

Has anyone dealt with this kind of SCORM setup, where the package relies on a cross-origin popup or iframe? Any advice would be greatly appreciated!

I’ve not been able to come up with any solution so far.

Upvotes: 0

Views: 103

Answers (2)

Oxx
Oxx

Reputation: 1

It turned out to be some strange behavior caused by running on localhost. After uploading to the development server, everything worked

Upvotes: 0

pipwerks
pipwerks

Reputation: 4581

SCORM Cloud was designed to provide its own SCORM tracking, enabling your (or any) website to host courses without setting up a SCORM RTE. If you want to use SCORM Cloud and your own RTE you'd probably need to do a SCORM Cloud integration, which is a custom Rustici integration, not part of the SCORM spec.

Regarding launching courses stored on other non-SCORM Cloud domains (e.g. example.com/mycourse), it sounds like you already have that sorted since your S3 bucket files work fine.

The courses on those domains have to be configured to allow communication with your LMS. This can be done in many ways, including setting up CORS rules on the remote server, or by using proxy files, a la Rustici Content Controller.

The way I used to do it was to create a SCORM package that contained just the imsmanifest and an index.html file. This file would have a snippet of JS that would load the remote content into an iframe, and would handle the SCORM RTE calls. I'd then use postMessage or similar tricks to enable cross-domain communication between the index.html and remote files.

The important thing to understand: In my setup, the remote files never directly interact with SCORM or the LMS, they only interact with the index.html file. All SCORM interactions are handled by the index.html file. So a course content file would have a trigger such as postMessage("bookmark","page2") and the index.html file would have JS that receives and converts to a SCORM call such as scorm.LMSSetValue("cmi.lesson_location", "page2)

Upvotes: 1

Related Questions