vue window.open无法打开新窗口

今天遇到vue window.open无法打开外部地址,我的场景是HTTPS打开HTTP外部地址。
在网上看了很多文档,使用以下三种方法发现都不可以。

1、通过a标签加onclick跳转

 newLink(url) {
     let a = document.createElement(‘a‘);
     a.setAttribute(‘href‘, url);
     a.setAttribute(‘target‘, ‘_blank‘);
  }

2、使用form的submit方法打开一个页面

这种方法需要构造一个from,然后由js代码触发form的submit,将表单提交到一个新的页面,

如果需要传递参数时,需要使用 POST 方法, 默认的 GET 方法无法传递参数。也就是新页面的url中没有参数部分。如:

newLink(url){
    let form = document.createElement(‘form‘);
    form.action = ‘www.baidu.com?id=1‘;
    form.target = ‘_blank‘;
    form.method = ‘POST‘;
    document.body.appendChild(form);
    form.submit();
}
3、终极解决方案–先弹出窗口,然后重定向

第三种方案,其实是一种变通方案,核心思想是:先通过用户点击打开页面,然后再对页面进行重定向。示例代码如下:

newLink(url){
     // 打开页面,此处最好使用提示页面
    let newLink = window.open(‘loading page‘);
    axios.get(url)
        .then(function (response) {
        newLink.location.href = url;;
    })
        .catch(function (error) {
        console.log(error);
    })
}
最终结局方案

1、let reg=new RegExp(‘http://‘,‘g‘)
let newMsg=JSON.stringify(url).replace(reg,‘https://‘);
window.open(res.data.url)

2、HTTP更改为HTTPS地址也可以解决,但是请求时间过长会出现拦截警告,运行即可。

vue window.open无法打开新窗口

 

 

 

vue window.open无法打开新窗口

上一篇:WPF性能优化


下一篇:C#委托与事件实用场景