이의준

HTML 페이지와 Nodejs 연결 (세부 내용 미구현)

...@@ -19,10 +19,10 @@ ...@@ -19,10 +19,10 @@
19 <h2> 버스별 시간표 조회</h2> 19 <h2> 버스별 시간표 조회</h2>
20 <p> m월 d일 오늘 운행하는 버스들</p> 20 <p> m월 d일 오늘 운행하는 버스들</p>
21 <ul> 21 <ul>
22 - <li><a href="timetable.html">5100</a></li> 22 + <li><a href="http://localhost:23023/?busNum=5100">5100</a></li>
23 - <li><a href="timetable.html">M5107</a></li> 23 + <li><a href="http://localhost:23023/?busNum=M5107">M5107</a></li>
24 - <li><a href="timetable.html">9</a></li> 24 + <li><a href="http://localhost:23023/?busNum=9">9</a></li>
25 - <li><a href="timetable.html">7000</a></li> 25 + <li><a href="http://localhost:23023/?busNum=7000">7000</a></li>
26 <li>etc</li> 26 <li>etc</li>
27 </ul> 27 </ul>
28 <br> 28 <br>
......
1 +var http = require('http');
2 +var fs = require('fs');
3 +var url = require('url');
4 +
5 +var app = http.createServer(function(request,response){
6 + var _url = request.url;
7 + var queryData = url.parse(_url, true).query;
8 + if(_url == '/'){
9 + _url = '/Index.html';
10 + }
11 + if(_url == '/favicon.ico'){
12 + return response.writeHead(404);
13 + }
14 + response.writeHead(200);
15 + console.log(queryData.busNum);
16 +
17 + if (queryData.busNum != null){ // 버스번호를 요청했을때 타임테이블 페이지로 전환
18 + var timetableHTML = `
19 +<!doctype html>
20 +<html>
21 +<head>
22 + <title>Time Table</title>
23 + <meta charset="utf-8">
24 + <style type="text/css">
25 + a { text-decoration:none }
26 + </style>
27 +</head>
28 +
29 +<body>
30 + <h1><a href="Index.html"><p style="text-align:center;">BTT</p></a></h1>
31 + <br>
32 + <h2>${queryData.busNum} BUS Time Table</h2>
33 + <p> Response from API server ... </p>
34 +</body>
35 +</html>
36 + `;
37 + response.end(timetableHTML);
38 + }
39 + else{ // 아니라면, url 따라감
40 + response.end(fs.readFileSync(__dirname + _url));
41 + }
42 +});
43 +app.listen(23023);
...\ No newline at end of file ...\ No newline at end of file
......
1 +<!-- 이 문서는 base.js에 timetableHTML로 저장되어 있음. 따라서 이 문서는 직접적으로 사용하지 않음-->
2 +
1 <!doctype html> 3 <!doctype html>
2 <html> 4 <html>
3 <head> 5 <head>
......