Продолжаем работу с приложением по поиску игроков NHL.
В этой статье добавим простой сервер для отображения формы поиска
Одно поле ввода и кнопка поиска.
Добавляю простой сервер на нативном пакете node.js http
Файл server.js в папке src
'use strict';
const http = require('http');
const port = process.env.PORT || 8080;
const manage = require('./modules/manageRequest');
const requestHandler = async (request, response) => {
let body = [];
const {headers} = manage.prepareHeaders(request);
if (request.method === 'POST') {
request.on('data', chunk => {
body.push(chunk);
});
request.on('end', async () => {
body = Buffer.concat(body).toString('utf8');
const {content} = await manage.prepareContent(request, body);
Object.keys(headers).forEach(key => {
response.setHeader(key, headers[key]);
});
response.end(content);
});
} else {
Object.keys(headers).forEach(key => {
response.setHeader(key, headers[key]);
});
const {content} = await manage.prepareContent(request, null);
response.end(content);
}
};
const server = http.createServer(requestHandler);
server.listen(port, (err) => {
if (err) {
return console.info('something bad happened', err);
}
console.info(`server is listening on ${port}`);
});
Для обработки запросов и ответов модуль — manageRequest
'use strict';
const {parse} = require('querystring');
const Connection = require('./connection');
const HEADERS = {};
let type = 'index';
const getHeader = () => {
if (type === 'search') {
HEADERS['Content-Type'] = 'text/html';
} else {
HEADERS['Content-Type'] = 'text/html';
}
};
const getType = (request) => {
if (request.url === '/search') {
type = 'search';
} else {
type = 'index';
}
};
const prepareHeaders = (request) => {
getType(request);
getHeader();
return {headers: HEADERS};
};
const getPage = (source) => {
let body = '';
if (type === 'index') {
body = `<!doctype html>
<html>
<body>
<form action="/search" method="post">
<label for="playerName">
<input type="text" name="playerName" id="playerName"/>
</label><br />
<input type="submit" value="Search">
</form>
</body>
</html>`;
} else if (source && type === 'search') {
body = `<!doctype html>
<html>
<body>
<form action="/search" method="post">
<label for="playerName">
<input type="text" name="playerName" id="playerName"/>
</label><br />
<input type="submit" value="Search">
</form>
<div>
<pre>${JSON.stringify(source)}</pre>
</div>
</body>
</html>`;
}
return body;
};
const prepareContent = async (request, data) => {
getType(request);
if (data && request.method === 'POST') {
const {playerName} = parse(data);
const con = new Connection(playerName);
return new Promise(resolve => {
con.getWiki(false, () => {
getType(request);
resolve({content: getPage(con.handlerWiki.playerInfo)});
});
});
} else if (request.method === 'GET') {
getType(request);
return {content: getPage()};
} else {
return {content: null};
}
};
module.exports = {prepareHeaders, prepareContent};
Исправляем путь в package.json команду npm start — index на server
Запускаем npm run start и переходим в браузере по адресу http://localhost:8080
Видим что дату плохо обрабатывает
Код в ветке server
Добавить комментарий