It has an embedded system, which operates with an IP (example: 192.168.0.237) different from each device, where the Import/Load file functionality depends on JQuery. The goal is to get this feature to work without needing an internet connection, it is currently using pointing to https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js and it works without problems. Changing the code, to access the "jquery.js" file locally. The page that loads the UPLOAD functionality is operating on port 8989. This, the path can be placed in the HEAD of the files, like this:
<script type='text/javascript' src='jquery.js'></script>
When running, inspecting the NETWORK tab, we have the result path:
"192.168.0.237:8989\jquery.js"
that is, it maps through port 8989, it fails to find the file, as it is stored in the root with port 80. Therefore, to validate the solution FORCE doing:
<script src='http://192.168.0.237/jquery.js'></script>
I added this instruction at the top of the file inside HEAD, AND the file UPLOAD feature WORKED correctly. Validating, which solution is suitable. But, in order to work correctly, it must obtain the IP of the device, so a SCRIPT was made using "window.location.hostname" to obtain the IP of the device and assemble the URL.
<script>
let k2 = '#http://';
let k3 = window.location.hostname;
let k4 = '@jquery.js';
let fim = `${k2} ${k3} ${k4}`;
fim = fim.replace(' @', '/');
fim = fim.replace('#', ' ');
fim = fim.replace('// ', '//');
fim = fim.trim();
document.getElementById('demo').innerHTML = window.jQuery;
document.getElementById('kkk').innerHTML = fim;
document.head.appendChild(document.createElement('script')).src = fim;
</script>
In this SCRIPT we have the last line "document.head.appendChild(document.createElement('script')).src = fim" which inserts the statement to load JQuery into the HEAD. Clicking on the "Check JQuery Status" button, the message that JQuery is loaded and available appears.
But now comes the problem, when pressing the submit button, update, the shown below occurs:
Imagem upload1
Imagem upload2
Imagem upload3
In short, an error occurs because it points to "serverIndex:1" and the correct would be only "serverIndex".
In other words, we have the INITIATOR pointing to "serverIndex:1" which doesn't exist (it doesn't even have to adjust the instruction, a syntax error will happen).
So, in short, with statement adding "jquery.js" STATIC = WORKS, but with statement ADDING "jquery.js" DYNAMICLY DOES NOT WORK.
With the STATIC instruction inserted in the HEAD, we have the expected operation as indicated below: (Note the INITIATOR = serverIndex)
WORKS OK RESULT
I need guidance as I don't know how to solve and also if this solution is suitable. Below is the rendered code:
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<script>
function checa() {
if(jQuery) {
alert('Jquery ONLOAD!');
} else {
alert('Jquery NOT HAVE - NUNCA EXECUTA');
}
}
</script>
<script src='http://192.168.0.237/jquery.js'></script>
</head>
<button onclick='checa()'>Check Status JQuery</button>
<form method='POST' action='#' enctype='multipart/form-data' id='upload_form'>
<h4>valor:</h4>
<p id='demo'> </p>
<p id='kkk'></p>
<h3>Verificador de preço</h3>
<h3>Update Firmware</h3>
<input type='file' name='update' id='file' onchange='sub(this)' style=display:none accept='.bin' required>
<label id='file-input' for='file'> Selecione o arquivo ...</label>
<input type='submit' class=btn value='Atualizar'>
<br>
<br>
<div id='prg'></div>
<br>
<div id='prgbar'>
<div id='bar'></div>
</div>
<br>
</form>
<script>
let k2 = '#http://';
let k3 = window.location.hostname;
let k4 = '@jquery.js';
let fim = `${k2} ${k3} ${k4}`;
fim = fim.replace(' @', '/');
fim = fim.replace('#', ' ');
fim = fim.replace('// ', '//');
fim = fim.trim();
document.getElementById('demo').innerHTML = window.jQuery;
document.getElementById('kkk').innerHTML = fim;
document.head.appendChild(document.createElement('script')).src = fim;
</script>
<script> <!-- DOWN IS SCRIPT UPLOAD FILE !-->
function sub(obj) {
var fileName = obj.value.split('\\');
document.getElementById('file-input').innerHTML = ' ' + fileName[fileName.length - 1];
How the code is structured: (it is enclosed in QUOTES because as soon as it is stored in the String)
Code up
Code bottom
Code call String serverIndex
Finally, I hope to be guided on how to resolve the situation and whether this solution is adequate and correct.