This repository has been archived on 2023-11-19. You can view files and clone it, but cannot push or open issues or pull requests.
goober-ionic/plugins/cordova-plugin-inappbrowser/doc/ko/index.md
2018-07-15 19:24:48 -07:00

15 KiB

cordova-plugin-inappbrowser

이 플러그인 코르도바를 호출할 때 표시 하는 웹 브라우저 보기를 제공 합니다.InAppBrowser.open().

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');

코르도바입니다.InAppBrowser.open() 함수 window.open () 함수에 대 한 대체품 정의 됩니다. 기존의 window.open () 호출 window.open을 대체 하 여 InAppBrowser 윈도우를 사용할 수 있습니다.

window.open = cordova.InAppBrowser.open;

InAppBrowser 창 표준 웹 브라우저 처럼 동작 및 코르도바 Api에 액세스할 수 없습니다. 이 이유는 InAppBrowser는 것이 좋습니다는 주요 코르도바 webview로 로드 하는 대신 제 3 자 (신뢰할 수 없는) 콘텐츠를 로드 해야 할 경우. InAppBrowser는 허용 될 수도 시스템 브라우저에서 링크를 여는.

사용자에 대 한 자체 GUI 컨트롤에서 기본적으로 제공 된 InAppBrowser (뒤로, 앞으로, 완료).

대 한 뒤 호환성,이 플러그인도 window.open 후크. 그러나, window.open의 플러그인 설치 후크를 가질 수 있습니다 의도 하지 않은 부작용 (특히 경우이 플러그인이 다른 플러그인 종속성 으로만 포함). window.open 후크 주요 릴리스에서 제거 됩니다. 후크 플러그인에서 제거 될 때까지 애플 리 케이 션 수 있습니다 수동으로 기본 동작을 복원 하 게 됩니다.

delete window.open // Reverts the call back to it's prototype's default

window.open 전역 범위에 있지만 InAppBrowser 제공 되지 않습니다 때까지 deviceready 이벤트 후.

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    console.log("window.open works well");
}

설치

cordova plugin add cordova-plugin-inappbrowser

InAppBrowser를 통해가 서 당신의 애플 리 케이 션에서 모든 페이지를 로드 하려는 경우 초기화 하는 동안 window.open 간단 하 게 연결할 수 있습니다. 예를 들어:

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    window.open = cordova.InAppBrowser.open;
}

cordova.InAppBrowser.open

InAppBrowser 인스턴스, 현재 브라우저 인스턴스 또는 시스템 브라우저에서 URL을 엽니다.

var ref = cordova.InAppBrowser.open(url, target, options);
  • 심판:에 대 한 참조는 InAppBrowser 창. (InAppBrowser)

  • url: (문자열)를로드 하는 URL. 전화 encodeURI() 이 경우에는 URL 유니코드 문자를 포함 합니다.

  • 대상: 대상 URL, 기본적으로 선택적 매개 변수를 로드 하는 _self . (문자열)

    • _self: URL 화이트 리스트에 있으면 코르도바 WebView에서 열리고, 그렇지 않으면 열에InAppBrowser.
    • _blank: 준공에InAppBrowser.
    • _system: 시스템의 웹 브라우저에서 엽니다.
  • 옵션: 옵션은 InAppBrowser . 선택적, 디폴트에: location=yes . (문자열)

    options문자열 텅 빈 어떤 스페이스 포함 해서는 안 그리고 쉼표 각 기능의 이름/값 쌍을 구분 합니다. 기능 이름은 대/소문자입니다. 모든 플랫폼 지원 아래 값:

    • 위치: 설정 yes 또는 no 설정 하는 InAppBrowser 의 위치 표시줄 켜거나 끕니다.

    안 드 로이드만:

    • 숨겨진: 설정 yes 브라우저를 만들 페이지를 로드 하면, 하지만 그것을 보여주지. Loadstop 이벤트는 로드가 완료 되 면 발생 합니다. 생략 하거나 설정 no (기본값) 브라우저 열고 정상적으로 로드 해야 합니다.
    • clearcache: 설정 yes 브라우저를 쿠키 캐시 삭제 하기 전에 새 창이 열립니다
    • clearsessioncache: 설정 yes 세션 쿠키 캐시를 삭제 하기 전에 새 창이 열립니다

    iOS만:

    • closebuttoncaption: 수행 하는 단추의 캡션으로 사용할 문자열을 설정 합니다. 참고 직접이 값을 지역화 해야 합니다.
    • disallowoverscroll: 설정 yes 또는 no (기본값은 no ). 회전 온/오프 UIWebViewBounce 속성입니다.
    • 숨겨진: 설정 yes 브라우저를 만들 페이지를 로드 하면, 하지만 그것을 보여주지. Loadstop 이벤트는 로드가 완료 되 면 발생 합니다. 생략 하거나 설정 no (기본값) 브라우저 열고 정상적으로 로드 해야 합니다.
    • clearcache: 설정 yes 브라우저를 쿠키 캐시 삭제 하기 전에 새 창이 열립니다
    • clearsessioncache: 설정 yes 세션 쿠키 캐시를 삭제 하기 전에 새 창이 열립니다
    • 도구 모음: 설정 yes 또는 no InAppBrowser (기본값:에 대 한 도구 모음 온 / 오프를 돌기 위하여yes)
    • enableViewportScale: 설정 yes 또는 no 뷰포트 메타 태그 (기본값:를 통해 확장을 방지 하기 위해no).
    • mediaPlaybackRequiresUserAction: 설정 yes 또는 no HTML5 오디오 또는 비디오 자동 재생 (기본값에서에서 방지 하기 위해no).
    • allowInlineMediaPlayback: 설정 yes 또는 no 인라인 HTML5 미디어 재생, 장치 전용 재생 인터페이스 보다는 브라우저 창 내에서 표시할 수 있도록 합니다. HTML의 video 요소가 포함 되어야 합니다는 webkit-playsinline 특성 (기본값:no)
    • keyboardDisplayRequiresUserAction: 설정 yes 또는 no 양식 요소는 자바 스크립트를 통해 포커스를 받을 때 키보드를 열고 focus() 전화 (기본값:yes).
    • suppressesIncrementalRendering: 설정 yes 또는 no (기본값을 렌더링 하기 전에 모든 새로운 보기 콘텐츠를 받을 때까지 기다려야no).
    • presentationstyle: 설정 pagesheet , formsheet 또는 fullscreen 프레 젠 테이 션 스타일 (기본값을 설정 하려면fullscreen).
    • transitionstyle: 설정 fliphorizontal , crossdissolve 또는 coververtical 전환 스타일 (기본값을 설정 하려면coververtical).
    • toolbarposition: 설정 top 또는 bottom (기본값은 bottom ). 위쪽 또는 아래쪽 창에 도구 모음을 발생 합니다.

    Windows에만 해당:

    • 숨겨진: 설정 yes 브라우저를 만들 페이지를 로드 하면, 하지만 그것을 보여주지. Loadstop 이벤트는 로드가 완료 되 면 발생 합니다. 생략 하거나 설정 no (기본값) 브라우저 열고 정상적으로 로드 해야 합니다.

지원 되는 플랫폼

  • 아마존 화재 운영 체제
  • 안 드 로이드
  • 블랙베리 10
  • Firefox 운영 체제
  • iOS
  • 윈도우 8과 8.1
  • Windows Phone 7과 8

예를 들어

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
var ref2 = cordova.InAppBrowser.open(encodeURI('http://ja.m.wikipedia.org/wiki/ハングル'), '_blank', 'location=yes');

파이어 폭스 OS 단점

플러그인 어떤 디자인을 적용 하지 않는 경우 열 일부 CSS의 규칙을 추가할 필요가 있다 target='_blank'. 이 같이 규칙

 css
.inAppBrowserWrap {
  background-color: rgba(0,0,0,0.75);
  color: rgba(235,235,235,1.0);
}
.inAppBrowserWrap menu {
  overflow: auto;
  list-style-type: none;
  padding-left: 0;
}
.inAppBrowserWrap menu li {
  font-size: 25px;
  height: 25px;
  float: left;
  margin: 0 10px;
  padding: 3px 10px;
  text-decoration: none;
  color: #ccc;
  display: block;
  background: rgba(30,30,30,0.50);
}
.inAppBrowserWrap menu li.disabled {
    color: #777;
}

InAppBrowser

Cordova에 대 한 호출에서 반환 하는 개체.InAppBrowser.open.

메서드

  • addEventListener
  • removeEventListener
  • close
  • show
  • executeScript
  • insertCSS

addEventListener

이벤트에 대 한 수신기를 추가 합니다InAppBrowser.

ref.addEventListener(eventname, callback);
  • 심판:에 대 한 참조는 InAppBrowser(InAppBrowser)

  • eventname: (문자열)를 수신 하도록 이벤트

    • loadstart: 이벤트 발생 때는 InAppBrowser URL 로드를 시작 합니다.
    • loadstop: 이벤트가 발생 시기는 InAppBrowser URL 로드 완료.
    • loaderror: 이벤트 발생 때는 InAppBrowser URL을 로드할 때 오류가 발생 합니다.
    • 종료: 이벤트가 발생 시기는 InAppBrowser 창이 닫힙니다.
  • 콜백: 이벤트가 발생 될 때 실행 되는 함수. 함수는 전달 된 InAppBrowserEvent 개체를 매개 변수로 합니다.

InAppBrowserEvent 속성

  • 유형: eventname, 중 loadstart , loadstop , loaderror , 또는 exit . (문자열)

  • url: URL 로드 된. (문자열)

  • 코드: 오류 코드의 경우에만 loaderror . (수)

  • 메시지: 오류 메시지의 경우에만 loaderror . (문자열)

지원 되는 플랫폼

  • 아마존 화재 운영 체제
  • 안 드 로이드
  • iOS
  • 윈도우 8과 8.1
  • Windows Phone 7과 8

빠른 예제

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
ref.addEventListener('loadstart', function(event) { alert(event.url); });

removeEventListener

이벤트에 대 한 수신기를 제거 합니다InAppBrowser.

ref.removeEventListener(eventname, callback);
  • 심판:에 대 한 참조는 InAppBrowser 창. (InAppBrowser)

  • eventname: 이벤트 수신 대기를 중지 합니다. (문자열)

    • loadstart: 이벤트 발생 때는 InAppBrowser URL 로드를 시작 합니다.
    • loadstop: 이벤트가 발생 시기는 InAppBrowser URL 로드 완료.
    • loaderror: 이벤트 발생 때는 InAppBrowser URL 로드 오류가 발생 합니다.
    • 종료: 이벤트가 발생 시기는 InAppBrowser 창이 닫힙니다.
  • 콜백: 이벤트가 발생 하면 실행할 함수. 함수는 전달 된 InAppBrowserEvent 개체.

지원 되는 플랫폼

  • 아마존 화재 운영 체제
  • 안 드 로이드
  • iOS
  • 윈도우 8과 8.1
  • Windows Phone 7과 8

빠른 예제

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
var myCallback = function(event) { alert(event.url); }
ref.addEventListener('loadstart', myCallback);
ref.removeEventListener('loadstart', myCallback);

close

종료는 InAppBrowser 창.

ref.close();
  • 심판:에 대 한 참조는 InAppBrowser(InAppBrowser)

지원 되는 플랫폼

  • 아마존 화재 운영 체제
  • 안 드 로이드
  • Firefox 운영 체제
  • iOS
  • 윈도우 8과 8.1
  • Windows Phone 7과 8

빠른 예제

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
ref.close();

show

숨겨진 열은 한 InAppBrowser 창을 표시 합니다. 전화는 InAppBrowser가 이미 보이는 경우는 효과가 없습니다.

ref.show();
  • ref: InAppBrowser 창 (참조InAppBrowser)

지원 되는 플랫폼

  • 아마존 화재 운영 체제
  • 안 드 로이드
  • iOS
  • 윈도우 8과 8.1

빠른 예제

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'hidden=yes');
// some time later...
ref.show();

executeScript

에 자바 스크립트 코드를 삽입는 InAppBrowser

ref.executeScript(details, callback);
  • 심판:에 대 한 참조는 InAppBrowser 창. (InAppBrowser)

  • injectDetails: 스크립트 실행의 세부 사항 중 하나를 지정 하는 file 또는 code 키. (개체)

    • 파일: 삽입 하는 스크립트의 URL.
    • 코드: 스크립트 텍스트를 삽입 합니다.
  • 콜백: 자바 스크립트 코드를 주입 후 실행 기능.

    • 삽입 된 스크립트 유형의 경우 code , 스크립트의 반환 값은 단일 매개 변수는 콜백 실행에 싸여 있는 Array . 여러 줄 스크립트에 대 한 마지막 문 또는 평가 마지막 식의 반환 값입니다.

지원 되는 플랫폼

  • 아마존 화재 운영 체제
  • 안 드 로이드
  • iOS
  • 윈도우 8과 8.1

빠른 예제

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
ref.addEventListener('loadstop', function() {
    ref.executeScript({file: "myscript.js"});
});

insertCSS

주사로 CSS는 InAppBrowser 창.

ref.insertCSS(details, callback);
  • 심판:에 대 한 참조는 InAppBrowser(InAppBrowser)

  • injectDetails: 스크립트 실행의 세부 사항 중 하나를 지정 하는 file 또는 code 키. (개체)

    • 파일: 삽입 하는 스타일 시트의 URL.
    • 코드: 삽입 하는 스타일 시트의 텍스트.
  • 콜백: CSS 주입 후 실행 기능.

지원 되는 플랫폼

  • 아마존 화재 운영 체제
  • 안 드 로이드
  • iOS

빠른 예제

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes');
ref.addEventListener('loadstop', function() {
    ref.insertCSS({file: "mystyles.css"});
});