개발 공부 - 자바스크립트 URL 정보 (window.location, location 정보)

자바스크립트의 location 객체를 이용해서 현재 URL 정보를 볼 수 있다.
window를 생략해도 사용 가능하고, 대부분 브라우저에서 지원한다.

서버 설정이랑은 상관없이 자바스크립트 내 window.location에는 url 정보를 볼 수 있는 변수들이 있는데,

1

https://search.naver.com/search.naver?sm=top_hty&fbm=0&ie=utf8&query=%EA%B2%80%EC%83%89

cs

이라는 주소를 실행했을 때 반환되는 정보를 가지고 사용한다.


내가 평소 쓰는 스타일은

1 2 3 4

location.protocol : https: location.host : search.naver.com location.pathname : search.naver location.search : ?sm=top_hty&fbm=0&ie=utf8&query=%EA%B2%80%EC%83%89

cs

이런 식으로 사용한다.

window 붙여서 사용시에는

1 2 3 4 5 6 7

window.location.href : https://search.naver.com/search.naver?sm=top_hty&fbm=0&ie=utf8&query=%EA%B2%80%EC%83%89 window.location.port : 포트 정보는 기재되지 않음 window.location.protocol : https: window.location.host : search.naver.com window.location.hostname : search.naver.com window.location.pathname : search.naver window.location.search : ?sm=top_hty&fbm=0&ie=utf8&query=%EA%B2%80%EC%83%89 Colored by Color Scripter

cs

이런 식으로 사용한다.

자바스크립트에서 사용 예시로는

1 2

var SampleVariable = {}; SampleVariable.linkPageURL = location.protocol +'//'+ location.host+ '/testDirectory/linkPage.html';

cs

이런 식으로 사용하면

1

SampleVariable.linkPageURL ='https://search.naver.com/testDirectory/linkPage.html';

cs

이런 URL이 생성된다.

한글 깨짐 방지 처리 하려면 EncodeURI, DecodeURI 함수 사용해서 인코딩/디코딩 하면 된다.
아니면 뒤에 파라미터만 인코딩 하려면 EncodeURIComponent, DecodeURIComponent 사용하면 되는데 사실 유지보수 하는 거면 있는거 그냥 쓴다...


자료 출처(2020-01-13 참조) :
https://kdarkdev.tistory.com/124
https://includestdio.tistory.com/43
https://blog.lael.be/post/400