Mounting Middleware

Given an application instance is set to the app variable, which of the following function calls would you use to mount a middleware called logger ?

Answer:

app.use(logger);

Default Middleware

What is the only middleware that's shipped with Express 4?

Answer: express-static

Express Static

Change the code in app.js to use the express-static middleware instead of the response.sendFile() function.

var express = require('express');

var app = express();

app.get('/', function (request, response) {

  response.sendFile(__dirname + '/public/index.html');

});

app.get('/cities', function(req, res){

  var cities = ['Lotopia', 'Caspiana', 'Indigo'];

  res.send(cities);

});

app.listen(3001);

Remove our app.get() containing the root '/' route.

Mount the static middleware and serve files under the public directory.

Answer:

var express = require('express');

var app = express();

/*app.get('/', function (request, response) {

  response.sendFile(__dirname + '/public/index.html');

});*/

//cd public

app.use(express.static('public'));

app.get('/cities', function(req, res){

  var cities = ['Lotopia', 'Caspiana', 'Indigo'];

  res.send(cities);

});

app.listen(3001);

Script Tags

Now we can add some client side javascript by including thejquery.js and client.js files.

Within index.html, include jquery.js using a <script> tag.

Within index.html, include client.js using a <script> tag.

Now in the client.js file, complete the code for the $.get function so that it calls the /cities URL path, and then runs the appendToList function.

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>Cities</title>

</head>

<body>

  <h1>Cities</h1>

  <ul class='city-list'></ul>

   <script src="jquery.js"></script>

   <script src="client.js"></script>

</body>

</html>

Now in the client.js file, complete the code for the $.get function so that it calls the /cities URL path, and then runs the appendToList function.

$(function(){

  $.get('/cities', appendToList ); 

  function appendToList(cities) {

    var list = [];

    for(var i in cities){

      list.push($('<li>', { text: cities[i] }));

    }

    $('.city-list').append(list);

  }

});

[Express] Level 2: Middleware -- 1的更多相关文章

  1. [Express] Level 2: Middleware -- 2

    Logging Middleware Help finish the following middleware code in the logger.js file: On the response  ...

  2. [Express] Level 4: Body-parser -- Post

    Parser Setup Assume the body-parser middleware is installed. Now, let's use it in our Express applic ...

  3. [Express] Level 3: Massaging User Data

    Flexible Routes Our current route only works when the city name argument matches exactly the propert ...

  4. [Express] Level 5: Route file

    Using a Router Instance Let's refactor app.js to use a Router object. Create a new router object and ...

  5. [Express] Level 5: Route Instance -- refactor the code

    Route Instance Let's rewrite our cities routes using a Route Instance. Create a new Route Instance f ...

  6. [Express] Level 4: Body-parser -- Delete

    Response Body What would the response body be set to on a DELETE request to /cities/DoesNotExist ? H ...

  7. [Express] Level 3: Reading from the URL

    City Search We want to create an endpoint that we can use to filter cities. Follow the tasks below t ...

  8. [Express] Level 1: First Step

    Installing Express Let's start building our new Express application by installing Express. Type the ...

  9. 透析Express.js

    前言 最近,本屌在试用Node.js,在寻找靠谱web框架时发现了Express.js.Express.js在Node.js社区中是比较出名web框架,而它的定位是“minimal and flexi ...

随机推荐

  1. Matlab命令——目录操作（windows&Linux）

    Matlab命令——目录操作(windows&Linux) 1. filesep用于返回当前平台的目录分隔符,Windows是反斜杠(\),Linux是斜杠(/).有时此命令结合ispc命令使 ...

  2. Win7+VS2013初试Thrift

    win7环境下VS2013编译boost_1_58_0步骤: 官网下载boost_1_58_0(直接下载),解压 cmd窗口cd到boost_1_58_0,执行bootstrap.bat cmd窗口获 ...

  3. Basic Sorting Algorithms

    *稳定指原本数列中相同的元素的相对前后位置在排序后不会被打乱 快速排序(n*lgn 不稳定):数组中随机选取一个数x(这里选择最后一个),将数组按比x大的和x小的分成两部分,再对剩余两部分重复这个算法 ...

  4. 分布式数据库hbase详解

    新霸哥注意到了在人类随着计算机技术的发展,数据的存储量发生了很大的变化,可以用海量来形容,同时,存储的数据类型也是有多种多样的,网页,图片,视频,音频,电子邮件等等,所以在这中情况下以谷歌旗下的Big ...

  5. C语言——内存分配

    1.在C语言的运行过程中,需要内存来存储数据.C语言使用的内存总体可以分为两类:一类是静态区,一类是动态区.2.静态数据存储区包含:只读数据区.已初始化的读写数据区.未初始化的读写数据区     动态 ...

  6. 使用JavaMail API发送邮件

    发送邮件是很常用的功能,注册验证,找回密码,到货通知,欠费提醒等,都可以通过邮件来提醒. Java中发送邮件需要使用javax.mail.jar包,读者可以上网搜索或去官方下载,下载地址为: 下面贴上 ...

  7. 使用Log.isLoggable方法

    在Audio Debug过程中想打开AudioService.java文件中的log,比如想打开setmode这段log: if (DEBUG_MODE) { Log.v(TAG, "set ...

  8. 非阻塞式socket的select()用法

    Select在Socket编程中还是比较重要的,可是对于初学Socket的人来说都不太爱用Select写程序,他们只 是习惯写诸如 connect.accept.recv或recvfrom这样的阻塞程 ...

  9. [WebService]之TCPMon的使用

    TCPMon是apache下的一个项目,下载地址:http://ws.apache.org/commons/tcpmon/download.cgi (1)功能: TCPMon可以拦截客户与服务之间的H ...

  10. 移动端和web端前端UI库—Frozen UI、WeUI、SUI Mobile

    web http://www.pintuer.com/ 拼图 http://www.h-ui.net/ http://www.layui.com/  很厉害的一个个人产品 http://amazeui ...