Question

I have the following code

app.js

var express = require('express'),
  fs = require('fs'),
  format = require('util').format;

var app = express();

app.configure(function() {
  app.use(express.bodyParser());
  app.use(express.bodyParser({uploadDir:'./static/files/'}))
  app.use(express.methodOverride());
  app.use(express.static(__dirname + '/static'));
  app.use(express.errorHandler({
    dumpException: true,
    showStack: true
  }));
});
app.set('views',__dirname + '/views');
app.set('view engine', 'jade');

OK then I have this route

app.post('/addPhoto', products.addPhoto);

This form

form(action='/new', method='POST', enctype="multipart/form-data")
 input(type='text', name="name", placeholder='nanme')
 input(type='text', name="description",placeholder='description')
 input(type='text', name="thumbnail_img",placeholder='path')
 input(type='number', name='price', placeholder='123')
 input(type="file", name="thumbnail")    
 input(type='submit') 

I used thumbnail_img in a desperate intent to modify the path

now in products.js

var products = exports.products = [];

var format = require('util').format;
var  fs = require('fs');

products.push(
  {  id:0,
     name:'name 1',
     description:'description1',
     thumbnail_img: '',
     price: 100 },
  {  id:1,
     name: 'name_2',
     description: 'description2',
     thumbnail_img: '',
     price: 150
  }
);

 exports.addPhoto = function(req,res){
  var body = req.body;
  var tmp_path = req.files.thumbnail.path;
  var target_path = './static/files/' + req.files.thumbnail.name;

  fs.rename(tmp_path, target_path, function(err) {
    if (err) throw err;
    fs.unlink(tmp_path, function() {
    body.thumbnail_img =  target_path;
      if (err) throw err;
    });
  });

  var body = req.body;

 // Fun here is I got a path starting with a .
 // so this code is for remove the .    

  var n = target_path.toString()
  var n2 = n.replace('.','');
  body.thumbnail_img =  n2;


  products.push(req.body);
  res.redirect('/products');
 };

Problem is when I use the template for show the products the src attribute shows like this src="./static/files/name-fo-the-pics" so how I do for display the images I uploaded

Answer 1

What you can do in this case is that you got the target path of the stored file and get it save into database.

Use this method for uploading

app.post('/upload', function(req, res) {

    // get the temporary location of the file
    var tmp_path = req.files.thumbnail.path;
    // set where the file should actually exists - in this case it is in the "images" directory
   target_path = '/tmp/' + req.files.thumbnail.name;
    // move the file from the temporary location to the intended location
    fs.rename(tmp_path, target_path, function(err) {
        if (err) throw err;
        // delete the temporary file, so that the explicitly set temporary upload dir does not get filled with unwanted files
        fs.unlink(tmp_path, function() {
            if (err) throw err;

        });
    });
});

While retriving show that path in this method

fs.readFile(target_path, "binary", function(error, file) {
    if(error) {
      res.writeHead(500, {"Content-Type": "text/plain"});
      res.write(error + "\n");
      res.end();
    } else {

      res.writeHead(200, {"Content-Type": "image/png"});
      res.write(file, "binary");

    }

It should work then.