해당 기능은 노티플라이 JS SDK @notifly-tech/notifly-js-sdk 2.17.8 이상 버전부터 지원됩니다.
외부 브라우저에서 열기로 설정하면, JS SDK가 target="_blank" 속성을 사용하여 외부 브라우저에서 링크를 엽니다. 일반 모바일 브라우저(Chrome, Safari 등)에서는 별도 설정 없이 정상 동작합니다.
하지만 네이티브 앱의 웹뷰 환경에서는 target="_blank"가 기본적으로 지원되지 않아, 아래와 같이 링크가 무시될 수 있습니다:
| 플랫폼 | 기본 동작 | 원인 |
|---|
| Android 웹뷰 | 같은 웹뷰에서 열리거나 무시됨 | setSupportMultipleWindows 기본값이 false |
| iOS WKWebView | 클릭해도 아무 반응 없음 | WKUIDelegate의 createWebViewWith 미구현 시 무시 |
웹뷰를 직접 구현하지 않고 노티플라이 Android SDK 또는 iOS SDK만 사용하는 경우(인앱 팝업), SDK 내부에서 이 처리가 포함되어 있으므로 별도 설정이 필요 없습니다. 플랫폼별 설정 가이드
Android 웹뷰는 기본적으로 target="_blank"를 무시합니다. 아래 두 단계를 모두 적용해야 합니다.1단계: 웹뷰 멀티 윈도우 지원 활성화
웹뷰가 새 창 열기 요청을 처리할 수 있도록 설정합니다.webView.settings.setSupportMultipleWindows(true)
webView.settings.javaScriptCanOpenWindowsAutomatically = true
WebSettings settings = webView.getSettings();
settings.setSupportMultipleWindows(true);
settings.setJavaScriptCanOpenWindowsAutomatically(true);
2단계: 새 창 열기 요청을 외부 브라우저로 전달
1단계에서 멀티 윈도우를 활성화하면, target="_blank" 클릭 시 WebChromeClient의 onCreateWindow()가 호출됩니다. 이 메서드에서 URL을 추출하여 기기의 기본 브라우저로 전달합니다.import android.content.Intent
import android.os.Message
import android.webkit.WebChromeClient
import android.webkit.WebResourceRequest
import android.webkit.WebView
import android.webkit.WebViewClient
webView.webChromeClient = object : WebChromeClient() {
override fun onCreateWindow(
view: WebView, isDialog: Boolean,
isUserGesture: Boolean, resultMsg: Message?
): Boolean {
// 임시 웹뷰를 생성하여 URL을 가로챕니다
val tempWebView = WebView(view.context)
tempWebView.webViewClient = object : WebViewClient() {
override fun shouldOverrideUrlLoading(
view: WebView, request: WebResourceRequest
): Boolean {
// 가로챈 URL을 기기의 기본 브라우저에서 엽니다
val intent = Intent(Intent.ACTION_VIEW, request.url)
view.context.startActivity(intent)
return true
}
}
// 웹뷰 전송 객체를 통해 임시 웹뷰에 연결합니다
val transport = resultMsg?.obj as? WebView.WebViewTransport
transport?.webView = tempWebView
resultMsg?.sendToTarget()
return true
}
}
import android.content.Intent;
import android.os.Message;
import android.webkit.WebChromeClient;
import android.webkit.WebResourceRequest;
import android.webkit.WebView;
import android.webkit.WebViewClient;
webView.setWebChromeClient(new WebChromeClient() {
@Override
public boolean onCreateWindow(WebView view, boolean isDialog,
boolean isUserGesture, Message resultMsg) {
// 임시 웹뷰를 생성하여 URL을 가로챕니다
WebView tempWebView = new WebView(view.getContext());
tempWebView.setWebViewClient(new WebViewClient() {
@Override
public boolean shouldOverrideUrlLoading(WebView v, WebResourceRequest request) {
// 가로챈 URL을 기기의 기본 브라우저에서 엽니다
Intent intent = new Intent(Intent.ACTION_VIEW, request.getUrl());
v.getContext().startActivity(intent);
return true;
}
});
// 웹뷰 전송 객체를 통해 임시 웹뷰에 연결합니다
WebView.WebViewTransport transport = (WebView.WebViewTransport) resultMsg.obj;
transport.setWebView(tempWebView);
resultMsg.sendToTarget();
return true;
}
});
이미 WebChromeClient를 사용하고 있다면, 기존 클래스에 onCreateWindow() 메서드만 추가하면 됩니다.
WKWebView는 target="_blank" 링크 클릭 시 WKUIDelegate의 createWebViewWith 메서드를 호출합니다. 이 메서드가 구현되어 있지 않으면 링크가 무시됩니다. 별도의 웹뷰 설정 변경은 필요 없습니다.webView.uiDelegate = self가 이미 설정되어 있다면, 아래 createWebViewWith 메서드만 추가하면 됩니다. nil을 반환하여 새 WKWebView를 생성하지 않고, 대신 Safari(기본 브라우저)에서 URL을 엽니다.// MARK: - WKUIDelegate
extension YourViewController: WKUIDelegate {
func webView(
_ webView: WKWebView,
createWebViewWith configuration: WKWebViewConfiguration,
for navigationAction: WKNavigationAction,
windowFeatures: WKWindowFeatures
) -> WKWebView? {
// target="_blank" 링크를 외부 브라우저(Safari)에서 열기
if let url = navigationAction.request.url {
UIApplication.shared.open(url)
}
return nil
}
}
동작 원리
위 설정을 적용하면 다음과 같은 흐름으로 외부 브라우저가 열립니다:
- 유저가 노티플라이 팝업 버튼을 클릭하면, JS SDK가
target="_blank"로 링크를 엽니다.
- 웹뷰가 새 창 열기 요청을 네이티브 레이어로 위임합니다 (Android:
onCreateWindow, iOS: createWebViewWith).
- 네이티브 코드에서 해당 URL을 추출하여 기기의 기본 브라우저(Chrome, Safari 등)에서 엽니다.
주의사항
- 노티플라이 콘솔에서 팝업의 링크 열기 방식을
외부 브라우저에서 열기로 설정한 경우에만 적용됩니다. 기본값(현재 창에서 열기)인 경우 이 설정과 무관하게 웹뷰 내부에서 링크가 열립니다.
