FormData解决ajax上传文件的问题及ajax跨域

2019独角兽企业重金招聘Python工程师标准>>>

通过FormData对象可以组装一组用 XMLHttpRequest发送请求的键/值对。它可以更灵活方便的发送表单数据，因为可以独立于表单使用。如果你把表单的编码类型设置为multipart/form-data ，则通过FormData传输的数据格式和表单通过submit() 方法传输的数据格式相同

Html代码部分

<div id="uploadForm">
    <input id="file" type="file" name="musicname"/>
    <button id="upload" type="button">upload</button>
</div>

javaScript

	var formData = new FormData();  
	formData.append('file',document.getElementById("fileupload").files[0]);  
	formData.append('test','test23333');
	$.ajax({
		url: "http://192.168.199.100:8080/api/file/upload",
		type: "POST",
		data: formData,
		contentType: false,
		processData: false,
		dataType: "json",
		success: function(result){
			if (result){

			}
		}
	});

在服务器端（提供接口）设置

response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "POST,GET");

这样就可以简单解决跨域问题

转载于:https://my.oschina.net/watsonos/blog/1632361