Next.js — предоставление изображений из GridFS

#node.js #next.js #gridfs

#node.js #next.js #сетки

Вопрос:

Я хочу предоставить некоторые изображения, которые я сохранил в своей базе данных GridFS, своему Next.js проект. Иногда изображения загружаются в процессе разработки (иногда нет), однако они никогда не загружаются в производство. Я использую gridfs-stream для обслуживания изображений.

На стороне клиента изображение вызывается следующим образом:

 <img src={`/api/image?id=${filename}`} />
 

И на сервере он обслуживает изображение следующим образом:

 import mongoose from 'mongoose';
import nc from 'next-connect';

const Grid = require('gridfs-stream');
const conn = mongoose.createConnection(gridFSURI);

let gfs;
conn.once('open', () => {
  gfs = Grid(conn.db, mongoose.mongo);
  gfs.collection('files');
});

const handler = nc();

handler.get((req, res) => {
  gfs.files.findOne({ filename: req.query.id }, (err, file) => {
    if (!file || file.length === 0) {
      return res.status(404).json({
        err: 'No file exists'
      });
    } else {
      const readstream = gfs.createReadStream(file.filename);
      readstream.pipe(res);
    }
  });
})

export const config = {
  api: {
    bodyParser: false,
  },
};

export default handler;
 

Должны ли эти изображения передаваться через getServerSideProps ?

Ответ №1:

создайте файл [stream].js и используйте этот код «mongoose»: «^ 5.13.7»

 import mongoose from "mongoose";
export default async (req, res) => {
  const {
    query: { stream },
    method,
    } = req;

    const conn = await mongoose.createConnection(process.env.MONGODB_URI, {
        useNewUrlParser: true,
        useUnifiedTopology: true,
      });

    const bucket = new mongoose.mongo.GridFSBucket(conn.db ,  {bucketName :'anyname'})
   
  switch (method) {
    case "GET":
          try {
            const _id = new mongoose.Types.ObjectId(stream)
              bucket.find({_id}).toArray((err, files) => {
                  if (err) {
                      return res.status(400).send({ err: err })
                  }
                     if (!files || files.length === 0) {
                         return res.status(400).send("no file exist")
                      }
                  bucket 
                   .openDownloadStream(_id)
                   .pipe(res)  
                })
          
      } catch (error) {
        res.status(400).json({ succes: false, err: error });
      }
          break;
      
    default:
      res.send("default");
      break;
  }
};

export const config = {
  api: {
    externalResolver: true,
  },
}; 

Комментарии:

1. Пожалуйста, добавьте подробное объяснение к вашему ответу, чтобы еще больше прояснить, как ваш код решает заданный вопрос.