Access Header in SCORM for API in TALENT LMS

Oct 06, 2022

I am using Talent LMS and it's API capabilities. The Talent guy say I need to create an a Access Header with my API key and place it in the SCORM file.

I have API calls within Javascript  in the course. The CALS give me  CORS error.

 

Any idea where the Access header needs to go inthe SCORM package?

6 Replies
Sam Hill

Hi Roger, the CORS error suggests that content and LMS are on different domains? This suggests that the two cannot communicate due to the same origin policy. It sounds like more of an Talent LMS API question.

Is the Talent guys able to help you out with the CORS error? Did you implement the Access Header and use the API key within  your JavaScript. I'm sure Talent LMS will have some documentation on how to implement this in JavaScript, but the CORS error is likely due to there not being a correct API key in the access headers?

Sam Hill

Hi Roger, I'm happy to take a look if you are happy to share a file privately. It's fine to omit the API key, but I can check your implementation to see if I can spot anything obvious. I'm no expert in this area, but I have worked with a lot of APIs and so do have some understanding of what is required for them to work. I do enjoy solving this stuff too, if I have the time!

I also found this online documentation that may help? https://www.talentlms.com/pages/docs/TalentLMS-API-Documentation.pdf

Roger Hernandez

HI Sam,

Thanks for offering to help. 

Sorry for the late response I forgot where I posted this when i last saw your response.  My mind is getting old and forgetful.(ha)

Here is the code. I probably am missing one tiny element. 

This was all extrapolated from Postman.

 

ar myHeaders = new Headers();
myHeaders.append("Authorization", "Basic {apikey}==");


var raw = "";

var requestOptions = {
  method: 'GET',
  mode: 'cors',
  headers: myHeaders,
 
};

fetch("https://dsi.talentlms.com/api/v1/addusertogroup?user_id=8&group_key={groupkey}", requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error));

 

Here is the console error once the javascript fires.   No console errors other wise.

Access to fetch at 'https://dsi.talentlms.com/api/v1/addusertogroup?user_id=8&group_key=AFydWOsHF' from origin 'https://cdn.talentlms.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

 

Sam Hill

Hi Roger, I don't think it is going to be possible for you to use the API the way you are trying to use it with Basic Authentication. I'm happy to be corrected, but using it that way means the API key has to be stored in JavaScript, which is easy to see via the source code of a course that is built, or can be seen in the requested headers via the browser console.

What needs to happen is that the request needs to go via a server side proxy on the server the content is hosted on. The API key would be stored server side. Your request would then go via the proxy, which would then make the request to the TalentLMS API, which would then relay back to your content. As far as I understand, this is the implementation that is required to a) Overcome any CORS errors. The same restrictions do not apply if the request is coming from a server and not a browser, and b) To make the request more secure.

Have you used the service Post Master before. It is worth setting that up and testing your API in there first. I was able to set one up quickly, and run tests and it worked successfully. however when using that same API locally, I have the CORs error too.

https://help.talentlms.com/hc/en-us/articles/360014658673-How-to-use-Postman-to-generate-TalentLMS-API-code-snippets-in-various-programming-languages

At least you will be able to confirm the API is working successfully.