從圖形魔術管道圖像輸出到沒有base64編碼的響應

我有一個節點服務器，而不是存儲裁剪圖像，我想裁剪它們以響應AJAX調用，並將它們發送到客戶端。我正在存儲要裁剪的內容以及如何在餅乾和身體中裁切它的信息。在服務器上裁剪，用base64編碼，然後發回給用戶。這裏是我的代碼看起來像從圖形魔術管道圖像輸出到沒有base64編碼的響應

res.set('Content-Type', 'image/jpeg'); 
gm(request(body.URL)) 
    .crop(req.cookies[name+"Width"],req.cookies[name+"Height"],req.cookies[name+"X"],req.cookies[name+"Y"]) 
    .stream(function streamOut (err, stdout, stderr) { 
     if (err) return next(err); 
     stdout.pipe(base64encode()).pipe(res); 
     stdout.on('error', next); 
    });

這工作，但我不喜歡它。我只能通過在base64中對其進行編碼才能使其工作，但在客戶端，這似乎很難將其解碼爲圖像。我寧願直接發送圖像，但我無法得到這個工作。在不對其進行解碼的情況下裁剪圖像會導致服務器產生亂碼響應。有一個更好的方法嗎？或者未保存的圖像必須進行編碼才能發送？

來源

2016-07-07 master565

您是否試過'.setFormat（'jpg' ）'.crop（）'之前'？ –

setFormat（'jpg'）導致了與我以前相同的亂碼。我不熟悉fs.createWriteStream，你能告訴我在代碼中看起來如何嗎？ – master565

我不知道你是如何編寫的node.js - 它看起來像一堆點和括號給我，但使用我所瞭解的GraphicsMagick命令行，我嘗試了這個，它做了我認爲你想要的 - 這是是寫上一個stdout JPEG編碼結果：

// Send header "Content-type: image/jpeg"... 

var gm = require('gm'); 
var input = 'input.jpg'; 

gm(input).resize(350).toBuffer('JPG',function (err, buffer) { 
    if (err) return handle(err); 
    process.stdout.write(buffer); 
})

更新

你有沒有考慮排除了AJAX方面，只是用你的形象，是指node腳本靜態src？正如我所說的，我不知道node和Javascript但如果我通過一個PHP腳本生成縮略圖，我想補充到HTML

<img src="/php/thumb.php"/>

所以這只是調用PHP腳本來生成圖像這一點。如果您刪除了/php/thumb.php，並將其替換爲您已命名爲我上面建議的node腳本，它應該告訴您問題是AJAX還是GraphicsMagick方面...

來源

2016-07-11 08:43:32

我回家時會給這個鏡頭。在收到服務器的響應後，我需要做什麼才能將其顯示在頁面上？例如，目前我只需使用'data：image/jpeg; base64'+ response'編輯帶有src屬性的AJAX回調來顯示它。 – master565

至於我的格式，我將每種方法分割到一個新行中，以便「crop」與「stream」分開。除此之外，它看起來很醜，因爲我使用了多箇中間件，而「crop」方法的參數都是從cookies中獲取的，我可以通過將它們存儲在一個更有用的變量中進行清理名稱。在發帖之前我並沒有打算這麼做，因爲理解這一部分與回答問題並不相關。 – master565

我不這麼認爲，但我從來沒有做過任何'node.js'，通常我會將'src'設置爲PHP腳本名稱的HTML'img'元素，它會改變圖像併發送返回一個*「Content-type：image/jpeg」*後跟數據，所以我猜上面的代碼將會是相同的東西，應該有希望工作。我通過將上述內容放在一個名爲'script.js'的腳本中，然後運行'node script.js> result.jpg'來測試它，並且圖像是正確的，所以我很高興腳本在其stdout中寫入一個JPEG。 –

從圖形魔術管道圖像輸出到沒有base64編碼的響應

回答

相關問題