인터넷은 전 세계 컴퓨터들이 서로 연결된 거대한 네트워크다. 이 네트워크를 통해 데이터를 주고받을 수 있다. 웹(Web)은 인터넷을 기반으로 하는 정보의 바다로, 여기서 문서나 자원들이 상호 연결되어 있다.
URI (Uniform Resource Identifier)
개념
- URI (Uniform Resource Identifier): 인터넷 상의 자원을 식별하는 유일한 주소다. 이 주소를 통해 해당 자원을 찾을 수 있다. URI는 두 가지 주요한 형태를 가진다: URL과 URN.
구조
- URI는 일반적으로 다음과 같은 형태를 가진다:
scheme:[//[user:password@]host[:port]][/]path[?query][#fragment]scheme: 자원에 접근하는 방법을 명시한다. 예를 들어,http,https,ftp등이 있다.user:password@: 선택적이며, 자원에 접근하기 위한 인증 정보를 포함할 수 있다.host: 자원이 위치한 서버의 주소다.port: 서버의 특정 포트를 명시한다. 생략 가능하며, 기본값은 사용되는 스킴에 따라 다르다.path: 서버 내 자원의 경로다.query: 선택적이며, 추가적인 질의 매개변수를 포함한다.fragment: 선택적이며, 자원 내 특정 부분을 가리킨다.
예시
https://www.example.com:80/path/to/myfile.html?key1=value1&key2=value2#SomewhereInTheDocument
URL (Uniform Resource Locator)
개념
- URL (Uniform Resource Locator): 인터넷 상의 자원이 어디에 위치해 있는지를 나타내는 주소다. URL은 URI의 한 형태다. URL은 자원이 실제로 존재하는 위치를 가리키며, 그 자원을 얻기 위해 사용되는 방법(프로토콜)을 포함한다.
구조
- URL은 위에서 언급한 URI의 구조를 따른다. 여기서 핵심은 자원의 위치를 나타내는
host와path부분이다.
예시
http://www.example.com:8080/index.htmlhttp: 사용되는 프로토콜www.example.com: 호스트 이름8080: 포트 번호/index.html: 자원의 경로
URN (Uniform Resource Name)
개념
- URN (Uniform Resource Name): 자원의 위치가 아닌 이름을 제공한다. URN은 URI의 또 다른 형태로, 자원의 위치나 접근 방식에 구애받지 않고 자원을 고유하게 식별한다. URN은 자원이 옮겨지거나 방식이 바뀌어도 변하지 않는 고유한 이름을 부여한다. (다만, 실제로는 URL을 대부분 사용한다)
구조
- URN은 자원을 명명하는 데 사용되는 고유한 이름의 집합을 나타낸다. 일반적으로
urn:스킴으로 시작한다.
예시
urn:isbn:0451450523- 여기서
urn은 스킴을,isbn은 자원의 종류(여기서는 책의 ISBN 번호)를,0451450523은 특정 책의 고유 번호를 나타낸다.
- 여기서
예시 코드
URL을 사용한 간단한 웹 요청 예제
:
const axios = require('axios');
axios.get('https://www.example.com')
.then(response => {
console.log(response.data); // 서버로부터 받은 데이터를 출력
})
.catch(error => {
console.error('Error fetching the URL:', error);
});이 코드는 axios 라이브러리를 사용하여 https://www.example.com URL로 HTTP GET 요청을 보내고, 응답을 콘솔에 출력한다.
URI, URL, URN의 상세한 사용과 차이점
URI와 URL, URN의 관계
- URI는 자원을 식별하는 일반적인 방법을 제공한다. 모든 URL과 URN은 URI다.
- URL은 자원의 위치를 지정한다. 즉, 해당 자원을 찾아가는 방법을 제공한다.
- URN은 자원의 이름을 지정한다. 위치에 독립적이어서 자원이 이동하거나 변경되어도 동일하게 유지된다.
웹 개발에서의 중요성
- 웹 개발에서 URL은 가장 중요한 요소 중 하나다. 웹 페이지, 이미지, 스타일시트, 자바스크립트 파일 등 모든 웹 자원은 URL을 통해 접근된다.
- URN은 웹 개발에서 흔히 사용되지는 않지만, 특정 문맥(예: 디지털 도서관)에서 유용하게 사용될 수 있다.
예시: 웹 페이지에서의 URL 사용
웹 페이지 내에서 다양한 자원에 대한 링크를 생성하는 예를 살펴보자. HTML 문서에서 URL은 주로 <a>, <img>, <link>, <script> 태그 등에 사용된다.
<!DOCTYPE html>
<html>
<head>
<title>Example Page</title>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<h1>Welcome to My Web Page</h1>
<p><a href="http://www.example.com/more-info.html">More Information</a></p>
<img src="image.jpg" alt="Example Image">
<script src="script.js"></script>
</body>
</html><a href="...">: 다른 웹 페이지로의 링크를 생성한다.<link rel="stylesheet" href="...">: CSS 스타일시트를 현재 페이지에 연결한다.<img src="...">: 이미지를 웹 페이지에 포함한다.<script src="...">: 자바스크립트 파일을 페이지에 포함한다.
프로그래밍에서의 URI와 URL 사용
자바스크립트에서 URL을 사용하여 네트워크 요청을 보내는 간단한 예제를 살펴보자. 이 예제에서는 fetch API를 사용한다.
fetch('https://www.example.com/api/data')
.then(response => response.json()) // JSON 형태로 응답을 파싱
.then(data => {
console.log(data); // 받은 데이터를 콘솔에 출력
})
.catch(error => {
console.error('Error fetching data:', error);
});이 코드는 https://www.example.com/api/data URL로 HTTP GET 요청을 보내고, 응답으로 받은 JSON 데이터를 콘솔에 출력한다.
