ExpressJS에서 서버 응답을 처리하는 방법 - 간단한 방법!
65946 단어 nodehttpjavascriptexpress
소개하다.
HTTP 상태 코드가 너무 많아요.만약 네가 나처럼 된다면, 너는 이 비밀번호들을 기억하기가 매우 어렵다는 것을 발견할 것이다.다행히도, 우리는 보통 모든 HTTP 상태 코드를 사용하지 않는다.어떤 것은 사람들이 자주 사용하는 것이다. 우리는 우리의 지식을 우리가 필요로 하는 범위 내에 제한할 수 있다.
만약 우리가 코드만 기억할 수 있다면 좋겠지만, 이 코드들은 의미가 있다. (HTTP의 경우)따라서 코드만 기억하는 것은 충분하지 않다. 코드의 의미와 언제 사용하는지 기억해야 한다.이 코드의 의미는 표준적인 의미이기 때문에 HTTP 표준을 따르는 API를 개발하려면 이 코드를 정확하게 사용해야 한다. 그렇지 않으면 다른 사람들이 이해하지 못하거나 사용할 수 없는 API를 만들 것이다.
만약 방법이 있다면, 우리는 API 응답을 만들 수 있고, 어떤 적합한 HTTP 코드를 사용할지 걱정할 필요가 없다. 그러면 좋지 않겠는가?그럴 거야!다행히도, 몇몇 모듈은 우리가 상하문에 따라 어떤 코드를 사용할지 결정하는 데 도움을 줄 수 있다.그것들은 우리로 하여금 API 클라이언트가 받기를 원하는 응답 유형을 더욱 명확하게 표현할 수 있게 한다. (스스로 HTTP 코드를 선택하지 않아도 모듈은 거의 항상 우리를 위해 정확한 응답을 선택할 것이다.)
본고에서 우리는 ExpressJS(과NodeJS)에서 서버 응답을 처리하는 더욱 간단한 방법을 배울 것이다.사용하는 모듈의 이름은 express-response-helper입니다.
At the time of writing this article, this module was a relatively new module but it's possible that by the time you read this, the module might have grown because it gets the job done and it's very easy to configure and use.
빠른 응답 지원 사용
express response helperdocumentation는 이 모듈에 공평한 역할을 한다.그것은 예시를 통해 모듈의 각 방면을 포괄했다.본고에서 우리는 진정한expressjs 응용 프로그램에서 이 모듈을 어떻게 사용하는지 이해할 것이다.즉, 본고는 단지 당신에게 공부를 시작하게 할 뿐입니다. 더 많은 정보를 필요로 할 때 문서는 다음 방향입니다.
더 큰 프로젝트에서 이 모듈을 어떻게 사용하는지 알 수 있는 아주 간단한 프로그램을 만들 것입니다.Github 에서 프로그램의 원본 코드를 볼 수 있습니다.
I assume you have NodeJS and NPM installed. If you don't have those, you'll have to install them before proceeding. I used Node v12.21.0 and NPM v7.12.0 but later versions should work just fine. The editor used is Visual Studio Code but of course you can use your favorite IDE.
응용 프로그램 만들기
프로그램에 새 폴더를 만들고 편집기로 폴더를 엽니다.
터미널을 열고 다음 명령을 실행합니다.
npm init -y
이것은 우리의 가방을 만들 것입니다.우리 json 파일:
{
"name": "express-response-helper-demo",
"version": "1.0.0",
"main": "index.js",
"license": "MIT"
}
새 폴더를 만들고 이름을 src로 지정합니다.여기서 새 index.js 파일을 만듭니다.현재 상태로 유지:
패키지를 수정합니다.제이슨은 이렇게 보인다.
{
"name": "express-response-helper-demo",
"version": "1.0.0",
"main": "src/index.js",
"license": "MIT",
"scripts": {
"start": "node src/index.js"
}
}
We updated the path to the main source file and also added a script command for starting the application.
종속성 추가
우리는 express 모듈이 필요합니다. 물론 이 프로그램도 express-response-helper 모듈이 필요합니다.그것들을 추가합시다.
터미널을 열고 다음 명령을 실행합니다.
npm install --save express express-response-helper
명령이 실행되면 패키지는 삭제됩니다.이제 json 파일은 다음과 같습니다.
{
"name": "express-response-helper-demo",
"version": "1.0.0",
"main": "src/index.js",
"license": "MIT",
"scripts": {
"start": "node src/index.js"
},
"dependencies": {
"express": "^4.17.1",
"express-response-helper": "^1.2.0"
}
}
Note: depending on when you read this article, these versions will likely change. If some part of this tutorial doesn't work because of version differences please consult the official documentations of the module to learn what changed or you can simply set the versions to match the exact one used in this article.
For this article, the version of express-response-helper used is v1.2.0. Later versions should work too.
방해하지 마라, 우리는 모두 준비가 다 되었다!
모듈 사용
src/index.js를 열고 다음을 입력합니다.
const express = require('express');
const responseHelper = require('express-response-helper');
const app = express();
// Configure the middleware
app.use(responseHelper.helper());
// Define routes
app.get('/', (req, res) => {
res.respond({ message: 'Hello, World!' });
});
app.listen(3000, () => {
console.log('Server running...');
});
우리 방금 뭐 했지?
우리는 requiring()express에서 시작하여 API 서버를 실행할 것입니다.그리고 우리는 빠른 응답 조수 모듈을 도입했다.require('express-response-helper'); 대상을 되돌려줍니다.이 대상은 두 가지 속성이 있습니다: helper () 는 함수이고,responseCodes는 미리 정의된 HTTP 상태 코드를 가진 대상입니다.
우리는 이 대상을 responseHelper 변수에 저장할 것이다.
다음에 우리는 express() 함수를 호출하여 app 변수에 저장한다.그리고 우리는 중간부품을 등록한다.이것이 바로 일이 재미있어지는 곳이다.responseHelper.helper()express 대상에 추가할 수 있는 중간부품 함수를 되돌려줍니다.app.use(responseHelper.helper())를 호출하여 저희를 위해 중간부품을 등록합니다.
const app = express();
// Configure the middleware
app.use(responseHelper.helper());
It is important we configure the middleware before defining routes. Routes that are defined before registering the middleware won't have access to the functions that the helper adds to our res variable!
그런 다음 코스를 정의합니다.
// Define routes
app.get('/', (req, res) => {
res.respond({ message: 'Hello, World!' });
});
"/"에 대한 라우트를 정의합니다.route 콜백 함수에서, 우리는 우리가 추가한 respond() 함수인express response helper를 사용하여 응답을 보냅니다.응답에 대한 상태 코드를 지정할 필요가 없습니다.기본적으로, 조수 중간부품은 200을 보낼 것입니다. 이것은 이 예에서 사용할 정확한 코드입니다.또한 응답 본문을 자동으로 JSON으로 변환합니다.
이제 다음 명령을 실행하여 응용 프로그램을 실행합니다.
npm start
이것은 터미널에 다음과 같은 내용을 표시해야 합니다.
이렇게 하면 우리 서버는 정상적으로 운행할 수 있다.브라우저 탭을 열고 http:localhost:3000를 입력합니다.너는 반드시 이런 물건을 보아야 한다.
보시다시피, 조수 중간부품이 예상대로 작동하고 있습니다.우리는 단지 표면에 닿았을 뿐이다.더 복잡한 예를 보자. 더 많은 노선이 있다.
API 확장
우리들은 더욱 실제적인 예를 세웁시다.간단하게 보기 위해서, 우리는 어떠한 진정한 데이터베이스도 사용하지 않을 것이다.우리의 목표는 데이터가 어디에서 왔든지 상관없이 helper 중간부품이 서로 다른 응답 유형에 어떻게 적용되는지 이해하는 것이다.src/index.js를 켜고 경로 정의 전에 이러한 보조 변수와 기능을 추가합니다.
// Create a database for users
const database = [
{
username: 'user1',
email: '[email protected]',
password: 'test1',
}
];
// A function for validating email addresses
const validEmail = email => {
const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(String(email).toLowerCase());
};
// A function to check if a username is unique
const isUsernameUnique = username => {
let isUnique = true;
database.forEach(user => {
if (user.username === username)
isUnique = false;
});
return isUnique;
};
// A function to check if an email is unique
const isEmailUnique = email => {
let isUnique = true;
database.forEach(user => {
if (user.email === email.toLowerCase())
isUnique = false;
});
return isUnique;
};
// A function that returns a the index of a user data given the username
const findUser = username => {
return database.findIndex(user => {
return user.username === username;
});
};
다음은 API에 전달된 데이터를 분석하는 데 도움을 줄 내장된express 중간부품을 추가합니다.구성 지원 중간부품 아래에 다음을 추가합니다.
app.use(express.json());
마지막으로 이러한 새 라우팅 정의를 추가하여 API(이전 라우팅 삭제)를 완료합니다.
// Define routes
app.get('/', (req, res) => {
res.respondNoContent();
});
// To add a user
app.post('/user', (req, res) => {
const body = req.body;
if (body.username && body.email && body.password) {
// Make sure the username and email is unique
if (!isUsernameUnique(body.username)) {
// Duplicate username
res.failValidationError('username is taken.');
return;
}
if (!isEmailUnique(body.email)) {
// Duplicate email
res.failValidationError('email is taken.');
return;
}
// Insert the user
const user = {
username: body.username,
email: body.email.toLowerCase(),
password: body.password,
};
// Add to the database
database.push(user);
// Return a response confirming creation
res.respondCreated('User Account Created!');
}
else {
// If some or all the required data is not provided, return a failed response
res.failValidationError('Please provide all required data!');
}
});
// To update a user
app.put('/user/:username', (req, res) => {
// Find the user
const index = findUser(req.params.username);
const body = req.body;
if (index !== -1) {
if (body.email) {
// Get the user
const user = database[index];
// If the email equals the current one, do nothing
if (body.email === user.email) {
// Return a response confirming update
res.respondUpdated('User account updated.');
}
else {
// Make sure the email is unqiue
if (!isEmailUnique(body.email)) {
// Duplicate email
res.failValidationError('email is taken.');
return;
}
// Update the email
user.email = body.email;
// Return a response confirming update
res.respondUpdated('User account updated.');
}
}
else {
// Return a failed response
res.failValidationError('Please provide all required data!');
}
}
else {
// User not found.
res.failNotFound('No user with such username exists!');
}
});
// To remove a user
app.delete('/user/:username', (req, res) => {
// Find the user
const index = findUser(req.params.username);
if (index !== -1) {
// Remove the user
database.splice(index);
// Return a response confirming removal
res.respondDeleted('User removed!');
}
else {
// User not found.
res.failNotFound('No user with such username exists!');
}
});
// To authenticate a user
app.post('/login', (req, res) => {
const body = req.body;
if (body.username && body.password) {
// Make sure the username and email is unique
// Find the user
const index = findUser(body.username);
if (index !== -1) {
// Get the user
const user = database[index];
// Authenticate
if (user.password === body.password) {
// Authenticated, return basic user data
res.respond({ username: user.username, email: user.email });
}
else {
// return a response indicating that access is denied
res.failUnathorized('Invalid password!');
}
}
else {
// User not found.
res.failNotFound('No user with such username exists!');
}
}
else {
// If some or all the required data is not provided, return a failed response
res.failValidationError('Please provide all required data!');
}
});
기본 CRUD 작업을 수행할 경로를 정의했습니다.이러한 내용을 추가한 경우src/index.js는 다음과 같습니다.
const express = require('express');
const responseHelper = require('express-response-helper');
const app = express();
// Create a database for users
const database = [
{
username: 'user1',
email: '[email protected]',
password: 'test1',
}
];
// A function for validating email addresses
const validEmail = email => {
const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(String(email).toLowerCase());
};
// A function to check if a username is unique
const isUsernameUnique = username => {
let isUnique = true;
database.forEach(user => {
if (user.username === username)
isUnique = false;
});
return isUnique;
};
// A function to check if an email is unique
const isEmailUnique = email => {
let isUnique = true;
database.forEach(user => {
if (user.email === email.toLowerCase())
isUnique = false;
});
return isUnique;
};
// A function that returns a the index of a user data given the username
const findUser = username => {
return database.findIndex(user => {
return user.username === username;
});
};
// Configure the middlewares
app.use(responseHelper.helper());
app.use(express.json());
// Define routes
app.get('/', (req, res) => {
res.respondNoContent();
});
// To add a user
app.post('/user', (req, res) => {
const body = req.body;
if (body.username && body.email && body.password) {
// Make sure the username and email is unique
if (!isUsernameUnique(body.username)) {
// Duplicate username
res.failValidationError('username is taken.');
return;
}
if (!isEmailUnique(body.email)) {
// Duplicate email
res.failValidationError('email is taken.');
return;
}
// Insert the user
const user = {
username: body.username,
email: body.email.toLowerCase(),
password: body.password,
};
// Add to the database
database.push(user);
// Return a response confirming creation
res.respondCreated('User Account Created!');
}
else {
// If some or all the required data is not provided, return a failed response
res.failValidationError('Please provide all required data!');
}
});
// To update a user
app.put('/user/:username', (req, res) => {
// Find the user
const index = findUser(req.params.username);
const body = req.body;
if (index !== -1) {
if (body.email) {
// Get the user
const user = database[index];
// If the email equals the current one, do nothing
if (body.email === user.email) {
// Return a response confirming update
res.respondUpdated('User account updated.');
}
else {
// Make sure the email is unqiue
if (!isEmailUnique(body.email)) {
// Duplicate email
res.failValidationError('email is taken.');
return;
}
// Update the email
user.email = body.email;
// Return a response confirming update
res.respondUpdated('User account updated.');
}
}
else {
// Return a failed response
res.failValidationError('Please provide all required data!');
}
}
else {
// User not found.
res.failNotFound('No user with such username exists!');
}
});
// To remove a user
app.delete('/user/:username', (req, res) => {
// Find the user
const index = findUser(req.params.username);
if (index !== -1) {
// Remove the user
database.splice(index);
// Return a response confirming removal
res.respondDeleted('User removed!');
}
else {
// User not found.
res.failNotFound('No user with such username exists!');
}
});
// To authenticate a user
app.post('/login', (req, res) => {
const body = req.body;
if (body.username && body.password) {
// Make sure the username and email is unique
// Find the user
const index = findUser(body.username);
if (index !== -1) {
// Get the user
const user = database[index];
// Authenticate
if (user.password === body.password) {
// Authenticated, return basic user data
res.respond({ username: user.username, email: user.email });
}
else {
// return a response indicating that access is denied
res.failUnathorized('Invalid password!');
}
}
else {
// User not found.
res.failNotFound('No user with such username exists!');
}
}
else {
// If some or all the required data is not provided, return a failed response
res.failValidationError('Please provide all required data!');
}
});
app.listen(3000, () => {
console.log('Server running...');
});
이전과 마찬가지로 다음 명령을 사용하여 서버를 시작합니다.
npm start
서버가 실행을 시작해야 합니다.터미널을 죽이지 않도록 하세요. 우리는 다음에 터미널과 상호작용을 할 것입니다.
브라우저는 GET 요청만 보낼 수 있습니다. POST, PUT, DELETE 등 다른 종류의 요청을 보낼 수 있어야 합니다.이를 위해 API를 사용할 별도의 클라이언트 코드를 만듭니다.우리는 curl와 같은 도구를 사용할 수 있지만 명령줄부터 테스트를 시작하여 진정한 클라이언트가 우리의 클라이언트를 어떻게 사용하는지 봅시다.
우선axios을 추가합니다.우리는 그것을 사용하여 서버에 요청을 보낼 것이다.새 터미널을 열고 다음 명령을 실행합니다.
npm install --save axios
현재 client.js 폴더에 새 파일을 만듭니다src.파일에 다음을 추가합니다.
const axiosModule = require('axios');
const base_url = 'http://localhost:3000/';
const axios = axiosModule.default.create({
baseURL: base_url,
validateStatus: (status) => {
return status >= 200 && status < 500;
},
});
이것은 axios를 설정할 것입니다.우리는 base_url를 API 위치로 설정합니다.우리는 또한 axios에 200에서 500 사이의 HTTP 상태 코드를 스스로 처리할 수 있도록 허락해 달라고 말했다.
마지막으로 패키지의 "scripts" 속성을 수정합니다.json 파일:
"scripts": {
"start": "node src/index.js",
"client": "node src/client.js"
},
클라이언트 코드를 실행할 수 있는 명령 (client 을 추가했습니다.이제 요청을 보낼 수 있습니다!src/client.js를 열고 현재 컨텐츠 아래에 이 코드를 추가합니다.
// Create a user (with valid data)
axios.post('user', {
username: 'user2',
email: '[email protected]',
password: 'test2',
})
.then(res => {
console.log({
code: res.status,
response: res.data,
})
})
.catch((error) => console.log(error));
POST 요청이 /user 엔드포인트로 전송됩니다.우리가 응답을 받았을 때, 우리는 HTTP 상태 코드와 받은 데이터를 기록하기만 하면 된다.
express 서버의 터미널이 실행 중인지 확인하십시오.이제 새 터미널을 열고 다음 명령을 실행합니다.
npm run client
만일 모든 것이 순조롭다면, 당신은 반드시 보게 될 것입니다.
위대하다API는 잘 작동하고 있습니다.지금 노선의 원본 코드를 확인하면post ((/user 는 사용자가 생성되었음을 확인하기 위해 어떤 상태 코드를 보내야 하는지 알 필요가 없습니다. 응답을 원하는지 알 수 있습니다.이게 바로 스피드 리액션 조수의 힘!
기억을 새로 고치려면 응답을 보내는 코드 비트가 다음과 같습니다.
res.respondCreated('User Account Created!');
우리의 API 프로그래밍은 중복을 방지하기 위해서이기 때문에, 두 번에 같은 사용자를 추가하는 것을 허용하지 않습니다.서버의 터미널이 계속 실행 중인지 확인하고 명령을 다시 실행합니다: npm run client.
다음과 같은 출력을 받아야 합니다.
현재 사용자 이름을 추가하려고 하기 때문에 출력이 다르다.express response helper가 반환하는 응답 유형에 주의하십시오.
{
status: 400,
error: 400,
messages: 'username is taken.'
}
이것은 잘못된 대상이다.모든 fail ed 요청에 대해 조수는 이 값을 되돌려줍니다.그것은 잘못된 상태와 설명을 명확하게 알려 준다. (조수가 잘못된 설명에 대해 합리적인 기본 설정을 가지고 있지만.)
당신의 기억을 다시 갱신하기 위해 이 결과가 나오는 코드를 봅시다.
res.failValidationError('username is taken.');
우리는 단지 조수에게 오류 메시지에 대한 설명을 주었을 뿐, 클라이언트에게 상세한 오류 대상을 던졌다.마찬가지로, HTTP 상태 코드를 결정할 필요가 없습니다!
이 문서에서는 API가 아닌 서버 응답에 대해 설명합니다.난 여기까지야.연습으로 남은 단점을 계속 테스트합니다.나는 당신이 코드를 신속하게 이해할 수 있도록 원본 코드에 대해 주석을 했다.
소스 코드를 읽을 때 필요한 HTTP 상태 코드를 너무 자주 걱정할 필요는 없습니다.express response helper는 응답을 위해 표현력이 풍부한 코드를 작성할 수 있도록 해 줍니다. 이로써 코드 세션이 무엇을 하는지 쉽게 이해할 수 있습니다.
안녕히 계세요!
본문은 여기에서 끝냅니다.나는 네가 약간의 새로운 것을 배웠으면 한다.이것은 documentation 빠른 응답 조수로 가서 더 많은 정보를 얻을 수 있는 좋은 시기일 것이다.
마지막으로 저는 이 모듈의 참여자입니다. 그러니 시도해 보았지만 마음에 들지 않으시면 메일로 보내주세요:)
Reference
이 문제에 관하여(ExpressJS에서 서버 응답을 처리하는 방법 - 간단한 방법!), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://dev.to/imranabdulmalik/how-to-handle-server-responses-in-expressjs-the-easy-way-3lpm
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
At the time of writing this article, this module was a relatively new module but it's possible that by the time you read this, the module might have grown because it gets the job done and it's very easy to configure and use.
express response helperdocumentation는 이 모듈에 공평한 역할을 한다.그것은 예시를 통해 모듈의 각 방면을 포괄했다.본고에서 우리는 진정한expressjs 응용 프로그램에서 이 모듈을 어떻게 사용하는지 이해할 것이다.즉, 본고는 단지 당신에게 공부를 시작하게 할 뿐입니다. 더 많은 정보를 필요로 할 때 문서는 다음 방향입니다.
더 큰 프로젝트에서 이 모듈을 어떻게 사용하는지 알 수 있는 아주 간단한 프로그램을 만들 것입니다.Github 에서 프로그램의 원본 코드를 볼 수 있습니다.
I assume you have NodeJS and NPM installed. If you don't have those, you'll have to install them before proceeding. I used Node v12.21.0 and NPM v7.12.0 but later versions should work just fine. The editor used is Visual Studio Code but of course you can use your favorite IDE.
응용 프로그램 만들기
프로그램에 새 폴더를 만들고 편집기로 폴더를 엽니다.
터미널을 열고 다음 명령을 실행합니다.
npm init -y
{
"name": "express-response-helper-demo",
"version": "1.0.0",
"main": "index.js",
"license": "MIT"
}
src로 지정합니다.여기서 새 index.js 파일을 만듭니다.현재 상태로 유지: 패키지를 수정합니다.제이슨은 이렇게 보인다.
{
"name": "express-response-helper-demo",
"version": "1.0.0",
"main": "src/index.js",
"license": "MIT",
"scripts": {
"start": "node src/index.js"
}
}
We updated the path to the main source file and also added a script command for starting the application.
종속성 추가
우리는
express 모듈이 필요합니다. 물론 이 프로그램도 express-response-helper 모듈이 필요합니다.그것들을 추가합시다.터미널을 열고 다음 명령을 실행합니다.
npm install --save express express-response-helper
{
"name": "express-response-helper-demo",
"version": "1.0.0",
"main": "src/index.js",
"license": "MIT",
"scripts": {
"start": "node src/index.js"
},
"dependencies": {
"express": "^4.17.1",
"express-response-helper": "^1.2.0"
}
}
Note: depending on when you read this article, these versions will likely change. If some part of this tutorial doesn't work because of version differences please consult the official documentations of the module to learn what changed or you can simply set the versions to match the exact one used in this article.
For this article, the version of express-response-helper used is v1.2.0. Later versions should work too.
방해하지 마라, 우리는 모두 준비가 다 되었다!
모듈 사용
src/index.js를 열고 다음을 입력합니다.const express = require('express');
const responseHelper = require('express-response-helper');
const app = express();
// Configure the middleware
app.use(responseHelper.helper());
// Define routes
app.get('/', (req, res) => {
res.respond({ message: 'Hello, World!' });
});
app.listen(3000, () => {
console.log('Server running...');
});
우리 방금 뭐 했지?
우리는
requiring()express에서 시작하여 API 서버를 실행할 것입니다.그리고 우리는 빠른 응답 조수 모듈을 도입했다.require('express-response-helper'); 대상을 되돌려줍니다.이 대상은 두 가지 속성이 있습니다: helper () 는 함수이고,responseCodes는 미리 정의된 HTTP 상태 코드를 가진 대상입니다.우리는 이 대상을
responseHelper 변수에 저장할 것이다.다음에 우리는
express() 함수를 호출하여 app 변수에 저장한다.그리고 우리는 중간부품을 등록한다.이것이 바로 일이 재미있어지는 곳이다.responseHelper.helper()express 대상에 추가할 수 있는 중간부품 함수를 되돌려줍니다.app.use(responseHelper.helper())를 호출하여 저희를 위해 중간부품을 등록합니다.const app = express();
// Configure the middleware
app.use(responseHelper.helper());
It is important we configure the middleware before defining routes. Routes that are defined before registering the middleware won't have access to the functions that the helper adds to our
resvariable!
그런 다음 코스를 정의합니다.
// Define routes
app.get('/', (req, res) => {
res.respond({ message: 'Hello, World!' });
});
respond() 함수인express response helper를 사용하여 응답을 보냅니다.응답에 대한 상태 코드를 지정할 필요가 없습니다.기본적으로, 조수 중간부품은 200을 보낼 것입니다. 이것은 이 예에서 사용할 정확한 코드입니다.또한 응답 본문을 자동으로 JSON으로 변환합니다.이제 다음 명령을 실행하여 응용 프로그램을 실행합니다.
npm start
이렇게 하면 우리 서버는 정상적으로 운행할 수 있다.브라우저 탭을 열고
http:localhost:3000를 입력합니다.너는 반드시 이런 물건을 보아야 한다. 보시다시피, 조수 중간부품이 예상대로 작동하고 있습니다.우리는 단지 표면에 닿았을 뿐이다.더 복잡한 예를 보자. 더 많은 노선이 있다.
API 확장
우리들은 더욱 실제적인 예를 세웁시다.간단하게 보기 위해서, 우리는 어떠한 진정한 데이터베이스도 사용하지 않을 것이다.우리의 목표는 데이터가 어디에서 왔든지 상관없이 helper 중간부품이 서로 다른 응답 유형에 어떻게 적용되는지 이해하는 것이다.
src/index.js를 켜고 경로 정의 전에 이러한 보조 변수와 기능을 추가합니다.// Create a database for users
const database = [
{
username: 'user1',
email: '[email protected]',
password: 'test1',
}
];
// A function for validating email addresses
const validEmail = email => {
const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(String(email).toLowerCase());
};
// A function to check if a username is unique
const isUsernameUnique = username => {
let isUnique = true;
database.forEach(user => {
if (user.username === username)
isUnique = false;
});
return isUnique;
};
// A function to check if an email is unique
const isEmailUnique = email => {
let isUnique = true;
database.forEach(user => {
if (user.email === email.toLowerCase())
isUnique = false;
});
return isUnique;
};
// A function that returns a the index of a user data given the username
const findUser = username => {
return database.findIndex(user => {
return user.username === username;
});
};
app.use(express.json());
// Define routes
app.get('/', (req, res) => {
res.respondNoContent();
});
// To add a user
app.post('/user', (req, res) => {
const body = req.body;
if (body.username && body.email && body.password) {
// Make sure the username and email is unique
if (!isUsernameUnique(body.username)) {
// Duplicate username
res.failValidationError('username is taken.');
return;
}
if (!isEmailUnique(body.email)) {
// Duplicate email
res.failValidationError('email is taken.');
return;
}
// Insert the user
const user = {
username: body.username,
email: body.email.toLowerCase(),
password: body.password,
};
// Add to the database
database.push(user);
// Return a response confirming creation
res.respondCreated('User Account Created!');
}
else {
// If some or all the required data is not provided, return a failed response
res.failValidationError('Please provide all required data!');
}
});
// To update a user
app.put('/user/:username', (req, res) => {
// Find the user
const index = findUser(req.params.username);
const body = req.body;
if (index !== -1) {
if (body.email) {
// Get the user
const user = database[index];
// If the email equals the current one, do nothing
if (body.email === user.email) {
// Return a response confirming update
res.respondUpdated('User account updated.');
}
else {
// Make sure the email is unqiue
if (!isEmailUnique(body.email)) {
// Duplicate email
res.failValidationError('email is taken.');
return;
}
// Update the email
user.email = body.email;
// Return a response confirming update
res.respondUpdated('User account updated.');
}
}
else {
// Return a failed response
res.failValidationError('Please provide all required data!');
}
}
else {
// User not found.
res.failNotFound('No user with such username exists!');
}
});
// To remove a user
app.delete('/user/:username', (req, res) => {
// Find the user
const index = findUser(req.params.username);
if (index !== -1) {
// Remove the user
database.splice(index);
// Return a response confirming removal
res.respondDeleted('User removed!');
}
else {
// User not found.
res.failNotFound('No user with such username exists!');
}
});
// To authenticate a user
app.post('/login', (req, res) => {
const body = req.body;
if (body.username && body.password) {
// Make sure the username and email is unique
// Find the user
const index = findUser(body.username);
if (index !== -1) {
// Get the user
const user = database[index];
// Authenticate
if (user.password === body.password) {
// Authenticated, return basic user data
res.respond({ username: user.username, email: user.email });
}
else {
// return a response indicating that access is denied
res.failUnathorized('Invalid password!');
}
}
else {
// User not found.
res.failNotFound('No user with such username exists!');
}
}
else {
// If some or all the required data is not provided, return a failed response
res.failValidationError('Please provide all required data!');
}
});
src/index.js는 다음과 같습니다.const express = require('express');
const responseHelper = require('express-response-helper');
const app = express();
// Create a database for users
const database = [
{
username: 'user1',
email: '[email protected]',
password: 'test1',
}
];
// A function for validating email addresses
const validEmail = email => {
const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(String(email).toLowerCase());
};
// A function to check if a username is unique
const isUsernameUnique = username => {
let isUnique = true;
database.forEach(user => {
if (user.username === username)
isUnique = false;
});
return isUnique;
};
// A function to check if an email is unique
const isEmailUnique = email => {
let isUnique = true;
database.forEach(user => {
if (user.email === email.toLowerCase())
isUnique = false;
});
return isUnique;
};
// A function that returns a the index of a user data given the username
const findUser = username => {
return database.findIndex(user => {
return user.username === username;
});
};
// Configure the middlewares
app.use(responseHelper.helper());
app.use(express.json());
// Define routes
app.get('/', (req, res) => {
res.respondNoContent();
});
// To add a user
app.post('/user', (req, res) => {
const body = req.body;
if (body.username && body.email && body.password) {
// Make sure the username and email is unique
if (!isUsernameUnique(body.username)) {
// Duplicate username
res.failValidationError('username is taken.');
return;
}
if (!isEmailUnique(body.email)) {
// Duplicate email
res.failValidationError('email is taken.');
return;
}
// Insert the user
const user = {
username: body.username,
email: body.email.toLowerCase(),
password: body.password,
};
// Add to the database
database.push(user);
// Return a response confirming creation
res.respondCreated('User Account Created!');
}
else {
// If some or all the required data is not provided, return a failed response
res.failValidationError('Please provide all required data!');
}
});
// To update a user
app.put('/user/:username', (req, res) => {
// Find the user
const index = findUser(req.params.username);
const body = req.body;
if (index !== -1) {
if (body.email) {
// Get the user
const user = database[index];
// If the email equals the current one, do nothing
if (body.email === user.email) {
// Return a response confirming update
res.respondUpdated('User account updated.');
}
else {
// Make sure the email is unqiue
if (!isEmailUnique(body.email)) {
// Duplicate email
res.failValidationError('email is taken.');
return;
}
// Update the email
user.email = body.email;
// Return a response confirming update
res.respondUpdated('User account updated.');
}
}
else {
// Return a failed response
res.failValidationError('Please provide all required data!');
}
}
else {
// User not found.
res.failNotFound('No user with such username exists!');
}
});
// To remove a user
app.delete('/user/:username', (req, res) => {
// Find the user
const index = findUser(req.params.username);
if (index !== -1) {
// Remove the user
database.splice(index);
// Return a response confirming removal
res.respondDeleted('User removed!');
}
else {
// User not found.
res.failNotFound('No user with such username exists!');
}
});
// To authenticate a user
app.post('/login', (req, res) => {
const body = req.body;
if (body.username && body.password) {
// Make sure the username and email is unique
// Find the user
const index = findUser(body.username);
if (index !== -1) {
// Get the user
const user = database[index];
// Authenticate
if (user.password === body.password) {
// Authenticated, return basic user data
res.respond({ username: user.username, email: user.email });
}
else {
// return a response indicating that access is denied
res.failUnathorized('Invalid password!');
}
}
else {
// User not found.
res.failNotFound('No user with such username exists!');
}
}
else {
// If some or all the required data is not provided, return a failed response
res.failValidationError('Please provide all required data!');
}
});
app.listen(3000, () => {
console.log('Server running...');
});
npm start
브라우저는 GET 요청만 보낼 수 있습니다. POST, PUT, DELETE 등 다른 종류의 요청을 보낼 수 있어야 합니다.이를 위해 API를 사용할 별도의 클라이언트 코드를 만듭니다.우리는
curl와 같은 도구를 사용할 수 있지만 명령줄부터 테스트를 시작하여 진정한 클라이언트가 우리의 클라이언트를 어떻게 사용하는지 봅시다.우선
axios을 추가합니다.우리는 그것을 사용하여 서버에 요청을 보낼 것이다.새 터미널을 열고 다음 명령을 실행합니다.npm install --save axios
client.js 폴더에 새 파일을 만듭니다src.파일에 다음을 추가합니다.const axiosModule = require('axios');
const base_url = 'http://localhost:3000/';
const axios = axiosModule.default.create({
baseURL: base_url,
validateStatus: (status) => {
return status >= 200 && status < 500;
},
});
base_url를 API 위치로 설정합니다.우리는 또한 axios에 200에서 500 사이의 HTTP 상태 코드를 스스로 처리할 수 있도록 허락해 달라고 말했다.마지막으로 패키지의
"scripts" 속성을 수정합니다.json 파일:"scripts": {
"start": "node src/index.js",
"client": "node src/client.js"
},
client 을 추가했습니다.이제 요청을 보낼 수 있습니다!src/client.js를 열고 현재 컨텐츠 아래에 이 코드를 추가합니다.// Create a user (with valid data)
axios.post('user', {
username: 'user2',
email: '[email protected]',
password: 'test2',
})
.then(res => {
console.log({
code: res.status,
response: res.data,
})
})
.catch((error) => console.log(error));
/user 엔드포인트로 전송됩니다.우리가 응답을 받았을 때, 우리는 HTTP 상태 코드와 받은 데이터를 기록하기만 하면 된다.express 서버의 터미널이 실행 중인지 확인하십시오.이제 새 터미널을 열고 다음 명령을 실행합니다.
npm run client
위대하다API는 잘 작동하고 있습니다.지금 노선의 원본 코드를 확인하면post ((
/user 는 사용자가 생성되었음을 확인하기 위해 어떤 상태 코드를 보내야 하는지 알 필요가 없습니다. 응답을 원하는지 알 수 있습니다.이게 바로 스피드 리액션 조수의 힘!기억을 새로 고치려면 응답을 보내는 코드 비트가 다음과 같습니다.
res.respondCreated('User Account Created!');
npm run client.다음과 같은 출력을 받아야 합니다.
현재 사용자 이름을 추가하려고 하기 때문에 출력이 다르다.express response helper가 반환하는 응답 유형에 주의하십시오.
{
status: 400,
error: 400,
messages: 'username is taken.'
}
fail ed 요청에 대해 조수는 이 값을 되돌려줍니다.그것은 잘못된 상태와 설명을 명확하게 알려 준다. (조수가 잘못된 설명에 대해 합리적인 기본 설정을 가지고 있지만.)당신의 기억을 다시 갱신하기 위해 이 결과가 나오는 코드를 봅시다.
res.failValidationError('username is taken.');
이 문서에서는 API가 아닌 서버 응답에 대해 설명합니다.난 여기까지야.연습으로 남은 단점을 계속 테스트합니다.나는 당신이 코드를 신속하게 이해할 수 있도록 원본 코드에 대해 주석을 했다.
소스 코드를 읽을 때 필요한 HTTP 상태 코드를 너무 자주 걱정할 필요는 없습니다.express response helper는 응답을 위해 표현력이 풍부한 코드를 작성할 수 있도록 해 줍니다. 이로써 코드 세션이 무엇을 하는지 쉽게 이해할 수 있습니다.
안녕히 계세요!
본문은 여기에서 끝냅니다.나는 네가 약간의 새로운 것을 배웠으면 한다.이것은 documentation 빠른 응답 조수로 가서 더 많은 정보를 얻을 수 있는 좋은 시기일 것이다.
마지막으로 저는 이 모듈의 참여자입니다. 그러니 시도해 보았지만 마음에 들지 않으시면 메일로 보내주세요:)
Reference
이 문제에 관하여(ExpressJS에서 서버 응답을 처리하는 방법 - 간단한 방법!), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://dev.to/imranabdulmalik/how-to-handle-server-responses-in-expressjs-the-easy-way-3lpm
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
Reference
이 문제에 관하여(ExpressJS에서 서버 응답을 처리하는 방법 - 간단한 방법!), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/imranabdulmalik/how-to-handle-server-responses-in-expressjs-the-easy-way-3lpm텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
