Node.js -Express

Development Code
21

No idea, never used this middleware before. I've had to use Redis directly though.

22

Hey guys I am starting to wrap my head around Node more but I am not sure what to do next for where I got to.

I am trying to use an image from a Linux file system so I created a server call to get the image. I made it so the name of the image is the username plus a unique ID number so that it would only take O(1) time to find the image. I was wondering how I take an image and use it in HTML?

23

@aghost7
Client

> function showImage(){
>                $.ajax({
>                   url: '/getSessionData',
>                   type: 'POST',
>                   success: function(data){
>                     console.log("success");
>                       if(data.loggedIn){
>                         $.ajax({
>                           url:"/getImage",
>                           type: 'POST',
>                           success: function(data){
>                             //Do somthing with the image here that is in data?
>                           }
>                           error: function(xhr,status,error){
>                             console.log("error");
>                           }
>                         });
>                       }else{

>                       }
>                     },
>                   error: function(xhr,status,error){
>                     console.log("error");
>                     }

>                   });
>             }
24

server

router.post("/getImage", function(req,res){
  var imageName = " " + req.session.user + req.session.id + ".jpg";
  fs.readFile(imagePath+imageName, function(err,data){
    if(err){
      throw err;
    }
    res.writeHead(200, {'Content-Type': 'image/jpeg'});
    res.json(data);
    //res.end()
  });
});
25

Issue I have with your server code atm is that you're sending the data as JSON. Probably would make more sense to just write the raw buffer contents. Take some time to understand the buffer object in Node. I also don't understand why "getImage" is a HTTP POST. A POST is supposed to make some sort of change to the state of the server.

Since the resource you're downloading is an image, you could just append some html after logging in to download and display your image (n.b, this is only going to work if you change your API to a GET instead of POST).

1 Like
26

Thanks thats what I did to fix it.

27

I have another problem now that after following an example still doesn't work for some reason. Now I am trying to upload an image to my server from the client but every time I try and send the image it just displays this on the screen and the server doesnt print anything so I think something has gone wrong with the client???

displays:

body { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAxMC8yOS8xMiKqq3kAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzVxteM2AAABHklEQVRIib2Vyw6EIAxFW5idr///Qx9sfG3pLEyJ3tAwi5EmBqRo7vHawiEEERHS6x7MTMxMVv6+z3tPMUYSkfTM/R0fEaG2bbMv+Gc4nZzn+dN4HAcREa3r+hi3bcuu68jLskhVIlW073tWaYlQ9+F9IpqmSfq+fwskhdO/AwmUTJXrOuaRQNeRkOd5lq7rXmS5InmERKoER/QMvUAPlZDHcZRhGN4CSeGY+aHMqgcks5RrHv/eeh455x5KrMq2yHQdibDO6ncG/KZWL7M8xDyS1/MIO0NJqdULLS81X6/X6aR0nqBSJcPeZnlZrzN477NKURn2Nus8sjzmEII0TfMiyxUuxphVWjpJkbx0btUnshRihVv70Bv8ItXq6Asoi/ZiCbU6YgAAAABJRU5ErkJggg==);} .error-template {padding: 40px 15px;text-align: center;} .error-actions {margin-top:15px;margin-bottom:15px;} .error-actions .btn { margin-right:10px; }

part of client:


<form id = "uploadForm"
enctype = "multipart/form-data"
action = "/upload"
method = "post"
>



Part of Server:

var multer = require('multer');

var upload = multer({
dest:"./images/",
limits: {fileSize: 1000000, files:1},
});

router.post("/upload",upload.array('avatar'),function(req,res){
console.log("Picture Uploading....");
upload(req,res,function(err){
if(err){
return res.end("Error Uploading File");
}
console.log("Picture Uploaded");
res.end("File is uploaded");
});
});