Node.js를 익스프레스 프레임 워크

이전 : Node.js를 웹 모듈

다음 : 편안하고 API를 Node.js를

익스프레스 프로필

Express는 웹 응용 프로그램 및 다양한 HTTP의 다양한 도구를 만들 수 있도록 강력한 기능의 범위를 제공하는 간단하고 유연한 Node.js를 웹 응용 프로그램 프레임 워크입니다.

사용 Express는 신속하게 모든 기능을 웹 사이트를 설정할 수 있습니다.

익스프레스 프레임 핵심 기능 :

미들웨어는 HTTP 요청에 응답하도록 설정 될 수있다.
이것은 다른 HTTP 요청 동작을 수행하기 위해 라우팅 테이블을 정의하고있다.
동적 HTML 페이지를 렌더링하는 템플릿에 매개 변수를 전달할 수 있습니다.

설치 익스프레스

설치 Express 및 목록에 의존하는 저장 :

$ npm install express --save

프레임을 표현합니다 위의 명령은 디렉토리가node_modules 디렉토리를 표현 자동으로 생성됩니다, node_modules 디렉토리를현재 디렉토리를 마운트됩니다. 몇 가지 중요한 요구와 표현 모듈은 프레임 워크와 함께 설치됩니다 :

몸 파서 - 미들웨어, JSON, 원시, 텍스트 및 처리를위한 URL 인코딩 된 데이터를 Node.js를.
쿠키 파서 -이 쿠키를 분석하기위한 도구입니다.req.cookies으로 쿠키를 통해 전달받을 수 있고, 객체로 돌립니다.
multer이 - 처리에 enctype = "다중 / 폼 데이터 미들웨어를 Node.js를"( 설정 양식 MIME 인코딩) 양식 데이터.

$ npm install body-parser --save
$ npm install cookie-parser --save
$ npm install multer --save

첫 번째 프레임 워크 인스턴스 익스프레스

다음은 출력에 "Hello World"를 익스프레스 프레임 워크를 사용합니다.

다음의 예는 우리가 명시 적 모듈 및 요청 클라이언트의 응답에 "Hello World"문자열을 소개했다.

express_demo.js 파일을 만들고 다음과 같이 코드 :

//express_demo.js 文件
var express = require('express');
var app = express();

app.get('/', function (req, res) {
   res.send('Hello World');
})

var server = app.listen(8081, function () {

  var host = server.address().address
  var port = server.address().port

  console.log("应用实例，访问地址为 http://%s:%s", host, port)

})

위의 코드를 실행합니다 :

$ node express_demo.js 
应用实例，访问地址为 http://0.0.0.0:8081

브라우저에서 액세스 http://127.0.0.1:8081는, 그 결과를 다음과 같이 :

요청 및 응답

고속 애플리케이션 콜백 함수매개 변수를 사용하여 요청 및 응답객체는 데이터 요청 및 응답을 처리하기.

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

특정요청 및 응답 객체를소개합니다 :

요청 개체 - 요청 객체는 HTTP 요청이 요청 쿼리 문자열 매개 변수, 내용, HTTP 헤더 속성을 포함 나타냅니다.일반적인 특성은 다음과 같습니다

req.app : 액세스 할 수있는 외부 파일에 콜백, req.app 예제를 표현
req.baseUrl : URL 라우팅은 현재 설치하기
req.body / req.cookies : GET "요청 본문"/ 쿠키
req.fresh / req.stale는 : 상기 요청이 여전히 "신선한"인지 여부를 판단
req.hostname / req.ip : 호스트 이름과 IP 주소를 얻을
req.originalUrl은 : 원래 요청 URL 가져 오기
req.params : 경로 매개 변수를 가져옵니다
req.path : 요청 경로를 가져옵니다
req.protocol : 프로토콜 유형 가져 오기
req.query 다음 URL 쿼리 문자열 매개 변수를 가져옵니다
req.route : 현재 일치하는 경로를 가져옵니다
req.subdomains은 : 하위 도메인을 가져 오기
req.accpets은 () : 요청 유형을 수락 요청 헤더 확인
req.acceptsCharsets / req.acceptsEncodings / req.acceptsLanguages
req.get은 () : 지정된 HTTP 요청 헤더를 가져옵니다
req.is () : 요청 헤더의 Content-Type MIME 타입의 경우

응답 객체 - 객체 응답은 HTTP 응답을 클라이언트 응답 데이터 전송 요청을 수신하는 때, HTTP를 나타낸다. 일반적인 특성은 다음과 같습니다

res.app : req.app과 동일
res.append은 () : 추가 HTTP 헤더를 지정합니다
첫 번째 res.append 전에 res.set는 () ()의 설정을 재설정
res.cookie (이름, 값 [옵션]) : 설정 쿠키
opition : 도메인 /은 / Http 만 / MAXAGE / 경로 /가 / 보안 서명 만료
res.clearCookie () : 클리어 쿠키
res.download (는) 파일의 전송 경로를 지정
res.get은 () : HTTP 헤더를 돌려줍니다
res.json () : 전송 JSON 응답
res.jsonp는 () : JSONP 응답을 전송할
res.location () : 위치 HTTP 응답 헤더는 설정하지 설정하거나 가까운 응답 상태 코드
res.redirect () : 위치 HTTP 응답 헤더를 설정하고, 설정 상태 코드 (302)
res.send () : HTTP 응답 전송
res.sendFile은 (경로는 [옵션] [FN])는 : - 파일을 기반으로 자동으로 콘텐츠 형식 확장 설정 파일의 전송 경로를 지정합니다
res.set은 () : HTTP 헤더를 설정, 여러 들어오는 개체 머리를 설정할 수 있습니다
res.status () : HTTP 상태 코드를 설정
res.type () : 내용 - 형식의 MIME 타입 설정

라우팅

이미 누구에 의해 결정된 기본 애플리케이션 HTTP 요청 및 경로 (스크립트 지정) 클라이언트 요청에 응답하는 것을 알고있다.

HTTP 요청에서, 우리는 URL 라우팅을 추출 / POST 매개 변수 요청을 얻을 수 있습니다.

다음으로 우리는 HTTP 요청의 더 많은 종류를 처리하기 위해 몇 가지 기능을 추가, 안녕하세요을 확장합니다.

express_demo2.js 파일을 만들고 다음과 같이 코드 :

var express = require('express');
var app = express();

//  主页输出 "Hello World"
app.get('/', function (req, res) {
   console.log("主页 GET 请求");
   res.send('Hello GET');
})


//  POST 请求
app.post('/', function (req, res) {
   console.log("主页 POST 请求");
   res.send('Hello POST');
})

//  /del_user 页面响应
app.get('/del_user', function (req, res) {
   console.log("/del_user 响应 DELETE 请求");
   res.send('删除页面');
})

//  /list_user 页面 GET 请求
app.get('/list_user', function (req, res) {
   console.log("/list_user GET 请求");
   res.send('用户列表页面');
})

// 对页面 abcd, abxcd, ab123cd, 等响应 GET 请求
app.get('/ab*cd', function(req, res) {   
   console.log("/ab*cd GET 请求");
   res.send('正则匹配');
})


var server = app.listen(8081, function () {

  var host = server.address().address
  var port = server.address().port

  console.log("应用实例，访问地址为 http://%s:%s", host, port)

})

위의 코드를 실행합니다 :

$ node express_demo2.js 
应用实例，访问地址为 http://0.0.0.0:8081

그럼 당신은 효과를보기 위해, http://127.0.0.1:8081 다른 주소에 액세스하려고 할 수 있습니다.

브라우저에서 액세스 http://127.0.0.1:8081/list_user는, 그 결과를 다음과 같이 :

브라우저에서 액세스 http://127.0.0.1:8081/abcd는, 그 결과를 다음과 같이 :

브라우저에서 액세스 http://127.0.0.1:8081/abcdefg는, 그 결과를 다음과 같이 :

정적 파일

Express는 기본 제공 미들웨어express.static 같은 정적 파일을 설정 : 사진, 등등 CSS, 자바 스크립트.

당신은 정적 파일 경로를 설정express.static 미들웨어를 사용할 수 있습니다.예를 들어, 사진 경우, CSS는, 공용 디렉토리에서 자바 스크립트 파일, 당신은 쓸 수 있습니다 :

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

다음과 같이 우리는 디렉토리가 약간의 그림을 위임 공공 / 이미지로 이동 할 수 있습니다 :

node_modules
server.js
public/
public/images
public/images/logo.png

우리가 다음에 "Hello 말씀은"응용 프로그램 처리 기능 정적 파일을 추가, 수정 할 수 있습니다.

express_demo3.js 파일을 만들고 다음과 같이 코드 :

var express = require('express');
var app = express();

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

app.get('/', function (req, res) {
   res.send('Hello World');
})

var server = app.listen(8081, function () {

  var host = server.address().address
  var port = server.address().port

  console.log("应用实例，访问地址为 http://%s:%s", host, port)

})

위의 코드를 실행합니다 :

$ node express_demo3.js 
应用实例，访问地址为 http://0.0.0.0:8081

위의 코드를 실행합니다 :

GET 메서드

다음 예는 GET 메소드에 의해 제출 된 형태로 두 개의 매개 변수를 보여, 우리의 입력을 처리하는 파일 내의 라우터 server.js의process_get를 사용할 수있다:

다음과 같이 index.htm 파일의 코드는 다음과 같습니다

<html>
<body>
<form action="http://127.0.0.1:8081/process_get" method="GET">
First Name: <input type="text" name="first_name">  <br>

Last Name: <input type="text" name="last_name">
<input type="submit" value="Submit">
</form>
</body>
</html>

다음과 같이 server.js 파일의 코드는 다음과 같습니다

var express = require('express');
var app = express();

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

app.get('/index.htm', function (req, res) {
   res.sendFile( __dirname + "/" + "index.htm" );
})

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

   // 输出 JSON 格式
   response = {
       first_name:req.query.first_name,
       last_name:req.query.last_name
   };
   console.log(response);
   res.end(JSON.stringify(response));
})

var server = app.listen(8081, function () {

  var host = server.address().address
  var port = server.address().port

  console.log("应用实例，访问地址为 http://%s:%s", host, port)

})

위의 코드를 실행합니다 :

node server.js 
应用实例，访问地址为 http://0.0.0.0:8081

브라우저 액세스 http://127.0.0.1:8081/index.htm 그림과 같이 :

지금 당신은 양식에 데이터를 입력 한 다음 프레젠테이션을 제출할 수 있습니다 :

POST 방법

다음의 예는 우리가 입력을 처리 할 파일 내에서 라우터 server.jsprocess_post를 사용하여 양식을 제출하는 POST 방법을 통해 두 개의 매개 변수를 보여줍니다

다음과 같이 index.htm 파일 코드 수정 :

<html>
<body>
<form action="http://127.0.0.1:8081/process_post" method="POST">
First Name: <input type="text" name="first_name">  <br>

Last Name: <input type="text" name="last_name">
<input type="submit" value="Submit">
</form>
</body>
</html>

다음과 같이 server.js 파일의 코드 수정 :

var express = require('express');
var app = express();
var bodyParser = require('body-parser');

// 创建 application/x-www-form-urlencoded 编码解析
var urlencodedParser = bodyParser.urlencoded({ extended: false })

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

app.get('/index.htm', function (req, res) {
   res.sendFile( __dirname + "/" + "index.htm" );
})

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

   // 输出 JSON 格式
   response = {
       first_name:req.body.first_name,
       last_name:req.body.last_name
   };
   console.log(response);
   res.end(JSON.stringify(response));
})

var server = app.listen(8081, function () {

  var host = server.address().address
  var port = server.address().port

  console.log("应用实例，访问地址为 http://%s:%s", host, port)

})

위의 코드를 실행합니다 :

$ node server.js
应用实例，访问地址为 http://0.0.0.0:8081

브라우저 액세스 http://127.0.0.1:8081/index.htm 그림과 같이 :

지금 당신은 양식에 데이터를 입력 한 다음 프레젠테이션을 제출할 수 있습니다 :

파일 업로드

우리가 POST 방법을 사용하여 파일을 업로드 양식을 만들 아래 양식에 enctype 속성을 multipart / form-data로 설정합니다.

다음과 같이 index.htm 파일 코드 수정 :

<html>
<head>
<title>文件上传表单</title>
</head>
<body>
<h3>文件上传：</h3>
选择一个文件上传: <br />
<form action="/file_upload" method="post" enctype="multipart/form-data">
<input type="file" name="image" size="50" />
<br />
<input type="submit" value="上传文件" />
</form>
</body>
</html>

다음과 같이 server.js 파일의 코드 수정 :

var express = require('express');
var app = express();
var fs = require("fs");

var bodyParser = require('body-parser');
var multer  = require('multer');

app.use(express.static('public'));
app.use(bodyParser.urlencoded({ extended: false }));
app.use(multer({ dest: '/tmp/'}).array('image'));

app.get('/index.htm', function (req, res) {
   res.sendFile( __dirname + "/" + "index.htm" );
})

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

   console.log(req.files[0]);  // 上传的文件信息

   var des_file = __dirname + "/" + req.files[0].originalname;
   fs.readFile( req.files[0].path, function (err, data) {
        fs.writeFile(des_file, data, function (err) {
         if( err ){
              console.log( err );
         }else{
               response = {
                   message:'File uploaded successfully', 
                   filename:req.files[0].originalname
              };
          }
          console.log( response );
          res.end( JSON.stringify( response ) );
       });
   });
})

var server = app.listen(8081, function () {

  var host = server.address().address
  var port = server.address().port

  console.log("应用实例，访问地址为 http://%s:%s", host, port)

})

위의 코드를 실행합니다 :

$ node server.js 
应用实例，访问地址为 http://0.0.0.0:8081

브라우저 액세스 http://127.0.0.1:8081/index.htm 그림과 같이 :

지금 당신은 양식에 데이터를 입력 한 다음 프레젠테이션을 제출할 수 있습니다 :

쿠키 관리

우리는 미들웨어는 Node.js를 서버로 쿠키 정보를 전송 사용할 수 있습니다, 다음 코드는 쿠키 정보가 클라이언트에 의해 전송 출력 :

// express_cookie.js 文件
var express      = require('express')
var cookieParser = require('cookie-parser')

var app = express()
app.use(cookieParser())

app.get('/', function(req, res) {
  console.log("Cookies: ", req.cookies)
})

app.listen(8081)

위의 코드를 실행합니다 :

$ node express_cookie.js

이제 액세스 및 출력 단자 정보를 http://127.0.0.1:8081 볼 수 있습니다, 프리젠 테이션 다음 :

Node.js 코스

Node.js를 익스프레스 프레임 워크

익스프레스 프로필

설치 익스프레스

첫 번째 프레임 워크 인스턴스 익스프레스

요청 및 응답

라우팅

정적 파일

GET 메서드

POST 방법

파일 업로드

쿠키 관리

관련 정보