通过SharePoint 2013 App的应用程序页面获取FormDigest

时间:2015-03-19 17:41:41

标签: sharepoint sharepoint-2013

启动新的SharePoint应用程序时创建的default.aspx页面不需要我的需求,因为它继承自主机Web主页,我发现使用我自己的index.aspx页面更容易获得响应式设计复杂。使用这篇文章JSOM in HTML5 Apps,我试图检索FormDigest,但在代码检查时它无法正常工作。有任何想法吗?这是我目前的代码:

<!DOCTYPE html>
<%--Declare the Page Language and obtain the SharePoint namespace required for retrieving the FormDigest header--%> 
<%@ Page language="C#" %>
<%@ Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Import Namespace="Microsoft.SharePoint" %>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<title></title>
<link href="../Content/bootstrap.min.css" rel="stylesheet" />

<link href="../Content/App.css" rel="stylesheet" />

<script src="../Scripts/jquery-1.9.1.min.js"></script>
<script src="/_layouts/1033/init.js"></script>
<script src="/_layouts/MicrosoftAjax.js"></script>
<script src="/_layouts/sp.core.js"></script>
<script src="/_layouts/15/sp.runtime.js"></script>
<script src="/_layouts/15/sp.js"></script>
<script src="/_layouts/15/SP.RequestExecutor.js"></script>
<script src="/_layouts/15/SP.UI.Controls.js"></script>

<script src="../Scripts/angular.min.js"></script>

<script src="../Scripts/ui-bootstrap-tpls-0.12.0.min.js"></script>
<script src="../Scripts/angular-route.min.js"></script>
<script src="../Scripts/angular-resource.min.js"></script>

<script src="../Scripts/dirPagination.js"></script>

<script src="../Services/services.js"></script>
<script src="../Controllers/controllers.js"></script>
<script src="../App.js"></script>

</head>
<body>
<SharePoint:FormDigest ID="FormDigest1" runat="server"></SharePoint:FormDigest>
 <div class="container" data-ng-app="app">
      <div id="chrome_ctrl_container"></div>
    <div>
        <p id="message">

            initializing...
        </p>
    </div>
    <div data-ng-view></div>
    <hr>
    <footer></footer>
</div>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

我发现我需要一个表单实例来执行调用。它完美地运作:

的Index.aspx

<!DOCTYPE html>
<%--Declare the Page Language and obtain the SharePoint namespace required for retrieving the FormDigest header--%> 
<%@ Page language="C#" %>
<%@ Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Import Namespace="Microsoft.SharePoint" %>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<title></title>
<link href="../Content/bootstrap.min.css" rel="stylesheet" />

<link href="../Content/App.css" rel="stylesheet" />

<script src="../Scripts/jquery-1.9.1.min.js"></script>
<script src="/_layouts/1033/init.js"></script>
<script src="/_layouts/MicrosoftAjax.js"></script>
<script src="/_layouts/sp.core.js"></script>
<script src="/_layouts/15/sp.runtime.js"></script>
<script src="/_layouts/15/sp.js"></script>
<script src="/_layouts/15/SP.RequestExecutor.js"></script>
<script src="/_layouts/15/SP.UI.Controls.js"></script>

<script src="../Scripts/angular.min.js"></script>

<script src="../Scripts/ui-bootstrap-tpls-0.12.0.min.js"></script>
<script src="../Scripts/angular-route.min.js"></script>
<script src="../Scripts/angular-resource.min.js"></script>

<script src="../Scripts/dirPagination.js"></script>

<script src="../Services/services.js"></script>
<script src="../Controllers/controllers.js"></script>
<script src="../App.js"></script>

</head>
<body>
<%--    Get the form digest to use for POST/Update/Delete operations via Web services--%>
<form id="Form1" method="post" runat="server">
<SharePoint:FormDigest ID="FormDigest1" runat="server"></SharePoint:FormDigest>
    </form>
 <div class="container" data-ng-app="app">
      <div id="chrome_ctrl_container"></div>
    <div>
        <p id="message">

            initializing...
        </p>
    </div>
    <div data-ng-view></div>
    <hr>
    <footer></footer>
</div>

</body>
</html>

通过AngularJS进行ngResource调用的示例:

appServices.factory('appTypes', ['$resource', function ($resource) {
    return $resource("/_api/web/lists/getbytitle('Todo Types List')/Items", {Id: "@Id"},
    {
        'query': { method: "GET", isArray: false, headers: { 'Accept': 'application/json;odata=nometadata' } },
        'update': { method: 'PATCH', headers: { 'Accept': 'application/json;odata=nometadata' } },
        'save': { method: 'POST', headers: { 'Accept': 'application/json;odata=nometadata', 'content-type': 'application/json;odata=nometadata', 'X-RequestDigest': $("#__REQUESTDIGEST").val() } }
    }
    );
}]);