次の方法で共有

Excel Services の JavaScript オブジェクト モデルを操作する

JavaScript オブジェクト モデル (JSOM) を使用するコードを記述する場合、コードを実行できるシナリオは 2 つあります。または、Microsoft OneDrive に格納されている埋め込みブックを含むホスト Web ページ。 この記事では、コードの記述方法に大きく影響する 2 つのシナリオの主な違いについて説明します。

Excel Services JSOM を使用する

表 1 では、 JSOM を使用するコードを記述するときに利用できる 2 つのシナリオの違いを一覧にしています。

表 1. Excel Services JSOM のシナリオ

Location 説明
OneDrive
このシナリオでは、OneDrive上に保存されているブックを、HTML
要素を使用してホスト Web ページに埋め込みます。 その後、埋め込んだブックを操作するコードをページに含めます。
SharePoint
このシナリオでは、SharePoint によって SharePoin ページが提供されます。 信頼できる場所に格納されているブックを含む Web パーツを SharePoint ページに挿入します。 次に、Web パーツと対話するコードを SharePoint ページに含めます。

2 つのシナリオで記述するコードの主な違いは、Ewa.EwaControl オブジェクトへの参照を取得する方法です。 [Ewa.EwaControl] は JavaScript オブジェクト モデルへのエントリ ポイントなので、Ewa.EwaControl への参照を取得して、 JSOM を操作する必要があります。

EwaControl オブジェクトへの参照を取得する (SharePoint)

SharePoint ページ上で Web パーツを操作するコードを記述する場合、次のコード例に示すように、Ewa.EwaControlCollection.getItem(index) メソッドを使用して、[Ewa.EwaControl] オブジェクトへの参照を取得します。


<script type="text/javascript">
var ewa = null;

// Add event handler for onload event.
if (window.attachEvent) 
{ 
    window.attachEvent("onload", ewaOmPageLoad);    
} 
else 
{ 
    window.addEventListener("DOMContentLoaded", ewaOmPageLoad, false); 
}
// Add event handler for applicationReady event.
function ewaOnPageLoad()
{
    if (typeof (Ewa) != "undefined")
    {
Ewa.EwaControl.add_applicationReady(ewaApplicationReady);
    }
    else
    {
alert("Error - the EWA is not loaded.");
    }
    // Add additional page load code here.
}

function ewaApplicationReady()
{
    // Get a reference to the Excel Services web part.
    ewa = Ewa.EwaControl.getInstances().getItem(0);

    // Add other initialization logic here.
}

// Add your code here.
    </script>

EwaControl オブジェクトへの参照を取得する (OneDrive)

OneDrive 上に保存された埋め込みブックを操作するコードを記述する場合、 AsyncResult オブジェクトを使って [Ewa.EwaControl] オブジェクトへの参照を取得します。 [AsyncResult] オブジェクトは、 Ewa.EwaControl.loadEwaAsync 静的メソッドで指定するコールバック メソッドへの単一パラメーターとして渡します。 コールバックが起動されると、 [Ewa.EwaControl] オブジェクトへの参照が [AsyncResult] オブジェクトに入ります。 以下のコード例は、 [AsyncResult] オブジェクトを使って [Ewa.EwaControl] オブジェクトへの参照を取得する方法を示しています。


<div id="myExcelDiv" style="width: 402px; height: 346px"></div>
<script type="text/javascript" src="http://r.office.microsoft.com/r/rlidExcelWLJS?v=1&amp;kip=1"></script>
<script type="text/javascript">
    /*
    * This code uses the Microsoft Office Excel JavaScript object model to programmatically insert the
    * Excel Web App into a div with id=myExcelDiv. The full API is documented at
    * https://msdn.microsoft.com/library/hh315812.aspx. There you can find out how to programmatically get
    * values from your Excel file and how to use the rest of the object model. 
    */

    // Use this file token to reference Book1.xlsx in the Excel APIs
    // Replace the the placeholder for the  filetoken with your value
    var fileToken = " XXXXXXXXXXXXXXXXXXXXXX/XXXXXXXXXXXXXXXXXXX/";
    var ewa = null;

    // Run the Excel load handler on page load.
    if (window.attachEvent)
    {
        window.attachEvent("onload", loadEwaOnPageLoad);
    } else
    {
        window.addEventListener("DOMContentLoaded", loadEwaOnPageLoad, false);
    }

    function loadEwaOnPageLoad()
    {
        var props = {
            uiOptions: {
                showGridlines: false,
                showRowColumnHeaders: false,
                showParametersTaskPane: false
            },
            interactivityOptions: {
                allowTypingAndFormulaEntry: false,
                allowParameterModification: false,
                allowSorting: false,
                allowFiltering: false,
                allowPivotTableInteractivity: false
            }
        };
        // Embed workbook using loadEwaAsync
        Ewa.EwaControl.loadEwaAsync(fileToken, "myExcelDiv", props, onEwaLoaded);
    }

    function onEwaLoaded(asyncResult)
    { 
        if (asyncResult.getSucceeded())
        {
            // Use the AsyncResult.getEwaControl() method to get a reference to the EwaControl object
            ewa = asyncResult.getEwaControl();
            …
        }
        else
        {
            alert("Async operation failed!");
        }
        // ...
    }    
</script>

結論

JavaScript オブジェクト モデルを使用するソリューションの記述は、そのソリューションを実行するのが SharePoint上か、ホスト Web ページ上かにかかわらず、基本的に同じです。 主な違いは、 [Ewa.EwaControl] オブジェクトへの参照を取得する方法です。 [Ewa.EwaControl] オブジェクトへの参照を取得していれば、それ以外の記述コードはどちらのシナリオでもほとんど同じです。

関連項目