일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- BFS
- 코테
- webpack
- 코딩테스트
- useState
- 프로그래머스
- Hook
- useCallback
- prettier
- useMemo
- Permutations
- react internals
- eslint
- await
- seo
- 환경설정
- 완전탐색
- VanillJS
- VanillaJS
- react
- python
- React.memo
- Custom Hook
- venv
- 비동기
- canvas
- pjax
- useEffect
- web
- 그리디
- Today
- Total
Amada Coding Club
[Web]URL과 URI의 차이 본문
보통 웹 주소에 대해 말할 때 URL이라는 말을 많이 사용한다.
그런데 이번에 Router에 대한 글을 쓰면서 URL이외에 URI라는 말을 많이 썼다.
URI는 뭐고 URL은 뭔지 궁금해서 정리를 해보고자 한다.
먼저 요약하면 URI는 이름 URL는 위치를 나타낸다. 사람에 비유하면 URI는 각자의 이름, URL은 그 사람들이 사는 지역을 생각하면 편하다. 다시 말해 URL 이 성동구일때 URI는 성동구의 홍길동, 성동구의 임꺽정과 같은 유일한 존재이다.
이제 자세하게 살펴보자
URI와 URL의 관계
먼저
URI는 Uniform Resource Identifier
URL은 Uniform Resource Locator의 약자로 이름 그래도 URI는 id를 URL은 위치를 나타낸다.
이 두 개의 관계는 위와 같다.
URL은 URI에 포함되어 URL을 URI라고 말할 수 있다.
이제 URI에 대해 알아보자
URI
URI는 통합자원식별자로서 인터넷의 리소스(해당 페이지)를 나타낼 수 있는 유일한 주소를 나타낸다.
URI의 구조는 다음과 같다.
scheme:[//[user[:password]@]host[:port]][/path][?query][#fragment]
- scheme: 사용할 프로토콜(http 또는 https를 사용)
- user, password: 데이터에 접근하기 위한 사용자의 이름과 비밀번호
- host, port: 접근할 대상의 호스트명과 포트번호(ex:localhost:8080)
- path: 경로에 대한 상세 정도(/main/home)
- query: 접근할 대상에 대한 추가정보(파라미터로 전달되어 사용 가능)
- fragment: 메인 리소스에서 서브 리소스로 접근할 때 필요한 식별 정보(해시 값)
URL
URL은 흔히 주소값이라고 하며 네트워크 상의 리소스 위치를 알려준다.
URL의 구조는 URI에서 query와 fragment가 제외된 형태이다.
scheme://<user>:<password>@<host>:<port>/<url-path>
URI와 URL 구분
그러면 어떤 게 URL이고 어떤 게 URL이 아닌지 알아보자
두개의 주소값이 있다.
https://www.amadaclub.com/main 자원의 위치를 명확하게 가리키고 있지 않지만 실행은 됨 URI
https://www.amadaclub.com/main.html 자원의 위치를 가리키며 URL이자 URI임
이 두 개는 둘 다 URI이지만 위에건 URL이 아니다. 왜냐하면 웹서버에는 main.html을 가지고 있지만 main을 가지고 있지 않아 정확한 주소를 가리키고 있지 않기 때문이다.
또다른 예시로 http://endic.naver.com/endic.nhn?docid=1232950 를 생각해보자. 먼저 이 위치는 쿼리 값인 docid에 따라 다른 값을 출력한다. 즉, URL은 http://endic.naver.com/endic.nhn 이고 위는 URI이지만 URL은 아니라고 볼 수 있다.
쉽게 이해하면 우리가 흔히 보는 주소값에서 query와 fragment를 제외하면 그 부분은 URL, 합치면 URI라고 생각할 수 있다.
파면 팔 수록 어려운 네트워크의 세계다...
참조
https://ko.wikipedia.org/wiki/%ED%86%B5%ED%95%A9_%EC%9E%90%EC%9B%90_%EC%8B%9D%EB%B3%84%EC%9E%90
https://velog.io/@jch9537/URI-URL
'Front-End > 관련 지식들' 카테고리의 다른 글
[Promise] Promise API에 대해 알아보자 (0) | 2023.02.13 |
---|---|
[비동기] 비동기 함수에 대해 알아보자 (0) | 2023.02.13 |
[Web Routing] Routing의 발전 과정에 대해 알아보자(ajax, hash, pjax) (0) | 2023.01.13 |
[SPA SSR] SSR을 통한 SEO 문제 해결 / 언제 쓸까? (0) | 2023.01.12 |
[SPA SEO] SPA에서의 SEO 문제 (0) | 2023.01.12 |