[Express] Level 2: Middleware -- 1
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的更多相关文章
- [Express] Level 2: Middleware -- 2
Logging Middleware Help finish the following middleware code in the logger.js file: On the response ...
- [Express] Level 4: Body-parser -- Post
Parser Setup Assume the body-parser middleware is installed. Now, let's use it in our Express applic ...
- [Express] Level 3: Massaging User Data
Flexible Routes Our current route only works when the city name argument matches exactly the propert ...
- [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 ...
- [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 ...
- [Express] Level 4: Body-parser -- Delete
Response Body What would the response body be set to on a DELETE request to /cities/DoesNotExist ? H ...
- [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 ...
- [Express] Level 1: First Step
Installing Express Let's start building our new Express application by installing Express. Type the ...
- 透析Express.js
前言 最近,本屌在试用Node.js,在寻找靠谱web框架时发现了Express.js.Express.js在Node.js社区中是比较出名web框架,而它的定位是“minimal and flexi ...
随机推荐
- 内存溢出（heap corruption detected:）
今天又遇到了上次出现的bug,然后百度了一下,想起来这是内存溢出的毛病,故记录下来! 出现的问题就是这样: heap corruption detected: after normal block(# ...
- AudioManager --- generateAudioSessionId
AudioManager中的generateAudioSessionId方法介绍: 1.方法声明 pubilc void generateAudioSessionId(); 2.API描述 返回一个不 ...
- 【整理】JavaEE基本框架（Struts2+Spring+MyBatis三层，Struts MVC）之间的关系
#[整理]JavaEE基本框架(Struts2+Spring+MyBatis三层,Struts MVC)之间的关系 /月入2万/不用抢单:http://www.cnblogs.com/mfry ...
- log4j:ERROR LogMananger.repositorySelector was null likely due to error in class reloading, using NOPLoggerRepository.
The reason for the error is a new listener in Tomcat 6.0.24. You can fix this error by adding this l ...
- 使用AndroidStudio dump heap,再用 Eclipse MAT插件分析内存泄露
1.eclipse mat插件的安装 Help->Install new software,如下图,一直下一步即可 2.AndroidStudio dump heap 3.AndroidStud ...
- 在PhpStorm9中与Pi的xdebug进行调试
PI的配置参考 http://www.cnblogs.com/yondy/archive/2013/05/01/3052687.html 在PhpStorm 9.0中参考下面的截图进行配置 配置完成以 ...
- nyoj 119 士兵杀敌（三）（RMQ）
士兵杀敌(三) 时间限制:2000 ms | 内存限制:65535 KB 难度:5 描述 南将军统率着N个士兵,士兵分别编号为1~N,南将军经常爱拿某一段编号内杀敌数最高的人与杀敌数最低的人进 ...
- getGuid()
function GetGUID: string;var LTep: TGUID;begin CreateGUID(LTep); Result := GUIDToString(LTep); R ...
- iOS KVC/KVO/KVB
看了那么多博客.描述那么复杂,其实KVC很简单,没描述的那么复杂,所以写一篇简单的易于理解的博文,切入正文: 1.KVC底层是通过runtime对method和value操作 比如说如下的一行KVC ...