@capgo/capacitor-inappbrowser Capacitor 앱은 시스템 브라우저 경험과 open() 관리되는 네이티브 WebView를 위한 경로를 제공합니다. openWebView() 관리되는 네이티브 WebView는 앱이 Ionic UI와 함께 사이즈, 숨기기, 메시지, 스크립트, 프록시, 레이어링을 할 수 있도록 합니다.
페이지가 단순한 외부 브라우저보다 더 많은 기능이 필요할 때 사용하세요: OAuth 및 체크아웃 흐름, 임베디드 지원 포털, 결제 화면, 비디오 호출, 문서 포털, 인터랙티브 웹 앱, 또는 앱이 라이브 웹 콘텐츠 주변에서 원본 제어를 필요로 하는 모든 흐름.
패키지 이름이 바뀌었습니다.일반적인 사용 사례
‘일반적인 사용 사례’라는 제목- 라이브 브라우저 페이지 위에 Ionic 또는 Capacitor UI를 표시하세요.
toBack,sendToBack(),bringToFront(),transparentBackground, 그리고dispatchInputEvent(). - 부분 화면 브라우저, 하단 시트, 그리고 picture-in-picture 웹뷰를 빌드하세요.
width,height,x,y, 그리고updateDimensions(). - Android 및 iOS에서 사용자가 커스텀 사이즈 브라우저 프레임 외부에 Capacitor 앱을 탭할 수 있도록 해주세요.
- 체크아웃, 로그인, 지원, 또는 계정-switching 흐름을 사용하여 영구적인 웹사이트 저장소를 사용하지 않고 실행하세요.
persistWebViewData: falseandclearAllBrowsingData(). - 다중 브라우저 인스턴스를 로드하고
hidden,hide(), 및show()페이지 상태를 보존하는 동안 - 구글 페이 지원, 링크 처리, 앱-페이지 메시징, 파일 업로드, 다운로드, 팝업 제어, 요청 프록싱을 필요로 하는 고급 웹 앱을 임베드합니다.
_blank핵심 기능
open- 사용자 정의 툴바, 크기, 네이티브 네비게이션, 메시징, 스크립팅, 프록시, 다운로드, 팝업, 데이터 제어를 지원하는 관리형 네이티브 WebView를 열거나SFSafariViewController- 관리형 브라우저를 __CAPGO_KEEP_0__ 호스트 WebView 뒤로 또는 위로 이동하거나openWebView- 네이티브 앱 UI 뒤의 브라우저로 클릭, 터치, 스크롤 이벤트를 전달하거나sendToBack/bringToFront- Moves a managed browser behind or above the Capacitor host WebView.dispatchInputEvent- 사용자 정의 툴바, 크기, 네이티브 네비게이션, 메시징, 스크립팅, 프록시, 다운로드, 팝업, 데이터 제어를 지원하는 관리형 네이티브 WebView를 열거나updateDimensions- 페이지를 다시 로드하지 않고 관리된 WebView 크기 및 위치를 변경합니다.hide/show- 관리된 WebView를 로드하고 native 표시를 제거하거나 복원하는 동안 로드합니다.postMessage/executeScript- Capacitor 앱을 관리된 페이지 내부에서 실행 중인 JavaScript와 연결합니다.clearAllBrowsingData/persistWebViewData- 쿠키, 캐시, 저장소, IndexedDB 및 세션 지속성을 제어합니다.handleDownloads- 프록시 규칙 및 팝업 이벤트 - 문서 포털, 업로드 흐름, 결제 페이지 및 임베디드 웹 앱을 지원합니다.
공개 API
제목: 공개 API| 메서드 | 설명 |
|---|---|
goBack | WebView의 히스토리에서 뒤로 가는 경우 가능합니다. |
open | 새 창에서 URL을 열고, 안드로이드에서는 Chrome Custom Tabs를 사용하고, iOS에서는 SFSafariViewController를 사용합니다. |
clearCookies | URL의 쿠키를 지웁니다. When id omitted, 모든 열린 웹 뷰에 적용됩니다. |
clearAllCookies | Clear all cookies When id omitted, 모든 열린 웹 뷰에 적용됩니다. |
clearCache | Clear cache When id omitted, 모든 열린 웹 뷰에 적용됩니다. |
clearAllBrowsingData | 기본 저장소 및 관리되는 WebView에서 쿠키, 캐시, 로컬 스토리지, 세션 스토리지, IndexedDB 및 다른 브라우징 데이터를 삭제합니다. |
getCookies | 특정 URL에 대한 쿠키를 가져옵니다. |
close | 웹 뷰를 닫습니다. When id omitted, 활성 웹 뷰를 닫습니다. |
hide | 웹 뷰를 숨깁니다. 닫지 않습니다. show()를 사용하여 다시 나타낼 수 있습니다. When id omitted, 활성 웹 뷰를 대상으로합니다. |
show | 이전으로 숨겨진 웹 뷰를 표시합니다. When id omitted, 대상은 활성 웹뷰를 목표로합니다. |
sendToBack | Moves the native browser behind the Capacitor host WebView so app UI can appear above it. |
bringToFront | 호스트 WebView 뒤의 브라우저를 앞으로 다시 이동합니다. |
dispatchInputEvent | 관리 브라우저로 클릭, 터치 또는 스크롤 입력을 전달합니다. 좌표는 브라우저 뷰포트에 상대적입니다. |
openWebView | 도구栏과 향상된 기능(카메라 접근, 파일 접근, 이벤트 듣기, 자바스크립트 주입, 양방향 통신 등)을 지원하는 새로운 웹뷰에서 URL을 열 수 있습니다. |
executeScript | InAppBrowser 창에 자바스크립트 code를 주입합니다. id omitted, 열린 모든 웹뷰에서 실행됩니다. |
postMessage | 웹뷰(인앱 브라우저)로 이벤트를 전송합니다. 페이지에서 window.addEventListener('messageFromNative', listenerFunc)을 사용하여 이벤트를 듣습니다. detail payload는 JSON-serializable해야 합니다. omitted, 열린 모든 웹뷰로 방송합니다. id 현재 웹뷰 뷰포트를 PNG 스크린샷으로 캡처합니다. |
takeScreenshot | omitted, 대상은 활성 웹뷰를 목표로합니다. id 활성 웹뷰를 대상으로 함. |
setUrl | 웹뷰의 URL을 설정합니다. 웹뷰가 활성화되어 있을 때는 생략할 수 있습니다. id 활성 웹뷰를 대상으로 함. |
addListener | 웹뷰 URL이 변경될 때만, openWebView만 대상입니다. |
addListener | 웹뷰에서 발생하는 이벤트를 수신합니다. openWebView에서만 사용합니다. buttonNearDoneClick; 웹뷰에서 발생하는 이벤트의 내용을 포함합니다. id. |
addListener | 웹뷰가 닫힐 때만, openWebView만 대상입니다. |
addListener | 사용자가 확인 버튼을 클릭했을 때 발생합니다. openWebView에서 shareDisclaimer와 closeModal을 사용합니다. |
addListener | 웹뷰가 이벤트를 앱으로 전송할 때 발생합니다. openWebView에서만 사용합니다. window.mobileApp.postMessage(...) 페이지에서 사용할 수 있는 함수입니다. payload의 내용을 JSON으로 직렬화할 수 있어야 합니다. |
addListener | 이 플러그인 API에서, 네이티브 스크린샷 버튼, 또는 주입된 자바스크립트 브리지를 통해 캡처된 스크린샷이 발생할 때마다 발생합니다. |
addListener | 페이지가 로드될 때 발생합니다. |
addListener | 페이지 로드 오류 시 트리거됩니다. |
addListener | 로컬 파일로 저장된 파일을 처리한 후에 트리거됩니다. 이 옵션을 활성화하려면 handleDownloads: true 웹뷰를 열 때. |
addListener | 로컬 파일로 저장된 파일을 처리하는 데 실패했을 때 트리거됩니다. 이 옵션을 활성화하려면 handleDownloads: true 웹뷰를 열 때. |
addListener | 페이지가 팝업/새 창을 열 때마다 트리거됩니다. 반환된 팝업 ID를 사용하여 executeScript, postMessage, show, hide, close. |
addListener | 웹뷰를 열 때. addProxyHandler() 자바스크립트 콘솔 출력을 감지하여 관리되는 페이지에서 발생하는 콘솔 메시지를 수신합니다. 이 옵션을 활성화하려면 |
addListener | 웹뷰를 열 때. captureConsoleLogs: true 자바스크립트 콘솔 출력을 감지하여 관리되는 페이지에서 발생하는 콘솔 메시지를 수신합니다. 이 옵션을 활성화하려면 |
handleProxyRequest | 웹뷰를 열 때. addProxyHandler() 원본을 native로 다시 보내는 proxy 결정 전송. phase 수동 응답을 할 때. proxyRequest 리스너. |
removeAllListeners | 이 플러그인을 위한 모든 리스너 제거. |
reload | 현재 웹 페이지를 다시 로드. |
updateDimensions | 웹뷰 크기 및 위치를 런타임에 변경할 수 있도록 웹뷰 크기 및 위치를 업데이트합니다. id omitted일 때, 현재 활성 웹뷰를 대상으로합니다. |
setEnabledSafeTopMargin | 웹뷰의 활성화된 위쪽 안전 여유 공간을 런타임에 설정합니다. 웹에서 이 메서드는 레이아웃 변경 없이 무효화됩니다. id omitted일 때, 현재 활성 웹뷰를 대상으로합니다. 웹에서 이 메서드는 레이아웃 변경 없이 무효화됩니다. |
setEnabledSafeBottomMargin | 웹뷰의 활성화된 아래쪽 안전 여유 공간을 런타임에 설정합니다. 웹에서 이 메서드는 레이아웃 변경 없이 무효화됩니다. id omitted일 때, 현재 활성 웹뷰를 대상으로합니다. 웹에서 이 메서드는 레이아웃 변경 없이 무효화됩니다. |
openSecureWindow | 보안 OAuth2 창을 열어줍니다. 웹에서 리디렉션된 URL을 반환합니다. BroadcastChannel; 모바일에서, 앱 구성에서 커스텀 리다이렉트 URI를 등록하세요. 자세한 HTML, Info.plist, AndroidManifest 예제는 getting-started 가이드를 참조하세요. |
Reference Values
Reference Values이 값을 툴바 옵션과 함께 인앱 브라우저 또는 WebView를 열 때 사용하세요.
Toolbar Types
Section titled “Toolbar Types”| Value | 사용자는 |
|---|---|
activity | 닫기 및 공유 제어를 포함한 단순한 툴바를 찾을 것입니다. |
compact | 닫기 제어만 포함한 단순한 툴바를 찾을 것입니다. |
navigation | 뒤로 및 앞으로 제어를 포함한 풀 네비게이션 툴바를 찾을 것입니다. |
blank | 툴바가 없습니다. |
실제 데이터의 근거
‘실제 데이터의 근거’라는 제목의 섹션이 참조는 src/definitions.ts 내 capacitor-inappbrowser.
capgo에서 계속하기 @capacitor-inappbrowser
‘capgo에서 계속하기 @capacitor-inappbrowser’라는 제목의 섹션Capgo의 @capgo/capacitor-inappbrowser Capgo의 @capgo/capacitor-inappbrowser Capgo의 @capgo/capacitor-inappbrowser을 사용하여 native 플러그인 작업을 계획하고, Capgo 플러그인 디렉토리 Capgo 플러그인 디렉토리에서 제품 워크플로우를 위해 Capacitor Capgo에 의해 플러그인 Capacitor 플러그인에 의해 Capgo 구현 세부 사항을 위해 플러그인 추가 또는 업데이트 플러그인 추가 또는 업데이트 구현 세부 사항을 위해, 및 아이온틱 엔터프라이즈 플러그인 대체 아이온틱 엔터프라이즈 플러그인 대체 제품 워크플로우를 위해