JSONP跨域劫持？教你如何拦截window.location.href跳转！

本文探讨了JSONP跨域请求中，接口返回`window.location.href`导致页面意外跳转的问题。由于JSONP机制限制无法直接访问完整响应文本，常规方法难以拦截跳转。文章提出了一种利用iframe拦截跳转的解决方案：通过在iframe内重定义`window.location.href`的setter方法来阻止跳转，并在iframe加载完成后获取实际URL，判断是否发生跳转，从而安全地获取跨域数据并执行回调函数。 文中也强调了使用`eval()`的风险，建议采用更安全的替代方案。

避免JSONP请求导致页面跳转

使用JSONP进行跨域数据获取时，有时会遇到接口返回window.location.href = ...导致页面意外跳转的问题。本文提供一种解决方案，有效防止此类情况发生。

挑战：无法直接访问响应文本

JSONP的机制决定了我们无法直接访问完整的响应文本，因此无法预先判断响应中是否包含跳转指令。

解决方案：利用iframe拦截跳转

我们可以通过iframe来加载JSONP接口。iframe的跳转不会影响父页面，因此我们可以利用这一点来拦截跳转。

iframe内跳转拦截代码

在iframe中，使用以下代码拦截window.location.href的设置：

Object.defineProperty(window.location, 'href', {
  set: function(value) {},
  get: function() { return this._href; },
});

监听iframe加载事件并获取URL

iframe加载完成后，监听load事件，获取iframe内的window.location.href：

iframe.addEventListener('load', function() {
  const iframeLocation = iframe.contentWindow.location.href;
  // 处理 iframeLocation，判断是否发生跳转
});

解析iframe内容并执行回调

获取iframeLocation后，解析其内容，判断是否存在跳转。如果未发生跳转，则安全地执行接口返回的JS代码（例如使用eval()，但需谨慎）。

通过这种方法，我们可以有效拦截JSONP接口返回的跳转指令，确保页面不会意外跳转，从而安全地获取跨域数据。 请注意，使用eval()存在安全风险，建议在实际应用中采用更安全的替代方案，例如使用更严格的输入验证和数据清洗。

到这里，我们也就讲完了《JSONP跨域劫持？教你如何拦截window.location.href跳转！》的内容了。个人认为，基础知识的学习和巩固，是为了更好的将其运用到项目中，欢迎关注golang学习网公众号，带你了解更多关于的知识点！