这个图片服务是谁提供的?如果完全是您自己的服务端提供的,你需要单独创建一个图像服务接口来响应对图片文件的请求,记得做出响应的时候,需要设置正确的 Content-Type。
下面是文件服务接口的处理器方法的参考:
https://github.com/ninghao/xb2-node/blob/master/src/file/file.controller.ts
/**
* 文件服务
*/
export const serve = async (
request: Request,
response: Response,
next: NextFunction,
) => {
// 从地址参数里得到文件 ID
const { fileId } = request.params;
try {
// 查找文件信息
const file = await findFileById(parseInt(fileId, 10));
// 要提供的图像尺寸
const { size } = request.query;
// 文件名与目录
let filename = file.filename;
let root = 'uploads';
let resized = 'resized';
if (size) {
// 可用的图像尺寸
const imageSizes = ['large', 'medium', 'thumbnail'];
// 检查文件尺寸是否可用
if (!imageSizes.some(item => item == size)) {
throw new Error('FILE_NOT_FOUND');
}
// 检查文件是否存在
const fileExist = fs.existsSync(
path.join(root, resized, `${filename}-${size}`),
);
// 设置文件名与目录
if (fileExist) {
filename = `${filename}-${size}`;
root = path.join(root, resized);
}
}
// 做出响应
response.sendFile(filename, {
root,
headers: {
'Content-Type': file.mimetype,
},
});
} catch (error) {
next(error);
}
};