@capgo/capacitor-inappbrowser gives Capacitor apps two browser paths: open() 관리되는 네이티브 웹뷰를 사용하여 앱이 사이즈, 숨기기, 메시지, 스크립트, 프록시, layering을 Ionic UI와 함께 사용할 수 있습니다. openWebView() for the system browser experience and
페이지가 단순한 외부 브라우저보다 더 많은 기능이 필요할 때 사용하세요: OAuth 및 체크아웃 흐름, 임베디드 지원 포털, 결제 화면, 비디오 호출, 문서 포털, 인터랙티브 웹 앱, 또는 앱이 라이브 웹 콘텐츠 주변에서 원시 제어를 필요로 하는 모든 흐름.
패키지 이름이 바뀌었습니다.일반적인 사용 사례
‘일반적인 사용 사례’라는 제목이 있는 섹션- Ionic 또는 Capacitor UI를 라이브 브라우저 페이지 위에 표시하세요.
toBack,sendToBack(),bringToFront(),transparentBackground, 그리고dispatchInputEvent(). - 부분 화면 브라우저, 하단 시트, 그리고 picture-in-picture 웹뷰를 만들 수 있습니다.
width,height,x,y, 그리고updateDimensions(). - Android 및 iOS에서 사용자가 커스텀 사이즈 브라우저 프레임 외부에서 Capacitor 앱을 탭할 수 있습니다.
- 체크아웃, 로그인, 지원, 또는 계정-switching 흐름을 사용하여 영구적인 웹사이트 저장소 없이 실행할 수 있습니다.
persistWebViewData: false그리고clearAllBrowsingData(). - 다중 브라우저 인스턴스를 로드하여
hidden,hide()와show()페이지 상태를 보존하는 동안 - 고급 웹 앱을 임베드하여 요청 프록싱, 파일 업로드, 다운로드, 팝업 제어, Google Pay 지원, 링크 처리 및 앱-페이지 메시징이 필요합니다.
_blank기본 기능
open- 사용자 정의 툴바, 크기, 네이티브 네비게이션, 메시징, 스크립팅, 프록시, 다운로드, 팝업 및 데이터 제어를 지원하는 관리형 네이티브 WebView를 열거나SFSafariViewController- 관리형 브라우저를 __CAPGO_KEEP_0__ 호스트 WebView 뒤에 또는 위에 이동하거나openWebView- 네이티브 앱 UI 뒤의 브라우저로 클릭, 터치 및 스크롤 이벤트를 전달하거나sendToBack/bringToFront- Moves a managed browser behind or above the Capacitor host WebView.dispatchInputEvent기본 기능updateDimensions- 페이지를 다시 로드하지 않고 WebView 크기 및 위치를 변경합니다.hide/show- 관리되는 WebView를 로드하고 제거하거나 원래 표시를 복원하는 동안 관리됩니다.postMessage/executeScript- 관리되는 페이지 내부에서 실행 중인 JavaScript와 Capacitor 앱을 연결합니다.clearAllBrowsingData/persistWebViewData- 쿠키, 캐시, 저장소, IndexedDB 및 세션 지속성을 제어합니다.handleDownloads- 프록시 규칙 및 팝업 이벤트 - 문서 포털, 업로드 흐름, 결제 페이지 및 임베디드 웹 앱을 지원합니다.
공개 API
제목 ‘공개 API’| 메서드 | 설명 |
|---|---|
goBack | WebView의 히스토리에서 뒤로 가서 가능한 경우. |
open | URL을 새로운 창에서 풀 스크린으로 열기, 안드로이드에서는 Chrome Custom Tabs를 사용하고 iOS에서는 SFSafariViewController를 사용합니다. |
clearCookies | URL의 쿠키를 삭제할 때 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 | 도구栏과 향상된 기능, chẳng hạn như 카메라 접근, 파일 접근, 이벤트 듣기, 자바스크립트 주입, 양방향 통신 등이 있는 새로운 웹뷰에서 URL을 열어줍니다. |
executeScript | InAppBrowser 창에 자바스크립트 code를 주입합니다. id omitted, 열린 모든 웹뷰에서 실행됩니다. |
postMessage | 웹뷰 (인앱 브라우저)로 이벤트를 보냅니다. 페이지에서 window.addEventListener('messageFromNative', listenerFunc)을 사용하여 듣습니다. detail 웹뷰 (인앱 브라우저)로 이벤트를 보냅니다. 페이지에서 id 을 사용하여 듣습니다. |
takeScreenshot | 웹뷰 (인앱 브라우저)로 이벤트를 보냅니다. 페이지에서 id 활성 웹뷰를 대상으로 함. |
setUrl | 웹뷰의 URL을 설정합니다. 웹뷰가 활성화되어 있을 때는 생략할 수 있습니다. id 활성 웹뷰를 대상으로 함. |
addListener | openWebView만 해당하는 경우 URL 변경을 듣습니다. |
addListener | openWebView만 해당하는 경우 buttonNearDoneClick; 웹뷰에서 보내진 데이터가 포함되어 있습니다. id. |
addListener | openWebView에서만 클릭 시 닫기 버튼을 듣습니다. |
addListener | 사용자가 확인 버튼을 클릭할 때 발생합니다. openWebView의 shareDisclaimer와 closeModal을 사용합니다. |
addListener | 웹뷰에서 앱으로 이벤트를 보냈을 때 발생합니다. window.mobileApp.postMessage(...) 페이지에서 사용할 수 있으며, 데이터가 JSON-serializable해야 합니다. |
addListener | 이 플러그인 API에서, 네이티브 스크린샷 버튼, 또는 주입된 자바스크립트 브리지를 통해 스크린샷이 캡처될 때 발생합니다. |
addListener | 페이지가 로드될 때 발생합니다. |
addListener | 페이지 로드 오류 시 트리거됩니다. |
addListener | 로컬 파일로 저장한 후 네이티브 다운로드 처리가 완료되면 트리거됩니다. 이 옵션을 활성화하려면 handleDownloads: true 웹뷰를 열 때 트리거됩니다. |
addListener | 네이티브 다운로드 처리가 실패하면 트리거됩니다. 이 옵션을 활성화하려면 handleDownloads: true 웹뷰를 열 때 트리거됩니다. |
addListener | 페이지가 팝업/새 창을 열 때 트리거됩니다. 반환된 팝업 아이디를 사용하여 executeScript, postMessage, show, hide, close. |
addListener | 네이티브 런타임이 위임한 프록시 요청을 듣습니다. 대신 addProxyHandler() 직접 호출하는 대신 |
addListener | 사용합니다. captureConsoleLogs: true 웹뷰를 열 때 JavaScript 콘솔 출력을 듣습니다. 이 옵션을 활성화하려면 |
handleProxyRequest | 웹뷰를 열 때 트리거됩니다. addProxyHandler() 원본을 native로 다시 보내는 proxy 결정 전송. phase 수동 응답 시 사용. proxyRequest 리스너. |
removeAllListeners | 이 플러그인을 위한 모든 리스너 제거. |
reload | 현재 웹 페이지 다시 로드. |
updateDimensions | 웹뷰 크기 및 위치를 런타임에 변경할 수 있도록 웹뷰 크기 및 위치를 업데이트합니다. id omitted일 때, 현재 활성화된 웹뷰를 대상으로합니다. |
setEnabledSafeTopMargin | 웹뷰의 활성화된 위쪽 안전 여유 공간을 런타임에 설정합니다. omitted일 때, 현재 활성화된 웹뷰를 대상으로합니다. 웹에서 이 메서드는 레이아웃 변경 없이 해결됩니다. id 웹뷰의 활성화된 아래쪽 안전 여유 공간을 런타임에 설정합니다. omitted일 때, 현재 활성화된 웹뷰를 대상으로합니다. 웹에서 이 메서드는 레이아웃 변경 없이 해결됩니다. |
setEnabledSafeBottomMargin | 보안 OAuth2 창을 열습니다. 웹에서, 리디렉션된 URL을 리턴합니다. id is omitted, targets the active webview. On Web, this method is a no-op and resolves without changing layout. |
openSecureWindow | Opens a secure OAuth2 window. On web, return the redirected URL through a 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/capgo-inappbrowser
‘capgo에서 계속하기 @capacitor/capgo-inappbrowser’이라는 제목의 섹션Capgo의 __CAPGO_KEEP_0__/__CAPGO_KEEP_1__-inappbrowser 플러그인을 사용 중이라면 capgo/capacitor-inappbrowser __CAPGO_KEEP_0__/__CAPGO_KEEP_1__-inappbrowser을 사용하여 Capgo의 capgo/capacitor-inappbrowser 플러그인을 사용하여 Capgo의 capgo/capacitor-inappbrowser 플러그인을 사용하여 native 기능을 연결합니다. Capgo 플러그인 디렉토리 Capgo 제품 워크플로우를 위한 플러그인 디렉토리 Capacitor Capgo에서 제공하는 플러그인 Capacitor Capgo 구현 세부사항을 위한 플러그인 플러그인 추가 또는 업데이트 플러그인 추가 또는 업데이트 구현 세부사항을 위한 플러그인, 그리고 아이오닉 엔터프라이즈 플러그인 대체 아이오닉 엔터프라이즈 플러그인 대체 제품 워크플로우를 위한 플러그인.