Hi,
I am trying to adapt the ‘Treasure Hunt’ activity plugin for Moodle mobile, using the guide Mobile_support_for_plugins. This module for Moodle allows to organize outdoor-serious-games with your students.
For this, it is necessary to use certain external libraries, some essential such as openlayers to display maps. The only way I know to add the script dynamically in the moodle app is as follows:
loadOlScript(url) {
return new Promise((resolve, reject) => {
//load script
let script = document.createElement("script");
script.onload = () => {
resolve();
};
script.onerror = error => reject();
script.type = "text/javascript";
script.src =
"https ://cdn.rawgit .com/openlayers/openlayers.github.io/master/en/v6.0.1/build/ol.js";
// script.src = url;
document.getElementsByTagName("head")[0].appendChild(script);
});
}
When debugging using https://mobileapp. moodledemo. net/, the library loads correctly if the Moodle server is at localhost and load the library from the server, but gives the following security policy error in any other case:
Refused to load the script 'https ://cdn.rawgit. com/openlayers/openlayers.github.io/master/en/v6.0.1/build/ol.js' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-inline' 'unsafe-eval' http://localhost:* filesystem: cdvfile: file:". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
This is due to the <meta> tag entered in the app's index.html
Is there a method to load an external library dynamically in Moodle Mobile?
Thanks in advance