URL
JavaScript를 이용해서 Node.js가 갖고 있는 기능을 불러올 때 사용
url에 따라 다른 정보를 불러 올 수 있음
http: 웹서버와 웹 브라우저가 서로 통신을 하기 위한 규칙
host(domain): 인터넷에 연결되어 있는 컴퓨터의 주소
port: 한 대의 컴퓨터 안에 여러개의 서버가 존재가능, 구별하기 위한 포트
path: 컴퓨터안에 있는 어떤 파일인지 알려줌
query string: 웹 서버에게 데이터 전달 가능
URL을 통해 입력된 값 사용
사용자가 위의 주소로 접속했을 때, id값에 따라서 다른 컨텐츠를 보여주도록 설정할 예정
참고코드
var http = require('http');
var url = require('url');
// Configure our HTTP server to respond with Hello World to all requests.
var server = http.createServer(function (request, response) {
var queryData = url.parse(request.url, true).query;
response.writeHead(200, {"Content-Type": "text/plain"});
if (queryData.name) {
// user told us their name in the GET request, ex: http://host:8000/?name=Tom
response.end('Hello ' + queryData.name + '\n');
} else {
response.end("Hello World\n");
}
});
// Listen on port 8000, IP defaults to 127.0.0.1
server.listen(8000);
쿼리스트링에 따라 다르게 출력되는 웹 애플리케이션
var http = require('http');
var fs = require('fs');
var url = require('url'); // url이라는 모듈을 사용할 것이다라고 알려주는 것
var app = http.createServer(function(request,response){
var _url = request.url; // 위의 모듈 url과 구별하기 위해 _url로 변경
var queryData = url.parse(_url, true).query;
console.log(queryData.id);
if(_url == '/'){
_url = '/index.html';
}
if(_url == '/favicon.ico'){
return response.writeHead(404);
}
response.writeHead(200);
response.end(queryData.id);
});
app.listen(3000);쿼리스트링에 따라 다르게 완성된 페이지 출력
var http = require('http');
var fs = require('fs');
var url = require('url'); // url이라는 모듈을 사용할 것이다라고 알려주는 것
var app = http.createServer(function(request,response){
var _url = request.url; // 위의 모듈 url과 구별하기 위해 _url로 변경
var queryData = url.parse(_url, true).query;
var title = queryData.id;
console.log(queryData.id);
if(_url == '/'){
title='Welcome';
}
if(_url == '/favicon.ico'){
return response.writeHead(404);
}
response.writeHead(200);
var template = `
<!doctype html>
<html>
<head>
<title>WEB1 - ${title}</title>
<meta charset="utf-8">
</head>
<body>
<h1><a href="/">WEB</a></h1>
<ol>
<li><a href="/?id=HTML">HTML</a></li>
<li><a href="/?id=CSS">CSS</a></li>
<li><a href="/?id=JAVASCRIPT">JavaScript</a></li>
</ol>
<h2>${title}</h2>
<p><a href="https://www.w3.org/TR/html5/" target="_blank" title="html5 speicification">Hypertext Markup Language (HTML)</a> is the standard markup language for <strong>creating <u>web</u> pages</strong> and web applications.Web browsers receive HTML documents from a web server or from local storage and render them into multimedia web pages. HTML describes the structure of a web page semantically and originally included cues for the appearance of the document.
<img src="coding.jpg" width="100%">
</p><p style="margin-top:45px;">HTML elements are the building blocks of HTML pages. With HTML constructs, images and other objects, such as interactive forms, may be embedded into the rendered page. It provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items. HTML elements are delineated by tags, written using angle brackets.
</p>
</body>
</html>
`;
response.end(template);
});
app.listen(3000);
풀스택개발자를 목표로 공부중