はじめに

弊社で企画中の Office用アプリ(Apps for Office)のサンプル版を作成するために、検証サンプルプログラムを作成しています。

今回は以下のコンテンツパネルからWebService(HTTP)経由でデータベースのデータを取得・設定できるようになります。

手順

前提

Excel 2013だけではなく、Excel Web App の両方で動作させるため、作業ウインドウアプリではなく、コンテンツアプリで作成する必要があります。
Server は、Windows Azure (Web Server、DB Server)を使用します。（Azureでなくても可能）
クロスドメイン(Cross-Dmain)対応しなくてはいけません。（後で詳しくかきます）

データのやりとりがしたいので、Web サービス(Web Service)を使っていきます。
まだ慣れていないので、順序立ててやっていきます。

1) Office 用アプリ(Apps for Office)に、Web サービスを組み込む

1. Office 2013 用アプリのプロジェクトを作成します

2. Web サービス(Web Service)を追加する
プロジェクト上で右クリックして、｢追加｣ → ｢新しい項目｣ → ｢Visual C#｣ → ｢Web｣ → ｢Web サービス｣を選択

3. Web フォーム(Web Form)を追加する
プロジェクト上で右クリックして、｢追加｣ → ｢新しい項目｣ → ｢Visual C#｣ → ｢Web｣ → ｢Web フォーム｣を選択

ひととおり追加したら、こんなかんじになる

・OfficeAppWebService.html （Web フォームを使うため、使用しない）
・Test.aspx （追加した Web フォーム）
・WebService1.asmx （追加した Web サービス）

Web フォームに｢ScriptManager｣を追加して、プロパティから｢Service｣を選択します。
メンバーを追加して、｢Path｣項目を、｢Web サービス｣のファイルを設定します。

【マニフェストファイル： OfficeAppWebService.xml】

<?xml version="1.0" encoding="UTF-8"?>
<!--Created:cb85b80c-f585-40ff-8bfc-12ff4d0e34a9-->
<OfficeApp xmlns="http://schemas.microsoft.com/office/appforoffice/1.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:type="ContentApp">
  <Id>a44000b8-0478-468e-9046-4fe25a4c383c</Id>
  <Version>1.0</Version>
  <ProviderName>kueno</ProviderName>
  <DefaultLocale>en-US</DefaultLocale>
  <DisplayName DefaultValue="OfficeAppWebService" />
  <Description DefaultValue="OfficeAppWebService Description"/>
  <Capabilities>
    <Capability Name="Workbook" />
  </Capabilities>
  <DefaultSettings>
    <!--<SourceLocation DefaultValue="~remoteAppUrl/Pages/OfficeAppWebService.html" />-->
    <SourceLocation DefaultValue="~remoteAppUrl/Test.aspx" />
    <RequestedWidth>400</RequestedWidth>
    <RequestedHeight>400</RequestedHeight>
  </DefaultSettings>
  <Permissions>ReadWriteDocument</Permissions>
</OfficeApp>

※Pages にある html ファイルを呼ばずに、追加した Web フォームの aspx を呼びます。(コメントアウトの部分)

【Web サービス： WebService1.aspx.cs】

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;

namespace OfficeAppWebServiceWeb
{
    /// <summary>
    /// WebService1 の概要の説明です
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [System.ComponentModel.ToolboxItem(false)]

    // この Web サービスを、スクリプトから ASP.NET AJAX を使用して呼び出せるようにするには、次の行のコメントを解除します。
    [System.Web.Script.Services.ScriptService]
    public class WebService1 : System.Web.Services.WebService
    {
        [WebMethod]
        public string HelloWorld()
        {
            return "Hello World";
        }
    }
}

※Defaultでは、[System.Web.Script.Services.ScriptService]はコメントアウトされているので、コメントを外します

【Web フォーム： Test.aspx】

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test.aspx.cs" Inherits="OfficeAppWebServiceWeb.Call" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script type="text/javascript" language="javascript">
        function onButtonClick() {
            OfficeAppWebServiceWeb.WebService1.HelloWorld(AddSuccess, null, null);
        }

        function AddSuccess(result) {
            target = document.getElementById("output");
            target.innerHTML = result;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <input type="button" value="Test" onclick="onButtonClick();" />
    </div>
    <asp:ScriptManager ID="ScriptManager1" runat="server">
        <Services>
            <asp:ServiceReference Path="WebService1.asmx" />
        </Services>
    </asp:ScriptManager>
    </form>
    <div id="output"></div>

</body>
</html>

組み込めたので、F5実行してみた。
Excel 上でコンテンツパーツとして配置、表示されました。

｢Test｣ボタンを押すと、テキスト｢Hello World｣が表示されます。

組み込んだ Web サービスも問題なく動作したので、
次回は、DB Server から実際にデータを取得して表示してみます。

Office 用アプリ（Apps for Office）でデモアプリを作る　－Webサービス編（コンテンツアプリ）－

はじめに

手順

1) Office 用アプリ(Apps for Office)に、Web サービスを組み込む

コメントを残すコメントをキャンセル

はじめに

手順

1) Office 用アプリ(Apps for Office)に、Web サービスを組み込む

コメントを残す コメントをキャンセル

コメントを残すコメントをキャンセル