0

用户选择一张图片(在这种情况下来自 Facebook,但我不认为这与问题有关)。请求被发送到服务器以获取图像并将其保存在本地。请求以 200 解析。解析后的请求在客户端被拾取,并通过创建一个新的图像使用 JS 将图像动态添加到页面中。

问题:即使在写入过程完成之前请求没有解决,但当客户端尝试加载图像时,它会返回 404。

我已经尝试在客户端上添加一个错误处理程序,如果图像返回 404,它会重新加载图像。这在几百毫秒后起作用。然而还有另一个问题。通常图像只加载了一半,其余的都是黑色的。

当请求解决时,就好像图像尚未完成处理一样。

我不知道是什么导致了这个问题。在操作完成之前,我看不到如何解决请求。

import fs from 'fs';
import request from 'request';
import gm from 'gm';
import createUserImageFolders from './imageHelpers/createUserImageFolders';
import getNextImageNumber from './imageHelpers/getNextImageNumber';
import saveImages from './imageHelpers/saveImages';

export default function uploadFacebookPhoto(req, params) {
  return new Promise((resolve, reject) => {
    createUserImageFolders(req.session.currentDesignerSessionId);

    const userDir = 'static/images/user/' + req.session.currentDesignerSessionId;

    const imageNumber = getNextImageNumber(userDir + '/uploads/full');

    const filename = `${userDir}/uploads/full/${imageNumber}.jpg`;

    const thumbWidth = 100;

    // Stream the image from the remote server.
    request.head(req.body.photoUrl, (err, response, body) => {
      request(req.body.photoUrl).pipe(fs.createWriteStream(filename).on(
        'close',
        () => {

          // Create thumbnail
          gm(filename)
            .noProfile()
            .quality(85)
            .resize(thumbWidth)
            .write(userDir + `/uploads/thumb/${imageNumber}.jpg`, (error) => {
              if (error) {
                console.error('Graphics Magic (gm) error ', error);
                reject({error: 500});
              } else {
                resolve(true);
              }
            });

        }
      ));
    });
  });
}
4

0 回答 0