H5get请求重定向后页面没有跳转重定向的地址是什么问题;H5get请求重定向后页面不跳转自定义重定向跳转; XMLHttpRequest.DONE是什么状态
重定向的个图接口,直接访问就行,window.location.href =
${location.protocol}//${process.env.TARO_APP_API_HOST}/cgate/auth/token/v5/get?token=${userInfo?.token}&jumpUrl=${url};
类似于相当于在浏览器输入搜索
Ajax 请求的处理:如果使用了 XMLHttpRequest 或 Fetch API 进行 GET 请求,并通过异步处理来获取响应数据,那么浏览器不会自动跳转到重定向的地址。
如果在 H5 的 GET 请求中,服务器返回了重定向响应(HTTP 状态码为 3xx),但页面没有跳转到重定向的地址,可能有几种可能的原因:
-
JavaScript 阻止了页面跳转:可能在页面中的 JavaScript 代码中有针对该 GET 请求的处理逻辑,例如通过阻止默认事件或修改页面行为的方式来阻止页面跳转。你可以检查页面中的 JavaScript 代码,查看是否有处理该请求的逻辑。
-
Ajax 请求的处理:如果使用了 XMLHttpRequest 或 Fetch API 进行 GET 请求,并通过异步处理来获取响应数据,那么浏览器不会自动跳转到重定向的地址。在处理响应数据的回调函数中,你需要手动检查响应状态码以及处理重定向。确保在请求成功的回调中处理重定向的逻辑。
-
缓存问题:在某些情况下,浏览器可能会缓存重定向响应,导致页面没有立即跳转到重定向的地址。你可以尝试在 GET 请求中添加一些类似于时间戳的随机参数,以确保每次请求都是唯一的,避免缓存的影响。例如:
var randomParam = Date.now(); var url = "原始地址" + "?_=" + randomParam; xhr.open("GET", url, true); xhr.send();
通过添加
?_=<随机参数>
,可以确保每次请求都是唯一的,从而避免缓存问题。
请检查以上可能的原因,并相应地进行调整和处理。如果问题仍然存在,提供更多关于你的代码和环境的详细信息,我将尽力提供更准确的帮助。
H5get请求重定向后页面不跳转自定义重定向跳转
在 H5 的 GET 请求中,如果服务器返回了重定向响应(HTTP 状态码为 3xx),浏览器会自动跟随重定向并加载新的地址。然而,有时候你可能希望在重定向后不立即跳转到新的地址,而是在 JavaScript 中获取重定向的地址进行处理。
要实现这个需求,你可以使用 JavaScript 中的 XMLHttpRequest(XHR)对象来发送 GET 请求,并手动处理重定向。以下是一个示例代码:
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState === XMLHttpRequest.DONE) {
if (xhr.status >= 200 && xhr.status < 300) {
// 请求成功完成,可以获取响应数据
var redirectedUrl = xhr.responseURL;
// 在这里处理重定向后的地址
console.log(redirectedUrl);
} else {
// 请求失败或出错,可以处理错误情况
console.error("请求失败:" + xhr.status);
}
}
};
xhr.open("GET", "原始地址", true);
xhr.send();
在上述代码中,我们创建了一个 XMLHttpRequest 对象,并指定了 onreadystatechange
事件处理函数。当请求状态发生变化时,该函数会被调用。在事件处理函数中,我们首先检查请求的状态是否为 XMLHttpRequest.DONE
,表示请求已完成。然后,我们进一步检查响应的状态码是否为成功的范围(2xx),以确定请求是否成功。
如果请求成功完成,我们可以通过 xhr.responseURL
属性获取重定向后的地址。你可以根据需要在这里处理重定向后的地址,例如保存地址、进行进一步操作等。
请注意,由于浏览器的安全限制,XHR 对象只能访问与原始域相同的域的地址。如果重定向的地址与原始域不同,浏览器会阻止访问,并返回一个空字符串作为 xhr.responseURL
。这是出于安全考虑,以防止跨域攻击。
希望这个示例能满足你的需求。如果你有更多问题,请随时提问。
示例代码:
/** 重定向接口,不会自动跳转 */
// const getLoginUrl = await getScanLoginUrl({ token: res.info.token });
/** 原生方法自定义处理重定向的跳转 */
const xhr = new XMLHttpRequest();
let url = `${location.origin}/cgate/activity/subscriber/v1/shunt`;
/** xhr中添加请求头,get的url上添加params参数 */
let { commonParams } = useBaseStore();
commonParams = { ...commonParams, userId: res.info.id || '', token: res.info.token };
url += getQueryStr(commonParams);
console.log('url', url);
xhr.open('GET', url, true);
xhr.setRequestHeader('Authorization', `${res.info.token}`);
xhr.onreadystatechange = async function () {
console.log('xhr', xhr);
if (xhr.readyState === XMLHttpRequest.DONE) {
if (xhr.status >= 200 && xhr.status < 300) {
// 请求成功完成,可以获取响应数据
const redirectedUrl = xhr.responseURL;
// 在这里处理重定向后的地址
console.log('处理重定向后的地址', redirectedUrl);
await myTimeout(100);
location.href = redirectedUrl;
// location.replace(redirectedUrl);
} else {
showToast({ title: `跳转请求失败:状态码${xhr.status}`, icon: 'none' });
// 请求失败或出错,可以处理错误情况
console.error(`请求失败:${xhr.status}`);
}
}
};
xhr.send();
XMLHttpRequest.DONE是什么状态
XMLHttpRequest 对象的 readyState
属性表示当前请求的状态。其中,XMLHttpRequest.DONE
是 readyState
的一个可能取值,表示请求已完成。
XMLHttpRequest.DONE
的值为 4。它是 readyState
属性的最终状态,表示请求已经完成并且响应已经就绪。在这个状态下,可以通过检查 XMLHttpRequest
对象的 status
属性来获取响应的 HTTP 状态码,并通过 responseText
或 responseXML
属性来获取响应的内容。
以下是 readyState
的可能取值:
XMLHttpRequest.UNSENT
(0): XMLHttpRequest 对象已创建,但尚未调用open
方法。XMLHttpRequest.OPENED
(1):open
方法已经被调用,但尚未调用send
方法。XMLHttpRequest.HEADERS_RECEIVED
(2):send
方法已经被调用,且所有响应头都已经接收到。XMLHttpRequest.LOADING
(3): 响应内容正在被接收。XMLHttpRequest.DONE
(4): 响应已完成,且响应数据可用。
在监听 onreadystatechange
事件时,通常会检查 readyState
的值是否为 XMLHttpRequest.DONE
,以确保请求已经完成并且可以处理响应数据。
xhr.onreadystatechange = function() {
if (xhr.readyState === XMLHttpRequest.DONE) {
// 请求已完成
if (xhr.status === 200) {
// 请求成功,处理响应
console.log(xhr.responseText);
} else {
// 请求失败,处理错误
console.error('请求失败:' + xhr.status);
}
}
};
以上示例展示了如何在 readyState
为 XMLHttpRequest.DONE
时处理请求的结果。如果 status
为 200,则表示请求成功,并可以通过 responseText
属性访问响应的文本内容。
希望这解释清楚了 XMLHttpRequest.DONE
状态的含义。如果还有其他疑问,请随时提问。
当使用
XMLHttpRequest 发送请求时,如果遇到重定向,该对象会自动跟随重定向并返回最终的响应结果。你只能获取最终的状态码和响应数据,无法直接获取重定向前的状态码。