js ajax 传递文件

// HTML部分
<input type="file" id="fileInput" />

// JavaScript部分
document.getElementById('fileInput').addEventListener('change', function(event) {
    const file = event.target.files[0];
    const formData = new FormData();
    formData.append('file', file);

    fetch('/upload', {
        method: 'POST',
        body: formData
    })
    .then(response => response.json())
    .then(data => {
        console.log('Success:', data);
    })
    .catch((error) => {
        console.error('Error:', error);
    });
});

// 服务器端示例（Node.js + Express）
const express = require('express');
const app = express();
const multer = require('multer');

const upload = multer({ dest: 'uploads/' });

app.post('/upload', upload.single('file'), (req, res) => {
    res.json({ message: 'File uploaded successfully' });
});

app.listen(3000, () => {
    console.log('Server started on port 3000');
});

// 分片上传示例
function uploadChunk(chunk, chunkIndex, totalChunks) {
    const formData = new FormData();
    formData.append('file', chunk);
    formData.append('chunkIndex', chunkIndex);
    formData.append('totalChunks', totalChunks);

    return fetch('/uploadChunk', {
        method: 'POST',
        body: formData
    });
}

function uploadFile(file) {
    const chunkSize = 1024 * 1024; // 1MB
    const totalChunks = Math.ceil(file.size / chunkSize);

    for (let i = 0; i < totalChunks; i++) {
        const start = i * chunkSize;
        const end = Math.min(file.size, start + chunkSize);
        const chunk = file.slice(start, end);

        uploadChunk(chunk, i, totalChunks)
            .then(() => {
                if (i === totalChunks - 1) {
                    console.log('File uploaded successfully');
                }
            })
            .catch(error => {
                console.error('Error uploading chunk:', error);
            });
    }
}