브라우저 (browser)
개요
browser 네임스페이스는 앱 내에서 링크를 열기 위한 브라우저 기능을 제공합니다.
URL을 열 때 외부 브라우저(Chrome, Safari 등) 또는 앱 내부 브라우저를 선택하여 사용할 수 있습니다.
내부 브라우저 유의사항
- SDK를 통해 연 내부 브라우저에서는 웹뷰의 부모-자식 관계가 없는 대신 내부 브라우저에서 SDK 기능이 사 용 가능하도록 구현하였습니다.
anchor혹은window.open을 통해 열린 내부 브라우저의 경우 웹뷰의 부모-자식 관계가 성립되지만 내부 브라우저에서 SDK 사용이 불가하도록 처리하였습니다.- 참고 : ➡️ iOS App Source Release v.1.6.5
타입 정의
OpenURLOption
링크를 여는 브라우저 옵션을 나타내는 타입입니다.
export declare type OpenURLOption =
| 'external'
| 'internal'
| 'internal_default';
| 옵션 | 설명 | 추가된 버전 |
|---|---|---|
'external' | 앱 외부 기본 브라우저 | v1.0.3 v1.1.0 v1.1.0 |
'internal' | 인앱 브라우저 (WebView) | v1.0.3 v1.1.0 v1.1.0 |
'internal_default' | 앱 내부 기본 브라우저 | v1.6.3 v1.6.9 v1.6.10 |
-
'external'- 링크를 사용자 설정에 따른 앱 외부의 기본 브라우저(Chrome, Safari 등)에서 여는 방식입니다.
- 타 앱을 열거나, 앱과 다른 도메인의 페이지를 보여주어야 할 때 유용
- 앱과의 세션이 분리되어 쿠키 등이 공유되지 않음
-
'internal'- 링크를 앱 내 WebView에서 인앱 브라우저로 여는 방식입니다.
- 메인 WebView와의 세션이 유지됨
- 메인 WebView와 쿠키 공유 가능
-
'internal_default'- 링크를 앱 내부에서 기본 브라우저 엔진(SafariViewController, Chrome Custom Tabs 등)으로 여는 방식입니다.
- 모든 동작이 외부 브라우저와 동일하게 동작
- 메인 WebView와의 세션이 분리되어 쿠키 등이 공유되지 않음
- Native SDK 기능 이용 불가
SetInternalBrowserOption
- since : v1.8.0
내부 브라우저의 옵션을 설정하는 타입입니다.
export declare type SetInternalBrowserOption = {
usingUrl: boolean; // URL 바를 표시할지 여부
};
| 필드 | 타입 | 설명 |
|---|---|---|
usingUrl | boolean | 내부 브라우저에서 URL 바 표시 여부 |
메서드 목록
| 메서드 | 설명 | 추가된 버전 | 업데이트된 버전 |
|---|---|---|---|
openLink(url, option?) | 지정한 URL을 내부 또는 외부 브라우저에서 엽니다. | v1.0.3 | v1.6.3 |
setInternalBrowser(option) | 내부 브라우저의 옵션을 설정합니다. | v1.8.0 |
메서드 상세
openLink(url: string, option?: OpenURLOption): void
설명
주어진 URL을 외부 브라우저 또는 내부 브라우저에서 엽니다.
기본적으로 external 모드(외부 브라우저)가 사용됩니다.
브라우저 열기 기능은 SDK ver.1.6.3부터 웹, Android, iOS 플랫폼 모두에서 사용 가능합니다.
지원 플랫폼
openLink 메서드는 App과 Web 모든 환경을 지원합니다.
| 플랫폼 | 지원 여부 | 비고 |
|---|---|---|
 | ✅ | 내부 혹은 외부 브라우저 오픈 |
 | ✅ | 내부 혹은 외부 브라우저 오픈 |
 | ✅ | 팝업 혹은 새 창 오픈 |
매개변수
| 이름 | 타입 | 필수 여부 | 설명 |
|---|---|---|---|
url | string | ✅ | 열고자 하는 웹 페이지 URL |
option | OpenURLOption (optional) | ❌ | 'external', 'internal', 'internal_default' 중 선택 가능 |
반환 값
해당 메서드는 반환 값을 가지지 않습니다.
사용 예제
앱 외부 브라우저에서 열기
- ✅ 앱 외부의 Safari, Chrome 등 유저가 선택한 기본 브라우저를 활용
- ✅ 타 앱을 열거나, 앱과 다른 도메인의 페이지를 보여주어야 할 때 유용
- ❌ 앱과의 세션이 분리되어 쿠키 등이 공유되지 않음
// 외부 브라우저에서 URL 열기 (기본 동작)
Nachocode.browser.openLink('https://nachocode.io');
// 명시적으로 외부 브라우저에서 URL 열기 (Chrome, Safari 등)
Nachocode.browser.openLink('https://nachocode.io', 'external');
앱 내부 브라우저(WebView)에서 열기
- ✅ 메인 WebView와의 세션이 유지됨
- ✅ 메인 WebView와 쿠키 공유 가능
- ❌ 모바일 브라우저에서 동작하던 일부 기능이 동작하지 않을 수 있음
// 앱 내부 브라우저에서 URL 열기
Nachocode.browser.openLink('https://nachocode.io', 'internal');
기본 브라우저 엔진으로 열기
- ✅ Safari, Chrome 등 유저가 선택한 기본 브라우저를 활용
- ✅ 모든 동작이 외부 브라우저와 동일하게 동작
- ❌ 메인 WebView와의 세션이 분리되어 쿠키 등이 공유되지 않음
- ❌ Native SDK 기능 이용 불가
// 앱 내부에서 기본 브라우저 엔진으로 URL 열기
Nachocode.browser.openLink('https://nachocode.io', 'internal_default');
setInternalBrowser(option: SetInternalBrowserOption): void
- since : v1.8.0
설명
내부 브라우저의 옵션을 설정합니다. 현재는 URL 바 표시 여부만 제어할 수 있습니다.
이 설정은 openLink 메서드에서 'internal' 옵션을 사용할 때, <a> 태그로 새 창을 열었을 때 실행되는 내부 브라우저에 적용됩니다.
지원 플랫폼
| 플랫폼 | 지원 여부 |
|---|---|
| ✅ |
| ✅ |
| ❌ |
매개변수
| 이름 | 타입 | 필수 여부 | 설명 |
|---|---|---|---|
option | SetInternalBrowserOption | ✅ | 내부 브라우저 옵션 설정 |
반환 값
해당 메서드는 반환 값을 가지지 않습니다.
사용 예제
URL 바를 표시하지 않는 내부 브라우저
// URL 바를 숨긴 상태로 내부 브라우저 설정
Nachocode.browser.setInternalBrowser({
usingUrl: false,
});
// 이후 내부 브라우저로 열리는 링크는 URL 바가 표시되지 않음
Nachocode.browser.openLink('https://nachocode.io', 'internal');
URL 바를 표시하는 내부 브라우저
// URL 바를 표시하는 내부 브라우저 설정 (기본값)
Nachocode.browser.setInternalBrowser({
usingUrl: true,
});
// 이후 내부 브라우저로 열리는 링크는 URL 바가 표시됨
Nachocode.browser.openLink('https://nachocode.io', 'internal');
사용 사례: 보안이 중요한 페이지
// 보안이 중요한 페이지는 URL 바를 숨겨서 표시
function openSecurePage(page) {
Nachocode.browser.setInternalBrowser({ usingUrl: false });
Nachocode.browser.openLink(page, 'internal');
}
// 일 반 콘텐츠 페이지는 URL 바를 표시
function openContentPage(page) {
Nachocode.browser.setInternalBrowser({ usingUrl: true });
Nachocode.browser.openLink(page, 'internal');
}