>웹 프론트엔드 >JS 튜토리얼 >Express.js 마스터하기: 심층 분석

Express.js 마스터하기: 심층 분석

Susan Sarandon
Susan Sarandon원래의
2025-01-05 06:46:40373검색

Mastering Express.js: A Deep Dive

Express는 Node.js에서 매우 일반적으로 사용되는 웹 서버 애플리케이션 프레임워크입니다. 기본적으로 프레임워크는 특정 규칙을 준수하는 코드 구조이며 두 가지 주요 특징이 있습니다.

  • API를 캡슐화하여 개발자가 비즈니스 코드 작성에 더 집중할 수 있도록 합니다.
  • 공정 및 표준사양을 확립하였습니다.

Express 프레임워크의 핵심 기능은 다음과 같습니다.

  • 다양한 HTTP 요청에 응답하도록 미들웨어를 구성할 수 있습니다.
  • 다양한 유형의 HTTP 요청 작업을 실행하기 위한 라우팅 테이블을 정의합니다.
  • HTML 페이지의 동적 렌더링을 달성하기 위해 템플릿에 매개변수 전달을 지원합니다.

이 기사에서는 Express가 간단한 LikeExpress 클래스를 구현하여 미들웨어 등록, 다음 메커니즘 및 경로 처리를 구현하는 방법을 분석합니다.

익스프레스 분석

먼저 두 가지 Express 코드 예제를 통해 제공되는 기능을 살펴보겠습니다.

익스프레스 공식 홈페이지 Hello World 예시

const express = require('express');
const app = express();
const port = 3000;

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

app.listen(port, () => {
    console.log(`Example app listening at http://localhost:${port}`);
});

항목 파일 app.js 분석

다음은 express-generator 스캐폴딩에 의해 생성된 Express 프로젝트의 항목 파일 app.js의 코드입니다.

// Handle errors caused by unmatched routes
const createError = require('http-errors');
const express = require('express');
const path = require('path');

const indexRouter = require('./routes/index');
const usersRouter = require('./routes/users');

// `app` is an Express instance
const app = express();

// View engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

// Parse JSON format data in post requests and add the `body` field to the `req` object
app.use(express.json());
// Parse the urlencoded format data in post requests and add the `body` field to the `req` object
app.use(express.urlencoded({ extended: false }));

// Static file handling
app.use(express.static(path.join(__dirname, 'public')));

// Register top-level routes
app.use('/', indexRouter);
app.use('/users', usersRouter);

// Catch 404 errors and forward them to the error handler
app.use((req, res, next) => {
    next(createError(404));
});

// Error handling
app.use((err, req, res, next) => {
    // Set local variables to display error messages in the development environment
    res.locals.message = err.message;
    // Decide whether to display the full error according to the environment variable. Display in development, hide in production.
    res.locals.error = req.app.get('env') === 'development'? err : {};
    // Render the error page
    res.status(err.status || 500);
    res.render('error');
});

module.exports = app;

위의 두 코드 세그먼트에서 Express 인스턴스 앱에는 주로 세 가지 핵심 메소드가 있음을 알 수 있습니다.

  1. app.use([path,] callback [, callback...]): 미들웨어를 등록하는 데 사용됩니다. 요청 경로가 설정된 규칙과 일치하면 해당 미들웨어 기능이 실행됩니다.
    • 경로: 미들웨어 기능을 호출하기 위한 경로를 지정합니다.
    • 콜백: 콜백 함수는 다양한 형태를 취할 수 있습니다. 단일 미들웨어 기능, 쉼표로 구분된 일련의 미들웨어 기능, 일련의 미들웨어 기능 또는 위의 모든 기능의 조합일 수 있습니다.
  2. app.get() 및 app.post(): 이 메소드는 미들웨어 등록에 있어서도 use()와 유사합니다. 그러나 HTTP 요청 메서드에 바인딩되어 있습니다. 해당 HTTP 요청 방식을 사용해야 해당 미들웨어가 등록됩니다.
  3. app.listen(): httpServer를 생성하고 server.listen()에 필요한 매개변수를 전달하는 역할을 담당합니다.

코드 구현

Express 코드의 기능 분석을 바탕으로 우리는 Express 구현이 다음 세 가지 사항에 중점을 두고 있음을 알고 있습니다.

  • 미들웨어 기능 등록 과정
  • 미들웨어 기능 중 핵심 Next 메커니즘
  • 경로 매칭에 중점을 둔 경로 처리

이러한 점을 바탕으로 아래에 간단한 LikeExpress 클래스를 구현하겠습니다.

1. 클래스의 기본 구조

먼저 이 클래스가 구현해야 하는 주요 메소드를 명확히 합니다.

  • use(): 일반 미들웨어 등록을 구현합니다.
  • get() 및 post(): HTTP 요청과 관련된 미들웨어 등록을 구현합니다.
  • Listen(): 기본적으로 httpServer의 Listen() 함수입니다. 이 클래스의 Listen() 함수에서는 httpServer가 생성되고, 매개변수가 전달되고, 요청이 수신되고, 콜백 함수(req, res) => {}가 실행됩니다.

네이티브 노드 httpServer의 사용법을 검토하세요.

const express = require('express');
const app = express();
const port = 3000;

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

app.listen(port, () => {
    console.log(`Example app listening at http://localhost:${port}`);
});

따라서 LikeExpress 클래스의 기본 구조는 다음과 같습니다.

// Handle errors caused by unmatched routes
const createError = require('http-errors');
const express = require('express');
const path = require('path');

const indexRouter = require('./routes/index');
const usersRouter = require('./routes/users');

// `app` is an Express instance
const app = express();

// View engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

// Parse JSON format data in post requests and add the `body` field to the `req` object
app.use(express.json());
// Parse the urlencoded format data in post requests and add the `body` field to the `req` object
app.use(express.urlencoded({ extended: false }));

// Static file handling
app.use(express.static(path.join(__dirname, 'public')));

// Register top-level routes
app.use('/', indexRouter);
app.use('/users', usersRouter);

// Catch 404 errors and forward them to the error handler
app.use((req, res, next) => {
    next(createError(404));
});

// Error handling
app.use((err, req, res, next) => {
    // Set local variables to display error messages in the development environment
    res.locals.message = err.message;
    // Decide whether to display the full error according to the environment variable. Display in development, hide in production.
    res.locals.error = req.app.get('env') === 'development'? err : {};
    // Render the error page
    res.status(err.status || 500);
    res.render('error');
});

module.exports = app;

2. 미들웨어 등록

app.use([path,] callback [, callback...])에서 미들웨어가 함수의 배열일 수도 있고 단일 함수일 수도 있음을 알 수 있습니다. 구현을 단순화하기 위해 미들웨어를 함수 배열로 균일하게 처리합니다. LikeExpress 클래스에서 use(), get() 및 post() 세 가지 메소드는 모두 미들웨어 등록을 구현할 수 있습니다. 트리거된 미들웨어만 요청 방법이 다르기 때문에 다릅니다. 그래서 우리는 다음을 고려합니다:

  • 일반 미들웨어 등록 기능을 추상화합니다.
  • 다양한 요청에 해당하는 미들웨어를 저장하기 위해 이 세 가지 방법에 대한 미들웨어 기능 배열을 만듭니다. use()는 모든 요청에 ​​대한 일반적인 미들웨어 등록 방법이므로 use() 미들웨어를 저장하는 배열은 get() 및 post() 배열의 합집합입니다.

미들웨어 대기열 배열

미들웨어 배열은 클래스의 메소드에 의해 쉽게 접근할 수 있도록 공개 영역에 배치되어야 합니다. 그래서 constructor() 생성자 함수에 미들웨어 배열을 넣습니다.

const http = require("http");
const server = http.createServer((req, res) => {
    res.end("hello");
});
server.listen(3003, "127.0.0.1", () => {
    console.log("node service started successfully");
});

미들웨어 등록 기능

미들웨어 등록은 해당 미들웨어 배열에 미들웨어를 저장하는 것을 의미합니다. 미들웨어 등록 기능은 수신 매개변수를 구문 분석해야 합니다. 첫 번째 파라미터는 라우트일 수도 있고 미들웨어일 수도 있으므로 먼저 라우트인지 여부를 판단할 필요가 있습니다. 그렇다면 그대로 출력하십시오. 그렇지 않으면 기본값은 루트 경로이고 나머지 미들웨어 매개변수를 배열로 변환합니다.

const http = require('http');

class LikeExpress {
    constructor() {}

    use() {}

    get() {}

    post() {}

    // httpServer callback function
    callback() {
        return (req, res) => {
            res.json = function (data) {
                res.setHeader('content-type', 'application/json');
                res.end(JSON.stringify(data));
            };
        };
    }

    listen(...args) {
        const server = http.createServer(this.callback());
        server.listen(...args);
    }
}

module.exports = () => {
    return new LikeExpress();
};

use(), get() 및 post() 구현

일반 미들웨어 등록 함수인 Register()를 이용하면 use(), get(), post() 구현이 용이하며 해당 배열에 미들웨어를 저장하기만 하면 됩니다.

const express = require('express');
const app = express();
const port = 3000;

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

app.listen(port, () => {
    console.log(`Example app listening at http://localhost:${port}`);
});

3. 경로 매칭 처리

등록 함수의 첫 번째 매개변수가 경로인 경우 요청 경로가 경로와 일치하거나 해당 하위 경로인 경우에만 해당 미들웨어 기능이 트리거됩니다. 따라서 후속 callback() 함수가 실행될 요청 메서드 및 요청 경로에 따라 일치하는 경로의 미들웨어 배열을 추출하는 경로 일치 함수가 필요합니다.

// Handle errors caused by unmatched routes
const createError = require('http-errors');
const express = require('express');
const path = require('path');

const indexRouter = require('./routes/index');
const usersRouter = require('./routes/users');

// `app` is an Express instance
const app = express();

// View engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

// Parse JSON format data in post requests and add the `body` field to the `req` object
app.use(express.json());
// Parse the urlencoded format data in post requests and add the `body` field to the `req` object
app.use(express.urlencoded({ extended: false }));

// Static file handling
app.use(express.static(path.join(__dirname, 'public')));

// Register top-level routes
app.use('/', indexRouter);
app.use('/users', usersRouter);

// Catch 404 errors and forward them to the error handler
app.use((req, res, next) => {
    next(createError(404));
});

// Error handling
app.use((err, req, res, next) => {
    // Set local variables to display error messages in the development environment
    res.locals.message = err.message;
    // Decide whether to display the full error according to the environment variable. Display in development, hide in production.
    res.locals.error = req.app.get('env') === 'development'? err : {};
    // Render the error page
    res.status(err.status || 500);
    res.render('error');
});

module.exports = app;

그런 다음 httpServer의 콜백 함수 callback()에서 실행해야 하는 미들웨어를 추출합니다.

const http = require("http");
const server = http.createServer((req, res) => {
    res.end("hello");
});
server.listen(3003, "127.0.0.1", () => {
    console.log("node service started successfully");
});

4. 차기 메커니즘의 구현

Express 미들웨어 함수의 매개변수는 req, res 및 next이며, 여기서 next는 함수입니다. 이를 호출해야만 ES6 Generator의 next()와 유사하게 미들웨어 기능이 순서대로 실행될 수 있습니다. 구현 시 다음 요구 사항에 따라 next() 함수를 작성해야 합니다.

  • 미들웨어 큐 배열에서 매번 하나씩 미들웨어를 순서대로 추출합니다.
  • 추출된 미들웨어에 next() 함수를 전달합니다. 미들웨어 배열은 공용이므로 next()가 실행될 때마다 배열의 첫 번째 미들웨어 함수를 꺼내어 실행함으로써 미들웨어를 순차적으로 실행하는 효과를 얻습니다.
const http = require('http');

class LikeExpress {
    constructor() {}

    use() {}

    get() {}

    post() {}

    // httpServer callback function
    callback() {
        return (req, res) => {
            res.json = function (data) {
                res.setHeader('content-type', 'application/json');
                res.end(JSON.stringify(data));
            };
        };
    }

    listen(...args) {
        const server = http.createServer(this.callback());
        server.listen(...args);
    }
}

module.exports = () => {
    return new LikeExpress();
};

익스프레스 코드

constructor() {
    // List of stored middleware
    this.routes = {
        all: [], // General middleware
        get: [], // Middleware for get requests
        post: [], // Middleware for post requests
    };
}

Leapcell: 웹 호스팅, 비동기 작업 및 Redis를 위한 차세대 서버리스 플랫폼

Mastering Express.js: A Deep Dive

마지막으로 Express 배포에 매우 적합한 플랫폼을 소개하겠습니다: Leapcell.

Leapcell은 다음과 같은 특징을 지닌 서버리스 플랫폼입니다.

1. 다국어 지원

  • JavaScript, Python, Go 또는 Rust를 사용하여 개발하세요.

2. 무료로 무제한 프로젝트 배포

  • 사용량에 대해서만 비용을 지불합니다. 요청이나 요금이 부과되지 않습니다.

3. 탁월한 비용 효율성

  • 유휴 비용 없이 사용한 만큼만 지불하세요.
  • 예: $25는 평균 응답 시간 60ms에서 694만 개의 요청을 지원합니다.

4. 간소화된 개발자 경험

  • 손쉬운 설정을 위한 직관적인 UI.
  • 완전 자동화된 CI/CD 파이프라인 및 GitOps 통합.
  • 실행 가능한 통찰력을 위한 실시간 측정항목 및 로깅.

5. 손쉬운 확장성과 고성능

  • 높은 동시성을 쉽게 처리할 수 있는 자동 크기 조정.
  • 운영 오버헤드가 전혀 없습니다. 구축에만 집중하세요.

문서에서 더 자세히 알아보세요!

Leapcell 트위터: https://x.com/LeapcellHQ

위 내용은 Express.js 마스터하기: 심층 분석의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.