2022-08-05 : JS

1. window.android

: 자바스크립트에서 안드로이드 함수 호출 시 사용

자바스크립트와 모바일간의 통신

1. 자바스크립트 인터페이스 클래스 만들기

2. WebView 에 인터페이스 클래스 등록하기

3. Javascript와 Android 함수 호출하기

 

왜 사용하는가?

- 웹앱을 개발하여 앱과 연동하게 되면 앱의 고유 기능을 사용하는 경우가 발생한다.

    ㆍ네이버 OAuth를 사용할 경우 Web Page가 초기화 되어 localstorage도 초기화되는 문제

    ㆍ로그인 유지에 대한 고민으로 안드로이드 로컬스토리지를 사용하여 웹앱에 유지

 

참고자료 : https://drhot552.github.io/web/javascript-%EC%95%88%EB%93%9C%EB%A1%9C%EC%9D%B4%EB%93%9C%EA%B0%84-%ED%86%B5%EC%8B%A0%EB%B0%A9%EB%B2%95/#%EC%95%88%EB%93%9C%EB%A1%9C%EC%9D%B4%EB%93%9C-%EB%A1%9C%EC%BB%AC%EC%8A%A4%ED%86%A0%EB%A6%AC%EC%A7%80-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0

 

 

2. history.push VS window.location.href

공통점

- 다른 페이지로 이동

 

차이점

	history.push	window.location.href
HTTP 요청	X	O
새로고침	X	O
Application 상태유지	O	X

 

* 이동과 함께 새로고침이 필요한 경우는 window.location.href 사용

추가 : 리엑트는 새로그침하는 순간 나의 모든 컴포넌트가 랜더링되므로 로딩시간이 길어진다! 주의 할것

3. Location 객체 ( 다시 )

Property	Description	Example
window.location.pathname	URL 경로 반환	/search
window.location.search	URL에 붙은 매개변수 반환(물음표 뒤의 값)	?q=devmo
window.location.host	URL의 도메인과 포트 반환	www.example.com:8080

Method	Description
window.location.reload(forceget)	현재 페이지 새로고침
window.location.replace(url)	새로운 주소 이동 ( 세션 히스토리가 남지 않기 떄문에 back버튼으로 이동 불가)

* location.search는 쿼리스트링 parse 해주면 된다.

 

참고 자료 : 

1. https://iamawebdeveloper.tistory.com/41