我正在基于 Next.js 的 LMS 中实现 SCORM 播放功能。我有一个功能播放器,可以加载和播放存储在 S3 存储桶中的 SCORM 包,通过充当代理的 Next.js API 路由进行访问。此设置非常适合独立的 SCORM 包:我向全局提供 SCORM API
window
,包可以找到它,并且我可以跟踪/保存进度。
但是,我面临来自
cloud.scorm.com
等来源的 SCORM 软件包的问题。这些包不包含实际的 SCORM 内容,而是通过以下方式加载:
由于这些包尝试访问
window.parent
来定位 SCORM API,但位于不同的域中,浏览器的跨源限制会阻止访问,我不知道如何桥接此通信。
有人处理过这种 SCORM 设置吗?该包依赖于跨域弹出窗口或 iframe?任何建议将不胜感激!
到目前为止我还没有想出任何解决方案。
SCORM Cloud 旨在提供自己的 SCORM 跟踪,使您(或任何)网站能够托管课程,而无需设置 SCORM RTE。如果您想使用 SCORM Cloud 并且您自己的 RTE,您可能需要进行 SCORM Cloud 集成,这是自定义 Rustici 集成,而不是 SCORM 规范的一部分。
关于启动存储在其他非 SCORM 云域(例如 example.com/mycourse)上的课程,听起来您已经进行了排序,因为您的 S3 存储桶文件工作正常。
这些领域的课程必须配置为允许与您的 LMS 通信。这可以通过多种方式完成,包括在远程服务器上设置 CORS 规则,或使用代理文件(如 Rustici 内容控制器)。
我过去的做法是创建一个 SCORM 包,其中仅包含 imsmanifest 和一个 index.html 文件。该文件将包含一段 JS,它将远程内容加载到 iframe 中,并处理 SCORM RTE 调用。然后我会使用 postMessage 或类似的技巧来启用 index.html 和远程文件之间的跨域通信。
需要理解的重要一点是:在我的设置中,远程文件从不直接与 SCORM 或 LMS 交互,它们只与 index.html 文件交互。所有 SCORM 交互均由 index.html 文件处理。因此,课程内容文件将有一个触发器,例如
postMessage("bookmark","page2")
,index.html 文件将有 JS 接收并转换为 SCORM 调用,例如 scorm.LMSSetValue("cmi.lesson_location", "page2)