## 关于使用Form表单提交POST请求被拦截问题
+ 本意上，form表单打开新窗口提交post请求不会被浏览器拦截，而且是很好的解决方式，但是，Form表单的Actios由于是请求的地址，如果出现： 先请求某个接口，拿到url，然后在创建form表单请求，就一定被拦截， 除非该url是本地的，不是请求获取的。
#### 1 form表单新建页面提交POST请求的一般方式（请求的url不是通过接口获取的，而是本地的）
+ 不需要任何操作，直接创建一个form表单元素，在form表单元素中创建input，input的value就是提交的数据，代码如下
```
openPostWindow(url, data, name='_blank') {
var tempForm = document.createElement("form");
tempForm.id = "tempForm1";
tempForm.method = "post";
tempForm.action = url;
tempForm.target = name; // _blank - URL加载到一个新的窗口
for(let key in data){
var hideInput = document.createElement("input");
hideInput.type = "hidden";
hideInput.name = key;
hideInput.value = data[key];
tempForm.appendChild(hideInput);
}
// 可以传多个参数
if(document.all){ // 兼容不同浏览器
tempForm.attachEvent("onsubmit",function(){}); //IE
}else{
tempForm.addEventListener("submit",function(){},false); //firefox
}
document.body.appendChild(tempForm);
if(document.all){ // 兼容不同浏览器
tempForm.fireEvent("onsubmit");
}else{
tempForm.dispatchEvent(new Event("submit"));
}
tempForm.submit();
document.body.removeChild(tempForm);
},
```
+ 直接传入请求的url和data对象
#### 2 先请求接口拿到form表单提交的url（第1种方式会被拦截）
+ 如果是在请求接口获取url后再执行Form表单，会被拦截
+ 处理方法
+ 1 先打开一个空白页面： window.open()
+ 2 请求接口获取url
+ 3 调用创建Form表单的方法，执行请求
+ 备注：如果请求失败，记得close()关闭弹窗
+ 代码如下
```
// 在dada中定义一个变量存储新打开的窗口
newWin: ' '
```
```
// 在调用请求url的方法开始之前,创建新的窗口
this.newWin = window.open()
// 请求接口获取url和data
function 请求接口函数(){
// 请求的接口代码
const {url, data} = xxxx
this.openPostWindow(url,data)
}
```
```
// 新建form表单的函数
openPostWindow(url, params) {
//设置样式为隐藏，打开新标签再跳转页面前，如果有可现实的表单选项，用户会看到表单内容数据
let formStr = "";
let inputs = "";
for (let key in params) {
inputs += `<input type="hidden" name="${key}" value="${params[key]}" />`;
}
formStr = `<form style="visibility:hidden;" method="POST" action="${url}">${inputs}</form>`; this.newWin.document.body.innerHTML = formStr;
let form = this.newWin.document.forms[0];
if(document.all){ // 兼容不同浏览器
tempForm.attachEvent("onsubmit",function(){}); //IE
}else{
tempForm.addEventListener("submit",function(){},false); //firefox
}
if(document.all){ // 兼容不同浏览器
tempForm.fireEvent("onsubmit");
}else{
tempForm.dispatchEvent(new Event("submit"));
}
tempForm.submit();
},
return this.newWin;},
```
```
// 如果请求失败，切记关闭当前新建的弹窗
tihs.newWin.close()
```
