Sin ajax, si cargamos http://example.com/1 y si se redirige a http://example.com/2 , el navegador obtiene los encabezados apropiados y la URL del navegador se actualiza. ¿Hay alguna forma de obtener esta información a través de jQuery Ajax?
Por ejemplo, estoy solicitando http://api.example.com a través de Ajax. En PHP, esta página se redirige a http://api2.example.com . ¿Es posible saber esto?
Uso: Tengo una barra de navegación que tiene enlaces. Todas las páginas se cargan en el contenedor a través de AJAX y presiono la URL en la barra del navegador usando el historial de HTML5 según el enlace.
Sin embargo, si la página se redirige, la página tendría un nuevo enlace, ¿verdad? También me gustaría cambiar eso en la barra del navegador. Me gustaría saber dónde se redirige la URL de Ajax en caso de que se redirija.
¿Por qué esto es importante? Mis enlaces manejan datos de formularios, solicitudes y varias autenticaciones. Por ejemplo, si solicito https://oauth.example.org?code=56hycf86 , se redirige a la página de success o failure . Mi Ajax obtiene el contenido html correcto, pero la barra del navegador de URL todavía tiene la URL con la misma Auth ID de autenticación que, si se vuelve a cargar, produce un error. También hay otros problemas de seguridad.
No sé si me expliqué bien, pero gracias por tu ayuda.
Bueno, desafortunadamente, ajax siempre sigue las redirecciones. Sin embargo, hay una característica que no es compatible con todos los navegadores, puede acceder a la propiedad responseURL del objeto XMLHttpRequest.
Puede probarlo en el siguiente fragmento de código. el botón de redireccionamiento envía una solicitud ajax a una URL que responde con 1 redireccionamiento (también funciona si hay varios redireccionamientos). El botón sin redireccionamiento envía una solicitud ajax a una URL sin redireccionamientos.
Por lo que sé, este método no es compatible con IE 11 y versiones anteriores de los navegadores Chrome/Firefox/Opera.
document.getElementById("no-redirect").addEventListener("click", function() { testRedirect("https://httpbin.org/get"); }); document.getElementById("redirect").addEventListener("click", function() { testRedirect("https://httpbin.org/redirect/1"); }); function testRedirect(url) { var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function(e) { if (xhr.status == 200 && xhr.readyState == 4) { if (url != xhr.responseURL) { alert("redirect detected to: " + xhr.responseURL) } else { alert("no redirect detected") } } } xhr.open("GET", url, true); xhr.send(); } <button id="redirect"> Redirect </button> <button id="no-redirect"> No Redirect </button>Puede que esto no sea exactamente lo que estás buscando, pero tal vez te ayude a obtener un efecto similar.
Si tiene el control de lo que hace la página http://api.example.com , puede cambiar la forma en que reacciona cuando recibe una llamada a través de AJAX.
Podría incluir una variable en su llamada AJAX, marcándola como tal llamada, y si esta variable está presente, no redirija a otra página, pero incluya la URL a la que redirigiría en la respuesta.
Los datos devueltos en la llamada AJAx podrían ser un hash, en el que una clave representa la URL de redirección.
data = {status => 1, redirect => 'http://ap2.example.com', …}(Lo siento si ese no es un hash de PHP válido)
No estoy seguro si lo entendí, pero acabo de intentar algo, si no es lo que está buscando, avíseme para eliminar la respuesta.
aquí inyectamos este /#/ en la URL para que al hacer clic en los enlaces, el navegador tenga un nuevo segmento en la URL que representa el parámetro que, dependiendo de su valor, puede determinar qué página cargar usando la llamada AJAX correspondiente.
JS/jQuery:
var navLinks = $('#nav a'), params = [], baseURL = '//localhost/test/js-url-parameters-second'; navLinks.each(function(){ var oldHREF = $(this).attr('href'); $(this).attr('href', baseURL +'/#/'+ oldHREF); }); navLinks.on('click', function(){ checkURL($(this).attr('href')); }); function checkURL(docURL){ // if /#/ found then we have URL parameters // grabbing the parameters part of the URL if(docURL.indexOf('/#/') > -1){ docURL = docURL.split('/#/')[1]; if(docURL != ''){ // omit the last forward slash if exists if(docURL[docURL.length - 1] == '/'){ docURL = docURL.substring(0, docURL.length - 1); } console.log(docURL); $('#page-type').text(docURL); } } else { console.log('No URL parameters found'); } }HTML:
<div id="nav"> <a href="home" data-name="Home">Home</a> <a href="about" data-name="About">About</a> <a href="contact" data-name="Contact">Contact</a> </div> <hr> <div id="container"> this is the <span id="page-type">Home</span> page </div>