0

please how do I tell my view to display the image in the view with ejs template.

I am uploading to Amazon multers3 and the image is being uploaded in this directories successfully public/uploads/postImages

this is my upload inside my route file.

const upload = multer({ 

  storage: multerS3({
    s3: s3,
    bucket: bucketname,
    s3BucketEndpoint:true,
    endpoint:"http://" + bucketname + ".s3.amazonaws.com",
    key: function (req, file, cb) {
      cb(null, 'public/uploads/postImages/' + file.originalname);
    }
  })
})


      

 router.post('/', upload.single('cover'), async (req, res, next) => {
    const fileName = req.file != null ? req.file.filename : null

    const post = new Post({
      title: req.body.title,
      description: req.body.description,
      from: req.body.from,
      postImage: fileName,

     })
     try {

      const newPost = await post.save()
      res.redirect('/posts')

    } catch {
     if (post.postImage != null) {
       removePostImage(post.postImage)
   }
    renderNewPage(res, post, true)
  }
});

this is my posts/index.ejs

 <main role="main">
    <ul class="flexgrid columns-news">
      <% posts.forEach(post => { %>
        <li>   
            <figure class="gallery-image">
              <img  src="/public/uploads/postImages/<%= post.postImage %>" >
            </figure>
        </li>
       <% });%> 
   </ul>
</main>

How do I tell my view to look for the image inside public/uploads/postImages ?

  • is there any error , what is being displayed. – Tanmay Patil Jun 21 '20 at 14:13
  • It's not showing any error, the image is just not displaying – Chukwuma Kingsley Jun 21 '20 at 14:19
  • I think the url for `src` attribute of the image element should point to the S3 so something like `http://your-bucket.s3.amazonaws.com/public/uploads/postImages/yourimage.xyz` Currently the url is pointing to your server not to amazon. – Molda Jun 21 '20 at 14:31
  • If you are uploading in amazon s3 then why are you giving local path to src and also inside key parameter? – turivishal Jun 21 '20 at 14:39
  • i have no knowledge of how to do this and I can't find any example here on StackOverflow, my reason of asking here is to seek for assistance from someone who has done it before because I have been struggling with this for a while now. if you have done it before, please assist me. – Chukwuma Kingsley Jun 22 '20 at 09:24
  • I am able to display the image with the following code `` but what I want is to display them according to where they belong, LIke so `` How do I call post.postImage ` attribute to display the image name without hard coding it? – Chukwuma Kingsley Jun 22 '20 at 14:21

0 Answers0