節點保存filereader base64 svg上傳與fs

Question

我嘗試保存從客戶端上傳的圖像，我的代碼與png和jpg很好地協同工作，但與svg無關。什麼是最好的方法？

客戶端：<input type="file> =>fileReader.readAsDataURL =>fileReader.result =>xhr

服務器端：

saveUserImage(userid, file, base64, callback) { 
    if(file.type.indexOf('image') != 0) 
    return callback(false); 

    var fs = require("fs"); 

    var regEx = new RegExp('^data:' + file.type + ';base64,'); 
    base64 = base64.replace(regEx, ""); 

    fs.mkdir('imgs', function() { 
    fs.writeFile('imgs/' + userid + "_" + file.name, base64, 'base64', function(err) { 
     if(err) return callback(false); 
     return callback('imgs/' + userid + "_" + encodeURIComponent(file.name)); 
    }); 
    }); 
} 

保存的SVG的是錯誤的編碼，我認爲：

u«ZŠf {û/ƒìf•¶¬{®Þ[™\œÚ[ÛHŒKŒˆ[˜ÛÙ[™ÏHš\ÛËN 
NKLHÏ‚KKHÙ[™\˜]ÜŽˆYØ™H[\ݘ]܈NKŒŒÕ‘È^ÜYËR[ˆˆÕ‘È™\œÚ[ÛŽˆ 
‹ŒZ[ 
HKO‚ݙș\œÚ[ÛHŒKŒHˆYH「^Y\—ÌHˆ[œÏHš‹ËÝÝÝËÌ˛ܙËÌŒÜݙȈ[œÎž[šÏHš‹ËÝÝÝËÌ˛ܙËÌNNNKÞ[šÈˆHŒˆOHŒ‚‚HšY]ЛÞHŒLËLŒHLËLŒHˆÝ[OH™[˜X›KX˜XÚÙÜ›Ý[™›™]ÈLËLŒHLËLŒNȈ[œÜXÙOHœ™\Ù\™H‚Ï‚‚OÏ‚‚BOÏ‚‚BBOÏ‚‚BBBOÏ‚‚BBBBO]Ý[OH™š[ˆÍȈH「LLLËŽLË‹Ž˜Í‹ŒÌLKÌ‹ 
ËŒÍKŒM‹‹ŒÍÎÌ΂BBBBBXËMKŒMKLŒN 
LMKMËMKŽMLËL‹ŒÎ 
‹MKŽÌ˜ËM‹ŒÌLËNÍMËŒÍKLŒML‹ŒÍÍËLÌ΂BBBBBPÎL‹ÎNÌ‹ 
ÍLËŒNN‹Ì 
KLLËŽLË‹Žžˆ‹Ï‚‚BBBOÙÏ‚‚BBBOÏ‚‚BBBBO]Ý[OH™š[ˆÌÌÌÍŒÐNȈH「NKŽLNK 
ÌËŒÌ͘ËM‹ŒÌLËNÍMËŒÍKLŒML‹ŒÍÍËLÌ΂BBBBBXÍKŒM‹LLŒN 
MKM‹LMKŽMLË‹ŒÎ 
KLMKŽÌˆ‹Ï‚‚BBBOÙÏ‚‚BBBOÏ‚‚BBBBO]Ý[OH™š[ˆÌÌÌÍŒÐNȈH「NLŒŒK 
ÍŽÍØËLŒL‹LŒŒÎLŒKLŒÍNLŒ˜ËL 
ÍLŒ 
‹LŽLMËLŒŒÍLKŒNM‹LŒM‚BBBBBXËM‹ŽLKNKLËMËŽ 
KLŒKŽ 
LKL‹MËLÌ‹ŒXÍKŒÌLËLLŒŽL‹MKÍÎKLM‹ 
‹ËŒÍÍ‹LM‹ 
˜ÌŒL‹ŒŒÎŒKŒÍNŒ‚‚BBBBBXÌ 
͌ 
‹ŽLMËŒŒÍKŒNM‹ŒMØÍ‹ŽLKKLË 
ËŽ 
‹ŒKŽ 
LK‹NÌ‹ŒPÌLL‹ŒÌË 
Ž 
LKŽ 

SVG的支持會很好，有什麼想法？

Answer 1

問題是，MIME類型的svg是image/svg+xml！加號不會逃脫，正則表達式不匹配。我用一個簡單的函數逃脫，現在它的工作原理PERFEKT

function escapeRegExp(str) { 
    return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&"); 
} 

Answer 2

您也可以嘗試在js-base64-file模塊。只需將原始svg保存到磁盤，然後將其轉換。

github repo

const Base64File=require('js-base64-file'); 
const image=new Base64File; 

const file='test.svg'; 

//path should alwas end in a/
const path=`${__dirname}/`; 

//this will load and convert if needed 
const data=image.loadSync(path,file); 
console.log('you could send this image via ws or http to the browser now : \n',data); 

image.save(data,path,`copy-b64-${file}`); 

可以在test.js文件中看到一個異步的例子。