使用JavaScript模擬文件上傳表格

Question

我在客戶端動態生成svg標記並將其轉換爲數據url以供下載。此過程正常工作並生成有效的svg文件。

此外，我有一個Java Servlet，它需要上傳的svg文件並將其轉換爲pdf。當我從上面獲取一個下載的svg文件並通過一個標準的HTML表單上傳時，這個Servlet工作得非常好。

我只是想通過發送生成的svg而不保存之前將這兩部分結合起來。我已經嘗試將數據以base64字符串的形式發送，例如：

reader.readAsDataURL(blob); 
reader.onloadend = function() { 
    base64data = reader.result;     
    console.log(base64data); 
    form['data'].value = base64data; 
    form.submit(); 
    } 

但是這似乎不起作用。有沒有使用JavaScript模擬文件上傳的方法？

Answer 1

你應該使用FORMDATA對象：

$('form').submit(function(){ 
 
    
 
    /**** creating blob object 
 
    ..... 
 
    ****/ 
 
    var reader = new FileReader(); 
 
    reader.readAsDataURL(blob); 
 
    reader.onloadend = function() { 
 
    base64data = reader.result; 
 
    
 
    var fd = new FormData(this); 
 
    fd.append('file', base64data, 'file_data'); // field_data - "Optional" param, it means The filename reported to the server 
 
    fd.append('other_field', fieldvalue); 
 
    $.ajax({ 
 
     type: 'POST', 
 
     url: '/upload.php', 
 
     data: fd, 
 
     processData: false, 
 
     contentType: false 
 
    }).done(function(data) { 
 
     console.log(data); 
 
    }); 
 
    } 
 
});