링크를 받는 방법(HTML)

아티클
12/11/2015

[ 이 문서는 Windows 런타임 앱을 작성하는 Windows에서 8.x 및 Windows Phone 8.x 개발자를 대상으로 합니다. Windows 10용으로 개발하는 경우에는 최신 설명서를 참조하세요.]

사용자가 공유하기를 원하는 일반적인 데이터 형식으로는 링크가 있습니다. 웹 사이트의 문서에서처럼 링크를 직접 공유할 수도 있습니다. 링크 지원은 온라인으로 사용할 수 있는 HTML 또는 콘텐츠를 공유하려는 경우의 보조 옵션으로 유용합니다.

이 항목에서는 원본 앱에서 공유 중인 단일 링크를 받는 방법을 보여 줍니다.

알아야 할 사항

기술

사전 요구 사항

Visual Studio 및 관련 템플릿을 잘 알고 있어야 합니다.
JavaScript에 대해 잘 알고 있어야 합니다.

지침

단계 1: 공유 계약 지원

앱이 공유 콘텐츠를 받을 수 있으려면 먼저 공유 계약을 지원한다고 선언해야 합니다. 기본적으로 이 계약을 통해 시스템에서 앱이 콘텐츠를 받을 수 있음을 확인합니다. Microsoft Visual Studio 템플릿을 사용하여 앱을 만드는 경우 공유 계약을 지원하는 방식은 다음과 같습니다.

디자이너 보기에서 매니페스트 파일 (package.manifest)을 엽니다.
선언 탭을 엽니다.
사용 가능한 선언 목록에서 공유 대상을 선택합니다.
추가를 클릭하여 앱에서 대상 공유 계약에 대한 지원을 추가합니다.

단계 2: 앱에서 링크를 지원하도록 지정

링크를 지원하려면 앱이 URI 형식을 지원하도록 지정해야 합니다.

매니페스트 파일을 엽니다.
데이터 서식 섹션에서 새로 추가를 클릭합니다.
따옴표 없이 "text"를 입력합니다.

이전 단계에서는 다음 섹션을 매니페스트에 추가합니다.

<Extensions>
  <Extension Category="windows.shareTarget">
    <ShareTarget>
      <DataFormat>uri</DataFormat>
    </ShareTarget>
  </Extension>
</Extensions>

참고 앱이 대상 공유 계약에 대해 활성화되면 다른 진입점을 지정할 수 있습니다. 이렇게 하려면 패키지 매니페스트에 있는 대상 공유 선언의 앱 설정 섹션에서 시작 페이지 항목을 수정합니다. 또한 이 페이지에 대한 활성화를 처리하는 별도의 JavaScript 파일을 사용하는 것이 좋습니다. 예제는 콘텐츠 공유 대상 앱 샘플(영문)을 참조하세요.

단계 3: 앱이 활성화되면 이를 검색하는 이벤트 처리기를 추가합니다.

사용자가 콘텐츠를 공유할 앱을 선택하면 시스템에서 해당 앱을 활성화합니다. 다양한 방법으로 앱을 활성화할 수 있기 때문에 활성화된 이유를 검색하는 코드를 추가해야 합니다. 이렇게 하려면 kind 속성의 값을 확인합니다.

app.onactivated = function (args) {
    if (args.detail.kind === activation.ActivationKind.launch) {
        // The application has been launched. Initialize as appropriate.
    } else if (args.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.shareTarget) {
        ...
    }
};

대상 공유 계약에 전용 시작 페이지를 사용하는 경우 kind 속성 확인을 건너뛸 수 있습니다.

단계 4: ShareOperation 개체를 가져옵니다.

ShareOperation 개체에는 앱이 사용자가 공유하려는 콘텐츠를 가져오는 데 필요한 모든 데이터가 포함되어 있습니다.

shareOperation = args.detail.shareOperation;

단계 5: 활성화된 이벤트 처리기에서 신속하게 반환합니다.

activated 이벤트 처리기에서 신속하게 반환해야 합니다. activated 이벤트 처리기에서 비동기 이벤트를 큐에 넣어 활성화된 이벤트가 반환된 후 데이터 공유 처리가 수행되도록 합니다.

WinJS.Application.addEventListener("shareready", shareReady, false);
WinJS.Application.queueEvent({ type: "shareready" });

나머지 단계에서는 shareReady 함수를 구현합니다.

단계 6: DataPackageView에 URI가 포함되어 있는지 확인합니다.

ShareOperation 개체에는 DataPackageView 개체가 포함되어 있습니다. 이 개체는 원본 앱이 데이터를 만드는 데 사용한 DataPackage 개체의 읽기 전용 버전입니다. 이 개체를 사용하여 공유 중인 콘텐츠에 링크가 있는지 확인합니다.

if (shareOperation.data.contains(Windows.ApplicationModel.DataTransfer.StandardDataFormats.uri)) {
    // Code to process URI goes here.
}

앱이 한 가지 형식만 지원하는 경우에도 DataPackage에 원하는 데이터 서식이 포함되어 있는지 확인하는 것이 좋습니다. 이렇게 하면 나중에 다른 데이터 서식 형식 및 파일 서식을 쉽게 지원할 수 있습니다.

단계 7: 링크를 처리합니다.

URI를 가져오려면 DataPackageView.getUriAsync 메서드를 호출합니다.

shareOperation.data.getUriAsync().then(function (uri) {
    if (uri != null) {
        // In this sample, we only display the URI. To output the link using this example, 
        // you need a div tag with an id of "output" in your HTML file.
        // In your app, replace this with whatever is appropriate for your scenario.
        document.getElementById("output").innerText = uri.absoluteUri;
    }
});

단계 8: reportCompleted를 호출합니다.

앱이 콘텐츠 공유를 마치면 reportCompleted를 호출합니다. 이 메서드를 호출하면 시스템에서 앱을 종료합니다.

shareOperation.reportCompleted();

설명

일부 앱은 http://나 https://로 시작하지 않는 URI(Uniform Resource Identifier)를 제공할 수 있습니다. 예를 들어 원본 앱은 사용자가 앱 자체의 콘텐츠를 직접 사용하게 하는 활성화 프로토콜을 제공할 수 있습니다. 앱이 이미 모든 URI를 지원할 수 있는 경우에는 기본적으로 이 기능을 가져옵니다. 앱이 특정 유형의 URI로만 제한되는 경우에는 다음 사항을 고려해야 합니다.

HTML을 지원하는 경우 DataPackage에서 제공된 HTML을 대신 사용합니다.
HTML은 지원하지 않지만 텍스트를 지원하는 경우 DataPackage에서 텍스트를 사용합니다.
위의 옵션이 둘 다 작동하지 않으면 특정 URI를 지원하지 않음을 사용자에게 알리는 메시지를 표시합니다.

모든 경우 데이터의 제목 및 설명을 환경에 통합해야 합니다. 그러면 공유 중인 항목에 대한 더 많은 컨텍스트를 사용자에게 제공할 수 있습니다.

콘텐츠 공유 대상 앱 샘플(영문) 코드 샘플에서 텍스트를 공유의 일부로 받는 앱의 전체 종단 간 환경을 확인해 보세요.

전체 예제

var shareOperation = null;

function shareReady(args) {
    if (shareOperation.data.contains(Windows.ApplicationModel.DataTransfer.StandardDataFormats.uri)) {
        shareOperation.data.getUriAsync().done(function (uri) {
            // In this sample, we only display the URI. To output the link using this example, 
            // you need a div tag with an id of "output" in your HTML file.
            // In your app, replace this with whatever is appropriate for your scenario.
            document.getElementById("output").innerText = "Uri: " + uri.absoluteUri;
        });
    }
}

app.onactivated = function (args) {
    if (args.detail.kind === activation.ActivationKind.launch) {
        // The app was launced. Initialize as appropriate.
        args.setPromise(WinJS.UI.processAll());
    } else if (args.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.shareTarget) {
        // This app was been activated for the Share contract
        args.setPromise(WinJS.UI.processAll());

        // We receive the ShareOperation object as part of the eventArgs
        shareOperation = args.detail.shareOperation;


        // We queue an asychronous event so that working with the ShareOperation 
        // object does not block or delay the return of the activation handler.
        WinJS.Application.addEventListener("shareready", shareReady, false);
        WinJS.Application.queueEvent({ type: "shareready" });
    }
};

다음을 통해 공유