js 代码content-type:multipart/form-data 图片上传

在 中使用 `multipart/form-data` 类型上传图片，一种常见的是使用 `FormData` 对象来构建请求。以下是一个示例代码：

// 创建一个 FormData 对象
var formData = new FormData();

// 获取文件输入框中选择的图片文件
var fileInput = document.getElementById('fileInput');
var file = fileInput.files[0];

// 将图片文件添加到 FormData 对象中
formData.append('image', file);

// 创建 XMLHttpRequest 对象
var xhr = new XMLHttpRequest();

// 监听上传进度事件
xhr.upload.addEventListener('progress', function(event) {
    if (event.lengthComputable) {
        var percentComplete = (event.loaded / event.total) * 100;
        console.log('上传进度：' + percentComplete + '%');
    }
});

// 监听请求完成事件
xhr.addEventListener('load', function(event) {
    if (xhr.status === 200) {
        console.log('上传成功');
    } else {
        console.log('上传失败');
    }
});

// 发送 POST 请求
xhr.open('POST', 'http://example.com/upload', true);
xhr.setRequestHeader('Content-Type', 'multipart/form-data');
xhr.send(formData);

在上述代码中，我们首先创建一个 `FormData` 对象，然后从文件输入框中获取用户选择的图片文件，并将其添加到 `FormData` 对象中。接下来，我们创建一个 `XMLHttpRequest` 对象，并监听上传进度和请求完成事件。最后，我们使用 `open()` 方法设置请求的方法、URL 和异步标志，设置 `Content-Type` 请求头为 `multipart/form-data`，并发送 `FormData` 对象作为请求的数据体。

请注意，这只是一个基本示例，实际项目中可能需要进行更多的错误处理和验证。另外，跨域请求时可能需要处理 CORS（跨源资源共享）相关的设置。