2017-10-07 49 views
0

我正在構建一個虛擬圖像生成器以提高我對Node和Express的理解。我從URL中獲取維度並使用GM包調整其大小。結果流被傳送到響應中。但是我沒有在前端獲取數據,當我在Chrome中的開發工具的網絡面板中查看響應選項卡時,我看到「此響應沒有可用的數據」。有人可以給我一些指針,因爲我不知道我可以在哪裏開始調試。管道調整大小的圖像表示響應設置響應標題爲'Content-Length:0',沒有響應數據

const IMAGE_DIR_PATH = path.join(__dirname, './../../data/images'); 

const getRandomImageName =() => { 
    return new Promise((resolve, reject) => { 
    fs.readdir(IMAGE_DIR_PATH, (err, images) => { 
     err ? reject(err) : resolve(
     images[Math.floor(Math.random() * images.length)] 
    ); 
    }); 
    }); 
}; 

const pickDimensions = (dimensionsStr) => { 
    const dimensions = dimensionsStr.toLowerCase().split('x'); 
    return { 
    width: dimensions[0], 
    height: dimensions[1] ? dimensions[1] : dimensions[0] 
    }; 
}; 

exports.getRandomImageByDimension = (req, res, next) => { 
    const dimensions = pickDimensions(req.params.dimensions); 

    //getRandomImageName returns a Promise 
    //resolves with the name of the file example: abc.jpg 
    getRandomImageName() 
    .then((img) => { 
    res.set('Content-Type', 'image/jpeg'); 

    //I am getting the right image and the path below is valid 
    gm(path.resolve(`${IMAGE_DIR_PATH}/${img}`)) 
    .resize(dimensions.width, dimensions.height) 
    .stream(function (err, stdout, stderr) { 
     if (err) { throw new Error(err); } 
     stdout.pipe(res); 
    }); 
    }) 
    .catch(e => { 
    res.status(500); 
    res.send(e); 
    }); 
}; 

我收到的響應頭如下所示: enter image description here

+1

我會開始使用一個更簡單的例子來調試。首先創建一個根本不使用Express或GM的Node腳本,只需打開一個圖像文件並將其傳送到另一個文件中,然後使用硬編碼的文件名檢查該文件的工作方式,因此毫無疑問它正在做什麼。然後添加調整大小的東西,使用硬編碼的大小和檢查工作。然後逐步引入Express位並刪除硬編碼。繼續檢查它仍然在每個階段的作品,直到你確切地分離出錯的地方。 – skirtle

回答

0

原來,我忘了添加ImageMagick作爲依賴於gm,這是造成錯誤。奇怪的是,錯誤沒有顯示在控制檯中,我發現它只是在將應用程序分解爲更簡單的部分並調試爲上面評論中提到的裙子之後才發現的。

要解決我做了以下內容:

npm install --save imagemagick 

然後,我用的是通用包中的文件,我設置ImageMagick的屬性:

const gm = require('gm').subClass({imageMagick: true}); 

注:我在這上運行一個Windows 7.