java后台解决跨域访问，为什么前端还不能访问上传文件

 function upload() {
    var form1 = document.createElement("form");
    form1.setAttribute("id","form1");
    document.body.appendChild(form1)
    var inputObj=document.createElement('input')
    inputObj.setAttribute('id','file');
    inputObj.setAttribute('type','file');
    inputObj.setAttribute('name','file');
    inputObj.setAttribute("style",'visibility:hidden');
    inputObj.click()
    form1.appendChild(inputObj)
    inputObj.onchange = function () {
        form1.method ="POST";
        form1.enctype = "multipart/form-data";
        $("#form1").submit(function () {
             var formData = new FormData();
             formData.append("file",$("#file")[0]);
            $.ajax({
                url:"http://localhost:8080/file/upload.action",
                type:"POST",
                contentType:"multipart/form-data",
                data:formData,
                cache:false,
                processData:false,
                success:function (data) {
                    console.log(data)
                }
            })
        })

    }
}

如上代码，html为了美观只用了一个button，button点击后调用这个函数，然后用js创建form表单和input，这里问题来了：如果单单表单提交，没有问题，但是会跳转页面；如果单单用ajax，出现跨域（服务器端已经添加了header还是会有跨域问题），
再就是使用如上的代码，form表单中使用ajax请求，没有出现任何问题并且文件没有上传，好像是 $("#form1").submit(function () )没有调用，小白求解。

$("#form1").submit(function () ) 你把这个去掉试试
这一步貌似多余

需要后端设置相关参数;
具体可以参考下cros 跨域;
spring boot 项目中:
@Configuration
public class CorsConfig extends WebMvcConfigurerAdapter{

@Value("${allowed.origins}")
private String allowedArigins;

public void addCorsMappings(CorsRegistry registry) {
    registry.addMapping("/file/**").allowedOrigins(allowedArigins.split(","))
            .allowedMethods("GET", "HEAD", "POST","PUT", "DELETE", "OPTIONS")
            .allowCredentials(false).maxAge(3600);
}

}

这个html文件ajax调用代码要放在服务器http://localhost:8080/的目录下运行。浏览器的地址栏路径类似:http://localhost这样开头的。

你这formData传的什么东西，，，，，