Permission denied to access "API" on cross origin object

61 Views Asked by At

I have the following javascript that I'm using to open a scorm package in a window.

openWindow: function (winURL, winName, winW, winH, winOpts) {
      winOptions = winOpts + ",width=" + winW + ",height=" + winH;
      newWin = window.open('', winName, winOptions); // Open a new window
      newWin.moveTo(0, 0);
      newWin.focus();
      const searchParams = new URLSearchParams(window.location.search);
      //Data for tracking course
      this.url = window.location.origin;
      this.base_url = url;
      this.course_id = searchParams.get('cid');
      var response = makeSyncApiCall(this.base_url +"/api/get_course/"+this.course_id, "GET");
      if(response.success) {
        this.path = response.success.scorm_url
      } else {
        this.path = '';
      }
    
      // Check if the URL is provided
      if (winURL) {
        // Create an iframe element
        var iframe = document.createElement('iframe');
        iframe.src = this.path +"/"+winURL;
        iframe.width = '100%';
        iframe.height = '100%';
        iframe.style.border = 'none';
    
        // Append the iframe to the new window's document body
        newWin.document.body.appendChild(iframe);

        return newWin;

      }
    },

So the function takes winURL which is only the name of the file that is there in the manifest file. for eg: index.html My base url is something like https://qa-media-xxx.com/scorm/index.html. This is my aws path to the index file.

Now when I play my scorm, it opens the window, fetches the above index.html, creates an iframe in the window and embed the index.html inside that.

Then when the scorm starts, it looks for the API object in the window but the permission gets denied. I believe its because my site domain from where the popup is being opened is different than the one that I fetched the file from ?

I am attaching below the error I get on the opened window. cross origin error

And this is what it tries that is causing the error

(((win.API == null) || typeof (win.API) == "undefined") && (win.parent != null) && (win.parent != win))
1

There are 1 best solutions below

0
On

There isn't really a question here, other than if you are asking that your suspicion is correct, and, yes your suspicion is correct. SCORM generally does not work in a cross origin safe way because of the JavaScript runtime restriction. There are generally a few options:

  • Use browser methods for message passing between the content and something wrapping it that is on the same origin as the SCORM API,
  • Move the content so that it lives in the LMS that is providing the SCORM API,
  • Switch to an eLearning package that uses a runtime that doesn't have this restriction (a la cmi5 or AICC)

For more on this see https://scorm.com/scorm-cross-domain/ (full disclosure I work for Rustici Software who runs that site)