Nodejs는 웹사이트를 구축합니다-프런트엔드 Q&A-php.cn

웹 기술의 지속적인 발전으로 Node.js는 사람들이 널리 사용하는 개발 언어 중 하나가 되었습니다. Node.js는 Chrome V8 엔진을 기반으로 하는 JavaScript 런타임 환경으로, 빠르고 확장 가능한 웹 애플리케이션을 구축하는 데 적합합니다. 이번 글에서는 Node.js를 이용해 웹사이트를 구축하는 과정을 소개하겠습니다.

1. 환경 설정

시작하기 전에 먼저 환경 설정이 필요합니다. LTS 버전의 Node.js를 사용하시고, 공식 홈페이지(https://nodejs.org/en/)에서 해당 시스템에 맞는 설치 패키지를 다운로드하여 설치하시는 것을 권장합니다.

설치가 완료된 후 Node.js의 환경 변수가 성공적으로 구성되었는지 확인해야 합니다. 명령줄 창을 열고 node -v를 입력합니다. 버전 번호가 나타나면 설치가 성공한 것입니다.

2. HTTP 서버 구축

Node.js는 웹 서버를 생성할 수 있는 http 모듈을 제공합니다. 그 중 createServer() 메소드는 HTTP 서버를 생성하고, listening() 메소드는 지정된 포트와 IP 주소를 수신합니다.

코드는 다음과 같습니다:

const http = require('http');

const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
    res.statusCode = 200;
    res.setHeader('Content-Type', 'text/plain');
    res.end('Hello World!
');
});

server.listen(port, hostname, () => {
    console.log(`Server running at http://${hostname}:${port}/`);
});

로그인 후 복사

위 코드는 로컬 포트 3000을 수신하는 간단한 HTTP 서버를 생성합니다. 서버의 페이지에 액세스하려면 브라우저에 http://127.0.0.1:3000/을 입력하세요. 페이지 내용은 Hello World!입니다.

3. 프로세스 라우팅

단순히 Hello World를 클라이언트에 전송하면! 메시지를 보낸 다음에는 HTTP 서버를 사용하는 것으로 충분합니다. 그러나 실제 개발에서는 더 복잡한 요청 응답 시나리오에 직면하게 되며 라우팅을 처리해야 합니다.

이 예에서는 /home과 /about이라는 두 개의 페이지가 있다고 가정합니다. 이 두 페이지에 대한 액세스를 요청할 때 다른 처리가 필요합니다. 따라서 HTTP 서버에 라우팅 처리를 추가할 수 있습니다.

코드는 다음과 같습니다.

const http = require('http');
const url = require('url');

const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
    const uri = url.parse(req.url).pathname;
    if (uri === '/home') {
        res.statusCode = 200;
        res.setHeader('Content-Type', 'text/plain');
        res.end('Welcome to the homepage!
');
    } else if (uri === '/about') {
        res.statusCode = 200;
        res.setHeader('Content-Type', 'text/plain');
        res.end('About the website!
');
    } else {
        res.statusCode = 404;
        res.setHeader('Content-Type', 'text/plain');
        res.end('404 Not Found
');
    }
});

server.listen(port, hostname, () => {
    console.log(`Server running at http://${hostname}:${port}/`);
});

로그인 후 복사

위 코드에서는 Node.js에 내장된 URL 모듈을 사용하여 라우팅 처리를 위해 요청된 URL 주소를 경로명으로 구문 분석합니다. 요청된 경로 이름이 /home이면 서버는 "홈페이지에 오신 것을 환영합니다!"를 반환하고, 요청된 경로 이름이 /about이면 서버는 "웹 사이트 정보!"를 반환하며, 요청된 경로 이름이 존재하지 않으면 서버는 404 Not을 반환합니다. 설립하다 .

4. 템플릿 엔진 사용

실제 개발 과정에서 템플릿 엔진을 사용하면 개발 효율성을 크게 높일 수 있습니다. 일반적으로 사용되는 템플릿 엔진에는 ejs, 핸들바, 옥 등이 포함됩니다. 이 예에서는 페이지 렌더링에 ejs 템플릿 엔진이 사용됩니다.

먼저 npm을 통해 ejs 모듈을 설치합니다.

npm install ejs --save

로그인 후 복사

HTTP 서버를 변경하고 템플릿 엔진을 사용하여 HTML 페이지를 렌더링합니다.

const http = require('http');
const url = require('url');
const ejs = require('ejs');
const fs = require('fs');

const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
    const uri = url.parse(req.url).pathname;

    if (uri === '/home') {
        fs.readFile('./views/home.ejs', 'utf8', (err, data) => {
            if (err) {
                console.log(err);
                res.statusCode = 404;
                res.setHeader('Content-Type', 'text/plain');
                res.end('File not found!
');
            } else {
                res.statusCode = 200;
                res.setHeader('Content-Type', 'text/html');
                const template = ejs.compile(data);
                const html = template({title: 'Home Page', message: 'Welcome to the homepage!'});
                res.end(html);
            }
        });
    } else if (uri === '/about') {
        fs.readFile('./views/about.ejs', 'utf8', (err, data) => {
            if (err) {
                console.log(err);
                res.statusCode = 404;
                res.setHeader('Content-Type', 'text/plain');
                res.end('File not found!
');
            } else {
                res.statusCode = 200;
                res.setHeader('Content-Type', 'text/html');
                const template = ejs.compile(data);
                const html = template({title: 'About Page', message: 'About the website!'});
                res.end(html);
            }
        });
    } else {
        res.statusCode = 404;
        res.setHeader('Content-Type', 'text/plain');
        res.end('404 Not Found
');
    }
});

server.listen(port, hostname, () => {
    console.log(`Server running at http://${hostname}:${port}/`);
});

로그인 후 복사

위 코드에서 fs 모듈은 템플릿 파일을 읽는 데 사용됩니다. ejs 모듈은 템플릿 파일을 렌더링하는 데 사용됩니다. 생성된 HTML 페이지를 클라이언트에 반환합니다.

5. 정적 파일 사용

실제 개발에서는 일반적으로 이미지, CSS 파일, JavaScript 파일 등과 같은 정적 파일이 사용됩니다. Node.js는 정적 파일에 대한 요청을 처리하는 데 사용할 수 있는 정적 파일 서비스를 제공합니다.

코드는 다음과 같습니다.

const http = require('http');
const url = require('url');
const ejs = require('ejs');
const fs = require('fs');
const path = require('path');

const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
    const uri = url.parse(req.url).pathname;
    const filename = path.join(process.cwd(), uri);

    fs.exists(filename, (exists) => {
        if (!exists) {
            res.statusCode = 404;
            res.setHeader('Content-Type', 'text/plain');
            res.end('404 Not Found
');
            return;
        }

        if (fs.statSync(filename).isDirectory()) {
            filename += '/index.html';
        }

        fs.readFile(filename, 'binary', (err, file) => {
            if (err) {
                res.statusCode = 500;
                res.setHeader('Content-Type', 'text/plain');
                res.end(err + '
');
                return;
            }

            res.statusCode = 200;
            const extname = path.extname(filename);
            res.setHeader('Content-Type', mimeTypes[extname] || 'text/plain');
            res.write(file, 'binary');
            res.end();
        });
    });
});

server.listen(port, hostname, () => {
    console.log(`Server running at http://${hostname}:${port}/`);
});

로그인 후 복사

위 코드에서 fs 모듈은 요청한 파일이 존재하는지 확인하는 데 사용되며, path 모듈은 경로를 처리하는 데 사용되며, mimeTypes는 파일 유형을 정의하는 데 사용됩니다. 요청한 파일이 없으면 404 Not Found가 반환되고, 요청이 폴더인 경우 기본적으로 파일을 성공적으로 읽었으면 폴더의 index.html 파일이 요청되며 Content-Type이 반환됩니다. 헤더와 응답이 동시에 설정됩니다.

위의 작업을 통해 우리는 Node.js를 이용한 웹사이트 구축에 성공했고 기본적인 라우팅 처리와 정적 파일 서비스를 구현했습니다. 더 많은 연구와 연습을 통해 우리는 더 복잡한 웹 사이트를 만들고 데이터베이스 운영, 요청 에이전트 등과 같은 더 많은 기능을 구현할 수 있습니다.

위 내용은 Nodejs는 웹사이트를 구축합니다의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!