Modern JavaScript Applications
上QQ阅读APP看书,第一时间看更新

Creating the image upload server

We have finished building the services. Now let's build the image storage server. The image storage server defines the routes using which an image can be stored, deleted, or retrieved.

Open the Initial/image-storage directory. Inside the directory, you will find a package.json file and an app.js file. The app.js file is where you will write the code, and package.json lists the dependencies for the image storage server. The upload service is dependent on express, connect-multiparty, path, and fs. Run the npm install command inside Initial/image-storage to install the dependencies locally.

The following is the code to import the modules:

var express = require("express");
var app = express();
var fs = require("fs");
var multipart = require("connect-multiparty")();

Now let's define the route using which the upload service can store images in the image storage server. The upload service makes the POST request to the /store URL path to store the image. Here is the code to define the route:

app.post("/store", multipart, function(httpRequest, httpResponse, next){
  var tmp_path = httpRequest.files.thumbnail.path;
  var target_path = "public/images/" + httpRequest.body.name;
  fs.rename(tmp_path, target_path, function(err) {
    if(err) return httpResponse.status(500).send("An error occured");

    httpResponse.send("Done");
  });
});

Here, at first, we are adding the callback provided by the connect-multiparty module, which parses the multipart/form-data content type body and also moves the files to a temporary location.

Then, we are moving the file from temporary directory to another directory. The directory we are moving the file to is public/images/. We are moving the file using the rename method of the filesystem module. Finally, we are sending a Done string as the body of HTTP response to tell the upload service that the file is stored successfully.

Now let's define the route using which the upload service can delete an image stored in the image storage server. The upload service makes the GET request to the /delete/:id URL path, where the id parameter indicates the image name. The following is the code to define the route:

app.get("/delete/:id", function(httpRequest, httpResponse, next){
  fs.unlink("public/images/" + httpRequest.params.id, function(err) {
    if(err) return httpResponse.status(500).send("An error occured");

    httpResponse.send("Done");
  });
});

Here we are deleting the image file using the unlink method of the fs module.

Finally, we need to serve images to the browser. Looking for static file in the public/images/ directory can do this. The following is the code to do this:

app.use(express.static(__dirname + "/public/images"));

Here we are using the static middleware that looks for static files in the directory provided by arguments and serves directly to the browser.

Now we have defined our routes. Finally, we need to start the Express server. Here is the code to do so:

app.listen(9090);

Now go ahead and run the image storage server using the node app.js command.