Como detectar o erro de origem cruzada (CORS) versus outros tipos de erros para XMLHttpRequest () em JavaScript
Eu estou tentando detectar quando um XMLHttpRequest () falhar devido a um erro de origem cruzada em oposição a uma solicitação incorreta. Por exemplo:
ajaxObj=new XMLHttpRequest()
ajaxObj.open("GET", url, true);
ajaxObj.send(null);
Considere 4 casos para url:
Caso 1: url é um endereço válido em que o controle de acesso-permitir origem é definido corretamente
Exemplo:http://192.168.8.35 onde eu tenho um servidor comAccess-Control-Allow-Origin: * definido no cabeçalhoIsso é fácil de detectar como ajaxObj.readyState == 4 e ajaxObj.status == 200Caso 2: url é um endereço inválido em um servidor existente
Exemplo:http://xyz.google.com onde o servidor responde, mas não é um pedido válidoIsso resulta em ajaxObj.readyState == 4 e ajaxObj.status == 0Caso 3: url é para um endereço IP do servidor não existente
Exemplo:http://192.168.8.6 na minha rede local, onde não há nada para responderIsso resulta em ajaxObj.readyState == 4 e ajaxObj.status == 0Caso 4: url é um endereço válido em que o controle de acesso-permitir origem éNÃO conjunto
Exemplo:http://192.168.8.247 onde eu tenho um servidorsem Access-Control-Allow-Origin: * definido no cabeçalhoIsso resulta em ajaxObj.readyState == 4 e ajaxObj.status == 0O problema é:Como faço para diferenciar o caso 4 (erro de controle de acesso-permissão de origem) e os casos 2 e 3?
No caso 4, o console de depuração do Chrome mostra o erro:
XMLHttpRequest cannot load http://192.168.8.247/. Origin http://localhost is not allowed by Access-Control-Allow-Origin.
Como faço para que esse erro seja conhecido em Javascript?
Eu tentei encontrar alguma indicação emajaxObj mas nada parece ser diferente em comparação com os casos 2 e 3.
Aqui está um teste simples que eu usei:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CORS Test</title>
<script type="text/javascript">
function PgBoot()
{
// doCORS("http://192.168.8.35"); // Case 1
// doCORS("http://xyz.google.com"); // Case 2
doCORS("http://192.168.8.6"); // Case 3
// doCORS("http://192.168.8.247"); // Case 4
}
function doCORS(url)
{
document.getElementById("statusDiv").innerHTML+="Processing url="+url+"<br>";
var ajaxObj=new XMLHttpRequest();
ajaxObj.overrideMimeType('text/xml');
ajaxObj.onreadystatechange = function()
{
var stat=document.getElementById("statusDiv");
stat.innerHTML+="readyState="+ajaxObj.readyState;
if(ajaxObj.readyState==4)
stat.innerHTML+=", status="+ajaxObj.status;
stat.innerHTML+="<br>";
}
ajaxObj.open("GET", url, true);
ajaxObj.send(null);
}
</script>
</head>
<body onload="PgBoot()">
<div id="statusDiv"></div>
</body>
</html>
Resultados usando o Chrome:
Processing url=http://192.168.8.35
readyState=1
readyState=2
readyState=3
readyState=4, status=200
Processing url=http://xyz.google.com
readyState=1
readyState=4, status=0
Processing url=http://192.168.8.6
readyState=1
readyState=4, status=0
Processing url=http://192.168.8.247
readyState=1
readyState=4, status=0