개요

PhoneGap/Cordova 앱으로 외부 사이트에 링크했을 때의 거동이 어딘가의 버전에서 바뀌었기 때문에 현재 버전의 거동 메모입니다.

환경

코르도바 7.0.1
기사가 낡습니다만, 이 기사 그리고 구축한 환경을 사용하고 있습니다.
※ 계속 PhoneGap 환경을 사용하고 있었습니다만, 최신판으로 phonegap create 가 실패하는 일이 있기 때문에, Cordova 로 환승했습니다.

검증 기계

Sony Xperia Z5 Premium (Android7.0)
iPhone6Plus (iOS )

Android 거동

기본=표준 브라우저(Chrome)에서 열기

<a href="https://www.google.co.jp/">LINK</a>

단순히 외부 URL 링크를 작성하면 Chrome으로 전환하여 페이지가 표시됩니다.

인앱 브라우저에서 열기

cordova plugin add cordova-inappbrowser

플러그인 "InAPpBrowser"설치

<a hred="#" onclick="window.open('https://www.google.co.jp/', '_blank', 'location=yes')">LINK</a>

window.open 에서 _blank 지정하면 인앱 브라우저에서 열립니다.
(그러나···이 UI의 다사함은 어떻게 되지 않는 것인가…)


【주의】cordova create 에서 생성된 초기 템플리에 다음 meta 태그가 들어 있습니다.
이 한 줄을 삭제하지 않으면 자바 스크립트를 사용할 수 없습니다. 이것에 빠져서, 이 기사 쓰기의 일단 그만두었습니다...

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">

앱 내부에서 볼 수 있도록 합니다.

과거에는 이 거동이 디폴트였지만, 어느 버젼으로부터인가, 화이트 리스트에 기재하는 형식으로 바뀌었습니다.
플러그인이 필요하지만 Cordova의 초기 템플리에 처음부터 들어 있습니다.

config.xml

<allow-navigation href="https://www.google.co.jp/*" />

config.xml에 인앱 보기를 허용하는 주소를 제공합니다.

<a href="https://www.google.co.jp/">LINK</a>

링크는 기본 a 태그로 OK입니다.
이제 웹 서버의 페이지로 인식되지 않고 앱 내부에 페이지가 표시됩니다.


덧붙여 화이트리스트로 지정한 URL 이외는 표시할 수 없기 때문에, Google의 검색으로부터 다른 사이트로 날려고 하는 경우는, 다른 URL이 된 순간에, 표준의 브라우저(Chrome)가 열립니다.

참고
htps : // 코 r ゔ 아. 아파치. 오 rg / 드 cs / 엔 / 아 st / 레후 렌세 / 코 r ゔ ぁ p ぅ 긴 ぃ 테 st /

iOS 거동

표준 브라우저가 Safari로 바뀌는 것만으로 행동은 동일합니다.
마음이 가면 캡처를 추가합니다. . .