场景：点击充值，返回支付url ，内容是form格式的。直接使用window.open(),会被浏览器拦截。主要针对vue，其他框架思路应该一样。

方法一：用 路由resolve,v-html方法

recharge(this.ruleForm).then(response => {
	if(response.data.status != 200){
		return this.tipWarning(response.data.msg)
	}
	this.payUrl = response.data.data.url;
	let routerData = this.$router.resolve({path:'/applay',query:{htmls:this.payUrl}});
		window.open(routerData.href,'_blank');
	}).catch((error) => {
		console.log(error);
	});

然后，新建applay页面，路由配置好。

<template>
	<div v-html="apply">
        {{apply}}
    </div>
</template>

<script>
export default {
    name:"applyText",
    data(){
        return {
            apply:''
         }
    },
   	mounted(){
         this.apply = this.$route.query.htmls;
       	 this.$nextTick(()=> {
               document.forms [0].submit()
       	 })
    }
}
</script>

<style>
</style>

可以实现打开新窗口支付，但是兼容不好。UC、360等都会拦截，因此，找到了方法二

方法二：建立中间页，使用document.write，说白了就是重定向

this.$refs[formName].validate((valid) => {
	if(valid){
	window.open('域名/#/applay?count='+ this.ruleForm.inputNum ,'about:blank');
	}else{
	console.log('error submit!!');
	 }
 });

把金额当参数传过去。

然后，打开相同域名下的url不会被拦截，然后在请求支付，使用document.write覆盖原始页面。

<template>
    <div class="pay" v-loading="loading">
    </div>
</template>

<script>
import {recharge} from '@/api/cost'
	
export default {
    data(){
        return {
            apply:'',
 			loading: true
         }
    },
	created(){
		let obj = {
			inputNum:this.$route.query.count,
			returnUrl:''
		}
	    recharge(obj).then(response => {
    		if(response.data.status != 200){
    			return this.tipWarning(response.data.msg)
    		}
    		this.loading = false;
    		this.payUrl = response.data.data.url;
            document.write(this.payUrl)
		}).catch((error) => {
		    console.log(error);
		    this.loading = false;
		});
	},
   	mounted(){

    },
    methods:{
    },
}
</script>

<style scoped>
.pay{
	width: 100%;
	height: 100%;
}
</style>

亲测，完美解决新窗口被拦截。