解决浏览器拦截跳转新窗口-可以用额,回调函数处理方法

在这里插入图片描述

开头一张图表明来意,我就是来集赞的,你的一个赞很重要。希望能帮到广大前端同僚,解决了记得点赞加关注。
开头拉!!
只要是异步变同步都会导致浏览器拦截跳转新窗口,最后只能使用大招了
请求后拿到数据,再回调处理,终于没有拦截了哈哈哈哈哈哈哈,下图是在火狐试过是🐱 问题的,回调都可以猫问题拉。大家节奏带起来,hihihi
在这里插入图片描述
附上代码大法:
封装了请求方法,大家方兴用,嗨起来,带节奏

// 浏览器拦截跳转新窗口
/**
 * @author jie 
 * @date 2020.11.4
 * @param { url }  url地址  /lj/school/xxxx
 * @param { methods }  请求的方法
 * @param { header }  添加更多请求的头
 * @param { data }  需要带的参数
 * @param { callBack }  回调
 * @return VOID
 */
function handleJumpInterceptor(url,methods, data,callBack,header,ext) {
  url = `${window.location.origin}/` + url 
  // 兼容ie浏览器  使用原生http请求 同步获取跳转链接
  let xhr = null;
  if (window.XMLHttpRequest) {
    xhr = new XMLHttpRequest();
  } else {
    xhr = new ActiveXObject('Microsoft.XMLHTTP')
  }
  xhr.open(methods, url, false);
  // setRequestHeader必须在open后
  if (methods.toLowerCase() == 'post') {
    xhr.setRequestHeader("Content-Type", "application/json;charset=utf-8");
  }

  // 添加更多的请求头
  if (header) {
    for (const key in header) {
      xhr.setRequestHeader(key, header[key]);
    }
  }
  // 携带请求参数
  xhr.send(data);
  if (xhr.status === 200) {
    xhr.responseText && callBack(xhr.responseText)
  }
}

好啦,到了关键的一波的,用法:

let params = {
   appType: 3,
   userId: localStorage.getItem('userData') && JSON.parse(localStorage.getItem('userData')).uid || ''
  }
  // 直播列表获取观看新直播的权限
  const url = window.location.href;
  // 接口拼接
  let InterfaceUrl = 'openCourse/third/getTempCode'
  params = JSON.stringify(params)
  handleJumpInterceptor(InterfaceUrl, 'post', params,
    function(res){
      res = JSON.parse(res);
      if(res) {
        _this.appointmentReminder(item)
        let jumpUrl = `${item.liveUrl}&tempCode=${res.result}`
        window.open(jumpUrl)
      }
    },
  )
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值