快速入門：使用輕觸來發佈和訂閱訊息 (HTML)

發行項
12/11/2015

[ 本文的目標對象是撰寫 Windows 執行階段 App 的 Windows 8.x 和 Windows Phone 8.x 開發人員。如果您正在開發適用於 Windows 10 的 App，請參閱最新文件 ]

利用鄰近性功能，您可以在兩部裝置之間發佈和訂閱訊息，以及使用簡單的點選手勢將靜態標記寫入裝置。如果兩個裝置互相靠近到相距 3 到 4 公分，鄰近性就會通知系統。這個主題說明如何利用鄰近性功能來發佈或訂閱訊息。

目標: 使用鄰近性輕觸發佈和訂閱訊息。

先決條件

Microsoft Visual Studio Express 2012 for Windows 8

指示

1. 建立新專案和啟用鄰近性功能

開啟 Visual Studio Express 2012 for Windows 8，然後選取 [檔案] 功能表中的 [新增專案]。在 [Javascript] 區段中，選取 [空白的應用程式]。將應用程式命名為 ProximityMessages，然後按一下 [確定]。
開啟 Package.appxmanifest 檔案，然後選取 [功能]**** 索引標籤。選取 [鄰近性] 功能以啟用鄰近性。關閉並儲存資訊清單檔案。

2. 新增 HTML UI

開啟 Default.html 檔案，然後將下列的 HTML 新增到 <body> 區段。


<table>
    <tr>
        <td style="width: 500px;vertical-align: top">
            <button id="publishMessageButton">Publish Message</button>
            <input type="text" id="messageText" />
            <button id="subscribeForMessageButton">Subscribe For Message</button><br />
            <button id="stopPublishingMessageButton">Stop Publishing Message</button>
            <button id="stopSubscribingForMessageButton">Stop Subscribing For Message</button><br />
            Enter a message and click "Publish Message". On another computer, click
            "Subscribe For Message". Enter proximity to transmit the message.
        </td>
        <td><div id="messageDiv" style="width: 500px;vertical-align:top"></div></td>
    </tr>
</table>

3. 新增初始化程式碼

ProximityDevice 類別可用來發佈和訂閱鄰近性裝置間的訊息。這個步驟中的程式碼會建立 ProximityDevice 類別的執行個體，以後續步驟要加入的相關函式，如同 HTML 按鈕 Click 事件的事件處理常式。在此包含 id 捷徑函式，以方便存取 getElementById 函式。當應用程式啟動時，會呼叫初始化函式。這個函式會取得預設的鄰近性裝置，並用來發佈和訂閱訊息。它也會新增按鈕的事件處理常式。

開啟 js 資料夾。開啟 Default.js 檔案，然後用下列程式碼取代預設的 activated 函式。

var proximityDevice;

app.onactivated = function (eventObject) {
    if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) {
        
        initializeProximitySample();

        WinJS.UI.processAll();
    }
};

function id(elementId) {
    return document.getElementById(elementId);
}
    
function initializeProximitySample() {
    proximityDevice = Windows.Networking.Proximity.ProximityDevice.getDefault();

    if (proximityDevice) {
        id("publishMessageButton").addEventListener("click", publishMessage);
        id("subscribeForMessageButton").addEventListener("click", subscribeForMessage);
        id("stopSubscribingForMessageButton").addEventListener("click",
            stopSubScribingForMessage);
        id("stopPublishingMessageButton").addEventListener("click",
        stopPublishingMessage);
    }
    else {
        id("messageDiv").innerHTML += "Failed to initialize proximity device." +
             "Your device may not have proximity hardware.<br />";
    }
}

4. 新增 Click 事件處理常式

在這個步驟中，您要新增 HTML 按鈕的 Click 事件程式碼。publishMessageButton 按鈕的事件處理常式程式碼會呼叫 publishMessage 方法，將訊息發佈到鄰近性裝置。subscribeToMessageButton 按鈕的事件處理常式程式碼會呼叫 subscribeToMessage 方法，以接收鄰近性裝置發佈的所有訊息。在這個範例中，只會收到被識別為 Windows.SampleMessage 類型的訊息。針對使用 publishMessage 方法發佈的鄰近性訊息類型，其首碼應該一律為 Windows.。為了簡化這個範例，一次只發佈或訂閱一則訊息。您可以同時發佈和訂閱多個訊息。

您也可以使用 PublishUriMessage 方法來發佈 URI，或使用 PublishBinaryMessage 方法來發佈二進位資料。如需可以使用 PublishBinaryMessage 方法來發佈的訊息類型清單，請參閱 PublishBinaryMessage(String, IBuffer)。

在 Default.js 檔案中，將下列程式碼新增到 initializeProximitySample 函式之後。

var publishedMessageId = -1;
var subscribedMessageId = -1;

function publishMessage() {
    // Stop publishing the current message.
    if (publishedMessageId != -1) {
        proximityDevice.stopPublishingMessage(publishedMessageId);
    }

    publishedMessageId =
    proximityDevice.publishMessage("Windows.SampleMessage", id("messageText").value);
}

function subscribeForMessage() {
    // Only subscribe for the message one time.
    if (subscribedMessageId === -1) {
        subscribedMessageId =
    proximityDevice.subscribeForMessage("Windows.SampleMessage", messageReceived);
    }
}

function messageReceived(device, message) {
    id("messageDiv").innerHTML += "Message received: " + message.dataAsString + "<br />";
}

function stopSubscribingForMessage() {
    proximityDevice.stopSubscribingForMessage(subscribedMessageId);
}

function stopPublishingMessage() {
    proximityDevice.stopPublishingMessage(publishedMessageId);
}

5. 執行應用程式

若要檢視執行中的應用程式，請在兩部啟用鄰近性的裝置上執行該應用程式。在一部裝置上輸入訊息並按一下 [Publish Message] 按鈕。接著，在另一部裝置上按一下 [Subscribe For Message] 按鈕，然後一起輕觸這兩部裝置。

重要

您必須在兩部裝置上執行這個快速入門。對於使用點選手勢的情況，每部裝置都必須安裝鄰近性裝置，例如 NFC 無線電波。如果您沒有支援鄰近性輕觸 (例如，近距離無線通訊 (NFC) 無線電波) 的硬體，可以使用鄰近性驅動程式範例，這個範例是 Windows 驅動程式套件 (WDK) 範例的一部分。您可以使用範例驅動程式，在兩部 Windows 裝置之間透過網路連線模擬點選手勢。如需如何下載 WDK 的相關資訊，請參閱 Windows 驅動程式套件 (WDK)。安裝 WDK 和範例之後，您就可以在安裝 WDK 範例的位置 src\nfp 目錄中找到鄰近性驅動程式範例。如需建置和執行模擬器的指示，請參閱 src\nfp\net 目錄中的 NetNfpProvider.html 檔案。啟動模擬器之後，當您的鄰近性應用程式在前景中執行時，該模擬器便會在背景中執行。您的應用程式必須位於前景中，輕觸模擬才能運作。

摘要與後續步驟

在這個教學課程中，您已建立應用程式，可使用輕觸，在兩個裝置之間發佈和訂閱訊息。

您也可以使用點選手勢來連線到另一個裝置。例如，請參閱快速入門：使用輕觸或瀏覽來連線應用程式。

快速入門：使用輕觸或瀏覽來連線應用程式

共用方式為