Rendering image onto server-side using base64 not working correctly

First off - this is my first post on here, and so I preface this question with a big thanks for the many months of anonymous help I've received in the process of building my first real site. That's also to say, please forgive me if the formatting of this question (and my code LOL) isn't up to par. I'll try to include only what's relevant. That said, I'm having some issues with rendering a base64 string onto a pug template.

I'm sending off an image file to an API (in this case, a JPG) via form input with enctype='multipart/form-data'. I've gotten that to work quite nicely. However, I'd also like to grab the image that is uploaded and display it on the route that I render to after the API responds.

articles.js:

...

router.post('/add', upload.single(), function(req, res) {
     if(req.files.upfile.data) {
     global.d = new Buffer(req.files.upfile.data, 'binary').toString('base64') // I receive the data initially as a <Buffer> object // 
              // api formatting after here//
     let article = new Article(); 
             //assign article attributes 1-5, author,etc
	article.image = d;
	article.save((err) => {
	    if(err) {
		console.log(err);
		} else {
		req.flash('success', 'Log Added')
		res.redirect('/');}
		});
   }
});

...

router.get('/:id', function(req, res){
  Article.findById(req.params.id, function(err, article){
    User.findById(article.author, function(err, user){
      res.render('article', {
        article: article,
        author: user.name,
        first: article.first,
        second: article.second,
        third: article.third,
        fourth: article.fourth,
        fifth: article.fifth,
        total: article.total,
	    image: article.image
      });
    });
  });
});

which renders onto:

article.pug

extends layout

block content
  h1 #{author}'s day
  h4 from #{article.title}
  br 
  br
  ul
    li.list-group-item.d-flex.justify-content-between.align-items-center.list-group-item-success Sadness.
      span.badge.badge-primary.badge-pill #{first}
    br
    li.list-group-item.d-flex.justify-content-between.align-items-center.list-group-item-success Anger. 
      span.badge.badge-primary.badge-pill #{second}
    br
    li.list-group-item.d-flex.justify-content-between.align-items-center.list-group-item-success Disgust.
      span.badge.badge-primary.badge-pill #{third}
    br
    li.list-group-item.d-flex.justify-content-between.align-items-center.list-group-item-success Neutral.
      span.badge.badge-primary.badge-pill #{fourth}
    br
    li.list-group-item.d-flex.justify-content-between.align-items-center.list-group-item-success Happiness.
      span.badge.badge-primary.badge-pill #{fifth}
    br
    li.list-group-item.d-flex.justify-content-between.align-items-center.list-group-item-success Happiness.
      span.badge.badge-primary.badge-pill #{image}
  
  img(src='data:image/jpeg;base64,#{image}')

I get the missing image icon, even though my base64 works on every online decoder I've used, and even if I hardcode the base64 string into the link as <img src = "data:image/jpeg;base64,DATA_HERE"> on a test html file. And if I insert p #{image} onto the line before I attempt to use #{image}, I get something like this (which seems to be valid to me, but I think I just need a more experienced eye to look at this):

/9j/4gIcSUNDX1BST0ZJTEUAAQEAAAIMbGNtcwIQAABtbnRyUkdCIFhZWiAH3AABABkAAwApADlhY3NwQVBQTAAAAAAAAAAAAAA ... DTvL/734mAqYiBciDqO8FmafV/UiJb3V9kn//Z

Ahh please tell me what I'm misunderstanding! I've searched through every post on SO and haven't been able to fix my error. Any input is very much appreciated. Thank you again!

EDIT: writing image/jpg and image/jpeg gives me the same empty image icon