逐步解說：建立 UII Web 應用程式配接器

發行項
04/18/2017

發行︰ 2016年11月

適用於： Dynamics 365 (online)、Dynamics 365 (on-premises)、Dynamics CRM 2013、Dynamics CRM 2015、Dynamics CRM 2016

如果想要強化和修改您無法存取來源程式碼也沒有變更受管理程式碼權限的 Web 應用程式，您可以建立 Web 應用程式配接器。Microsoft Dynamics 365 提供建立 Web 應用程式配接器的 Microsoft Visual Studio 範本。此範本會提供基本程式碼做為註解，協助您開始建立 Web 應用程式配接器。

在此逐步解說，會建立稱為 QsWebApplication 的外部 Web 應用程式並在 Unified Service Desk 中託管它。您接著建立與設定一個 Web 應用程式配接器，稱為 MyWebApplicationAdapter，讓外部 Web 應用程式可以與 Unified Service Desk 互動。 Web 應用程式有四個標籤，客戶的姓氏、名字、地址和識別碼各一個，以及四個對應的文字方塊會顯示 Unified Service Desk 值。

本主題內容

先決條件

步驟 1：建置範例 Web 應用程式

步驟 2：在 Dynamics 365 設定 Web 應用程式

步驟 3：測試 Web 應用程式

步驟 4：建立 Web 應用程式配接器

步驟 5：在 Dynamics 365 設定 Web 應用程式配接器

步驟 6：測試 Web 應用程式配接器

先決條件

Microsoft .NET Framework 4.5.2
Unified Service Desk 用戶端應用程式，這是測試託管控制項所需的。
Microsoft Visual Studio 2012、Visual Studio 2013 或 Visual Studio 2015
Visual Studio 2012、Visual Studio 2013 或 Visual Studio 2015 的 NuGet 套件管理員
Visual Studio 的 Microsoft Dynamics 365 SDK 範本，包含 UII 託管控制項專案範本。您可以用下列其中一個方式取得它：
- 下載 CRM SDK 範本。按兩下 CRMSDKTemplates.vsix 檔案，將範本安裝在 Visual Studio 中。
- 下載並解壓縮 CRM SDK 套件。移至 SDK\Templates 資料夾。按兩下 CRMSDKTemplates.vsix 檔案，將範本安裝在 Visual Studio 中。

步驟 1：建置範例 Web 應用程式

下載 UII SDK 套件 (.exe)
按兩下套件檔案，解壓縮內容。
瀏覽至 <ExtractedFolder>\UII\SampleCode\UII\AIF\QsWebApplication 資料夾，然後開啟 Visual Studio 中的 Microsoft.Uii.QuickStarts.QsWebApplication.csproj 檔案。
按 F5 鍵或選取 [偵錯] > [開始偵錯] 在本機電腦上主控範例 Web 應用程式。應用程式會在以下網址託管：https://localhost:2627/。

步驟 2：在 Dynamics 365 設定 Web 應用程式

登入 Microsoft Dynamics 365。
移至 [設定] > [Unified Service Desk]。
選擇 [託管控制項]。
選擇 [新增]。

在 [新增託管控制項] 頁面上，指定下列值。

欄位	值
名稱	QsWebApplication
USD 元件類型	CCA 託管應用程式
託管應用程式	Web 託管應用程式
應用程式是全域的	已核取
顯示群組	MainPanel
配接器	使用無配接器
應用程式是動態的	否
應用程式代管	使用 SetParent
URL	指定您的 Web 應用程式託管的位置。在此案例中，它是 https://localhost:2627/。

Dynamics 365 中 Web 應用程式設定的螢幕擷取畫面

選擇 [儲存]。

步驟 3：測試 Web 應用程式

確定您在步驟 1 建置的範例 Web 應用程式仍在執行。
執行Unified Service Desk用戶端連線到您的 Microsoft Dynamics 365 伺服器。
在成功登入，您會在桌面上看到 [範例外部 Web 應用程式]。
按一下 [範例外部 Web 應用程式] 索引標籤，檢視 [Unified Service Desk] 中託管的 Web 應用程式。

在 Unified Service Desk 中代管 Web 應用程式

注意

此時，欄位是空白，因為您只是在 [Unified Service Desk] 託管外部 Web 應用程式。若要從 [Unified Service Desk] 填入欄位值，我們必須建立 Web 應用程式配接器，如下一個步驟所示。

步驟 4：建立 Web 應用程式配接器

啟動 Microsoft Visual Studio 並建立新的專案。

在 [新增專案] 對話方塊：

從左邊已安裝的範本清單中，展開 [Visual C#]，然後選取 [Dynamics 365 SDK 範本] > [Unified Service Desk] > [UII Web Application Adapter]。
指定專案的名稱和位置，然後按一下 [確定] 建立新的專案。

選取 WebAppAdapter.cs 和使用下列程式碼更新 NotifyContextChange 定義，從內容資訊填入文字欄位。其他資訊：NotifyContextChange

public override bool NotifyContextChange(Context context)
        {
            // Populating text fields from context information.

            HTMLDocument htmlDoc = Browser.Document as HTMLDocument;
            if (htmlDoc != null)
            {
                IHTMLElementCollection htmlElementCollection = htmlDoc.all;
                IHTMLElement htmlFirstName = htmlElementCollection.item("txtFirstName", 0) as IHTMLElement;
                htmlFirstName.setAttribute("value", context["firstname"], 0);
                IHTMLElement htmlLastName = htmlElementCollection.item("txtLastName", 0) as IHTMLElement;
                htmlLastName.setAttribute("value", context["lastname"], 0);
                IHTMLElement htmlAddress = htmlElementCollection.item("txtAddress", 0) as IHTMLElement;
                htmlAddress.setAttribute("value", context["address1_line1"], 0);
                IHTMLElement htmlID = htmlElementCollection.item("txtID", 0) as IHTMLElement;
                htmlID.setAttribute("value", context["CustomerID"], 0);
            }
            return base.NotifyContextChange(context);
        }

將下列程式碼新增至 DoAction 覆寫定義，使用從 Unified Service Desk 的值更新應用程式

public override bool DoAction(HostedWebApplication.WebAction action, ref string data)
        {
            Trace.WriteLine(string.Format("{0}>>>>> RECEIVED (WebAction) Action : {1} ", this.Name, action.Name));

            // Check to see if the browser is working on something before allowing the system to do 'normal' behavior.
            if (Browser.WebBrowser.ReadyState != tagREADYSTATE.READYSTATE_COMPLETE)
            {
                // Browser is not in a state to process this request,  Queue it for when the browser is ready to handle it. 
                Trace.WriteLine(string.Format("{0}>>>>> Browser Busy,({2}) Queuing Action : {1} ", this.Name, action.Name, Browser.WebBrowser.ReadyState.ToString()));
                qReqActionList.Enqueue(new BrowserActionData(action, data));
                return false;
            }
          Trace.WriteLine(string.Format("{0}>>>>>>>>>>> Action:Name={1} Action:Url={2} Action:Query={3} Action:Init={4}", this.Name, action.Name, action.Url, action.QueryString, action.Initialization));

            // Get browser DOM and element collection.
            // Create an XML Document to load the passed in data to.
            HTMLDocument htmlDoc = Browser.Document as HTMLDocument;
            IHTMLElementCollection htmlElementCollection = htmlDoc.all;

            // Check action name for something we know how to process.
            switch (action.Name)
            {
                case "UpdateFirstName":
                    IHTMLElement htmlFirstName = htmlElementCollection.item("txtFirstName", 0) as IHTMLElement;
                    htmlFirstName.setAttribute("value", data, 0);
                    break;
                case "UpdateLastName":
                    IHTMLElement htmlLastName = htmlElementCollection.item("txtLastName", 0) as IHTMLElement;
                    htmlLastName.setAttribute("value", data, 0);
                    break;
                case "UpdateAddress":
                    IHTMLElement htmlAddress = htmlElementCollection.item("txtAddress", 0) as IHTMLElement;
                    htmlAddress.setAttribute("value", data, 0);
                    break;
                case "UpdateID":
                    IHTMLElement htmlID = htmlElementCollection.item("txtID", 0) as IHTMLElement;
                    htmlID.setAttribute("value", data, 0);
                    break;
            }
            return false;
        }

儲存專案，然後建置它 ([建置] > [建置方案])。在專案建置成功之後，於專案資料夾的 \bin\debug 資料夾中產生組件 (MyWebApplicationAdapter.dll)。您稍後需要此組件，以測試和使用 Web 應用程式配接器。

步驟 5：在 Dynamics 365 設定 Web 應用程式配接器

登入 Microsoft Dynamics 365。
選擇導覽列上的 [Microsoft Dynamics 365]，然後選取 [設定]。
選擇 [設定] > [Unified Service Desk] > [託管控制項]。
從託管控制項清單中，選取 QsWebApplication 託管控制項。
在 [配接器設定] 區段，指定下列值。

欄位

值

配接器

使用配接器

URI

MyWebApplicationAdapter

類型

MyWebApplicationAdapter.WebAppAdapter

注意

[URI] 是您的組件名稱，而 [類型] 是您的組件 (dll) 的名稱後面接著句點 (.)，最後是您的 Visual Studio 專案中的類別名稱。在這個範例中，組件名稱是 MyWebApplicationAdapter，而類別名稱是 WebAdapter，這是當您建立 Web 應用程式配接器時預設的類別名稱。
選擇 [儲存] 儲存變更。

欄位	值
配接器	使用配接器
URI	MyWebApplicationAdapter
類型	MyWebApplicationAdapter.WebAppAdapter

步驟 6：測試 Web 應用程式配接器

將包含 Web 應用程式配接器定義的組件從 Visual Studio 專案輸出資料夾 (<ProjectFolder>\bin\debug) 複製到 Unified Service Desk 應用程式目錄。在此案例下，會將 MyWebApplicationAdapter.dll 檔案複製到 c:\Program Files\Microsoft Dynamics CRM USD\USD 目錄。
執行Unified Service Desk用戶端連線到您的 Microsoft Dynamics 365 伺服器。
在成功登入，您會在桌面上看到範例外部 Web 應用程式按鈕。
選擇 [搜尋]，然後選擇 [連絡人] 並選取連絡人。在此案例中，請選取 [孫荷佑]。
按一下 [範例外部 Web 應用程式]，您會看到填入客戶的名字、姓氏、地址和識別碼。

注意

此逐步解說顯示如何在外部 Web 應用程式中讀取或顯示來自 Unified Service Desk 的資料。若要從外部 Web 應用程式更新 Unified Service Desk 中的資料，反之亦然，請參閱逐步解說：建立 UII Windows Forms 託管控制項

另請參閱

使用 UII 配接器，與外部和 Web 應用程式互動

Unified Service Desk 2.0

共用方式為

逐步解說：建立 UII Web 應用程式配接器

本主題內容

先決條件

步驟 1：建置範例 Web 應用程式

步驟 2：在 Dynamics 365 設定 Web 應用程式

步驟 3：測試 Web 應用程式

步驟 4：建立 Web 應用程式配接器

步驟 5：在 Dynamics 365 設定 Web 應用程式配接器

步驟 6：測試 Web 應用程式配接器

另請參閱

其他資源