How to receive a link (HTML)

[This article is for Windows 8.x and Windows Phone 8.x developers writing Windows Runtime apps. If you’re developing for Windows 10, see the latest documentation]

Links are a common form of data that users want to share. Sometimes the user shares a link directly (such as from an article on a website). Supporting links is also helpful as a secondary option when users are sharing HTML or content that might be available online.

This topic shows how to receive a single link that's being shared from a source app.

What you need to know

Technologies

Prerequisites

  • You should be familiar with Visual Studio and its associated templates.
  • You should be familiar with JavaScript.

Instructions

Step 1: Support the Share contract

Before your app can receive shared content, you have to declare that it supports the Share contract. This contract essentially lets the system know that your app is available to receive content. If you're using a Microsoft Visual Studio template to create your app, here's how you support the Share contract:

  1. Open the manifest file (package.manifest) in designer view.
  2. Open the Declarations tab.
  3. Choose Share Target from the Available Declarations list.
  4. Click Add to add support for the Share Target contract in your app.

To support links, you need to specify that your app supports the URI format:

  1. Open the manifest file.
  2. In the Data Formats section, click Add New.
  3. Type "text" (without the quotes).

The preceding steps add the following section to the manifest:

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

Note  You can specify a different entry point when your app is activated for the Share Target contract. To do this, modify the Start page entry in App settings section of the Share Target declaration in the package manifest. We highly recommend that you also use a separate JavaScript file that handles activation for this page. For an example, check out the Sharing content target app sample.

 

Step 3: Add an event handler to detect when your app is activated.

When a user selects your app to share content, the system activates your app. Because there are many ways this can happen, you need to add code that detects why the activation occurred. You do this by checking the value of the kind property.

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) {
        ...
    }
};

If you use a dedicated start page for the Share Target contract, you can skip checking the kind property

Step 4: Get the ShareOperation object.

The ShareOperation object contains all the data your app needs to get the content that a user wants to share.

shareOperation = args.detail.shareOperation;

Step 5: Return from the activated event handler quickly.

The activated event handler must return quickly. Queue an asynchronous event from activated event handler so that share data processing takes placed after the activated event returns.

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

The remaining steps implement the shareReady function.

Step 6: Check to see if the DataPackageView contains a URI.

The ShareOperation object contains a DataPackageView object. This object is a read-only version of the DataPackage object that the source app used to create the data. Use this object to see if the content being shared contains a link.

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

Checking if the DataPackage contains the data format you are interested in is good practice, even if your app supports only one format. This makes it easier to support other data formats types and file formats later.

To get the URI, call the DataPackageView.getUriAsync method.

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;
    }
});

Step 8: Call reportCompleted.

After your app successfully finishes sharing the content, call reportCompleted. After you call this method, the system dismisses your app.

shareOperation.reportCompleted();

Remarks

Some apps might provide a Uniform Resource Identifier (URI) that does not begin with http:// or https://. For example, a source app could provide an activation protocol that would bring a user directly to content in the app itself. If your app can already support any URI, you get this functionality by default. If your app is limited to only certain types of URIs, you should consider the following:

  • If you support HTML, use the HTML supplied in the DataPackage instead.
  • If you do not support HTML, but do support text, use the text in the DataPackage.
  • If neither of the preceding options work, consider displaying a message that tells the user that you don't support the particular URI.

In all cases, try to incorporate the title and description of the data into your experience. This gives the user more context around what is being shared.

Check out our Sharing content target app sample code sample to see the entire end-to-end experience of an app receiving an image as part of sharing.

Complete example

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" });
    }
};

Sharing content target app sample

Sharing and exchanging data

How to receive files

How to receive HTML

How to receive text

Quickstart: Receiving shared content

DataPackage

Windows.ApplicationModel.DataTransfer

Windows.ApplicationModel.DataTransfer.Share

Guidelines for debugging target apps