0
I have this code:
function uploadFile(x){
//DEFINIÇÃO E RECEPÇÃO DAS VARIAVEIS PRA ENVIAR COM O AJAX
var file = document.getElementById("id_arq_documento_" + x ).files[0];
var id = document.getElementById("id_arq_" + x).value;
var local_armazenado = document.getElementById("local_armazenado_" + x).value;
var autorizacao = document.getElementById("autorizacao_" + x).value;
//CHECA SE O INPUT FILE ESTÁ VAZIO...
if(document.getElementById("id_arq_documento_" + x).files.length == 0){
alert("Erro (" + x +"): Você deve selecionar um arquivo para envio");
} else if(document.getElementById("local_armazenado_" + x ).value == 0){
alert("Erro (" + x +"): Você deve informar o local de armazenamento");
} else if( confirm('Deseja Realmente arquivar o documento? Esta ação não pode ser desfeita.')) {
//SE O INPUT FILE NÃO ESTIVER VAZIO, EXECUTA A FUNÇÃO
var formdata = new FormData();
formdata.append("arqUP", file);
formdata.append("autorz", autorizacao);
var ajax = new XMLHttpRequest();
ajax.upload.addEventListener("progress", progressHandler, false);
ajax.addEventListener("load", completeHandler, false);
ajax.addEventListener("error", errorHandler, false);
ajax.addEventListener("abort", abortHandler, false);
ajax.open("POST", "https://www.meusite.com.br/upload/upload.php?");
ajax.send(formdata);
//POR SEGURANÇA, QUANDO A FUNÇÃO FOR ACIONADA, IRà DESABILITAR O CAMPO processar E CHECKBOX
document.getElementById("botao_processar_"+ x ).disabled = 'true';
document.getElementById("progressBar_"+ x).style.display = 'block';
document.getElementById("botao_processar_"+ x).style.display = 'none';
function progressHandler(event){
var percent = (event.loaded / event.total) * 100;
document.getElementById("progressBar_"+ x).value = Math.round(percent);
document.getElementById("status_"+ x).innerHTML = "Processando: " +Math.round(percent)+"%";
}
function completeHandler(event){
document.getElementById("status_" + x).innerHTML = event.target.responseText;
document.getElementById("progressBar_" + x).value = 0;
document.getElementById("progressBar_" + x).remove();
document.getElementById("botao_processar_" + x).remove();
document.getElementById("id_arq_documento_" + x).disabled = 'true';
document.getElementById("local_armazenado_" + x).disabled = 'true';
document.getElementById("status_arquivo_" + x).innerHTML= '';
alert('Up ok' + x);
}
function errorHandler(event){
document.getElementById("status_" + x).innerHTML = "Falha ao enviar";
}
function abortHandler(event){
document.getElementById("status_" + x).innerHTML = "Envio abortado";
}
}
}
When I call the function inside my server, it runs normally:
ajax.open("POST", "upload.php");
But when I try to send the POST to an external URL:
ajax.open("POST", "https://www.meusite.com.br/upload/upload.php?");
It returns me the error:
Failed to send
And in my console Inpecionar Elemento appears:
Response to preflight request doesn’t pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested Resource. Origin 'http://10.4.0.218' is therefore not allowed access.
I’ve checked everything. Write permissions on remote server, everything.
What could it be? Do you have any idea?
And this external file would be exactly the same PHP code that you run locally?
– Woss
In fact it is an API to which I have to report the following variables: $arqUP which is the file for UPLOAD and autorz which is the upload authorization:
– WebCraft
And this API allows external requests?
– Woss
Yes. I opened my Inspect Element console and the following error appeared: Response to preflight request doesn’t pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested Resource. Origin 'http://10.4.0.218' is therefore not allowed access.
– WebCraft
The place where you will call the upload file will be in another same domain?
– Diego Schmidt
Yes Yes. Already insert header('Access-Control-Allow-Origin: https://www.merusite.com.br'); and nothing!
– WebCraft
Added header("Access-Control-Allow-Origin: *") in the upload.php file?
– Diego Schmidt
Yes. Added, but still persists!
– WebCraft
@netoweb You need to add to
header
the value of the address that will make the request. Given the error message, I’d say the IP you’re requesting from is 10.4.0.218, so that’s the value you need to add toheader
. For example:header("Access-Control-Allow-Origin: 10.4.0.218")
– Woss
@Andersoncarloswoss - In case that line would go in my own application or API?
– WebCraft
In the API you will receive the request
– Woss
I know this is a trick. I did it by testing. I added this extension to Chrome and it worked perfectly. https://goo.gl/hEoirz
– WebCraft