SharePoint 2016：尽管Ajax和/或MDS，如何强制JS在每个网站页面上执行？

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了SharePoint 2016：尽管Ajax和/或MDS，如何强制JS在每个网站页面上执行？相关的知识，希望对你有一定的参考价值。

我正在实现一个非常简单的用例，但我不仅找不到解决方案，而且找不到任何谈论它的文章，好像我是唯一一个。

我希望我的自定义javascript在给定SharePoint站点的每个页面上执行。

很容易，你会说。好吧，不。远非如此，就像使用SharePoint一样。

重现步骤 ：

  • 创建一个开箱即用的发布网站
  • 使用我在下面描述的任何方法包括下面的自定义javascript
  • 转到该站点，转到主页。它是一个发布网站，因此默认情况下，您的左侧导航窗格默认至少包含“主页”和“文档”。
  • 第一次加载页面时，javascript会执行。现在，单击“文档”。页面更改但Javascript未执行。

那是因为SharePoint使用Ajax。即使MDS被禁用。它通过URL中的哈希（＃）使用Ajax。

例如，它转换了一个非常有用的链接，如下所示：

<a href src =“/ SitePages / Home.aspx”>

单击它时进入此URL：

https://your-url/sites/your-site/_layouts/15/start.aspx#/SitePages/Home.aspx

这是我的Javascript：

if (ExecuteOrDelayUntilScriptLoaded && _spBodyOnLoadFunctionNames) {
    _spBodyOnLoadFunctionNames.push(ExecuteOrDelayUntilScriptLoaded(
        function () {
            alert("It's working!");
        }, "sp.js"));
}

所以，我尝试了以下包含Javascript的方法：

  1. 通过用户自定义操作。我用this very handy page添加它，但那不相关。该操作被添加到站点，我可以在首次加载时看到DOM中的JS。但是在我单击页面中的链接并且SP使用Ajax之后，它不会再次执行它。
  2. 通过修改母版页 - 即：seattle.html。起初我以这种方式包含它，只是在其他原生内容中：

<head runat =“server”>

...

<！ - SPM：<SharePoint：ScriptLink language =“javascript”name =“suitelinks.js”OnDemand =“true”runat =“server”Localizable =“false”/> - >

<！ - SPM：<SharePoint：ScriptLink language =“javascript”Name =“~sitecollection / SiteAssets / MYJAVASCRIPT.js”runat =“server”/> - >

但后来我读到了AjaxDelta（这里：https://msdn.microsoft.com/fr-fr/library/office/dn456543.aspx），我把我的包含（仍在标题中）移到<AjaxDelta>中，如下所示：

<head runat =“server”>

...

<！ - SPM：<SharePoint：AjaxDelta id =“DeltaPlaceHolderAdditionalPageHead”Container =“false”runat =“server”> - >

<！ - SPM：<asp：ContentPlaceHolder id =“PlaceHolderAdditionalPageHead”runat =“server”/> - >

<！ - SPM：<SharePoint：DelegateControl runat =“server”ControlId =“AdditionalPageHead”AllowMultipleControls =“true”/> - >

<！ - SPM：<SharePoint：ScriptLink language =“javascript”Name =“~sitecollection / SiteAssets / MYJAVASCRIPT.js”runat =“server”/> - >

<！ - SPM：</的SharePoint：阿贾克斯三角洲> - >

......然而没有任何作用。通过单击SharePoint的“托管”链接在同一站点的页面之间切换时，Javascript永远不会执行。

我正在寻找一个能够优雅地处理SharePoint的Ajax的解决方案，而不是劫持页面上每个超链接的重型和危险的东西。例如，我试图将我的代码挂钩到ajaxNavigate方法（例如：addNavigate），但我不确定我是否理解那里的实际内容以及它是否对我有任何帮助。

编辑：

  • 似乎有一种共识（例如，最底层的here），无论如何都会执行用户自定义操作 - 因为SharePoint出于某种原因将其ScriptLink放入AjaxDelta中。嗯，那不是我目睹的。
  • 还有一个共识是，使用“RegisterModuleInit”可以解决这个问题。这对我也不起作用。

我非常困惑。我认为当用户点击链接然后点击“返回”时，这两个解决方案可以解决导航问题。但它并没有解决SharePoint的聪明的“托管”，Ajax泛滥的超链接。

答案

到目前为止，我终于找到了一个似乎永远不会失败的解决方案。这真是一种解脱。

简答：使用asyncDeltaManager.add_endRequest

这篇MSDN讨论提出了一种实现它的简单方法：https://social.msdn.microsoft.com/Forums/office/en-US/1ae292b4-3589-46f6-bedc-7bd9dc741f1b/javascript-code-to-execute-after-all-the-elements-and-css-are-loaded?forum=appsforsharepoint

$(function () {
  ExecuteOrDelayUntilScriptLoaded(function () {
      if (typeof asyncDeltaManager != "undefined")
           asyncDeltaManager.add_endRequest(MYCUSTOMCODE); //execute it after any ajax event
      else 
           MYCUSTOMCODE(); //execute it at first load
  }, "start.js");
});

这显示了如何在SharePoint的循环中正确包含它（使用ExecuteOrDelayUntilScriptLoaded）https://sharepoint.stackexchange.com/questions/171490/javacript-only-executed-on-first-page-load

完整的解决方案（objet“LefeCycleHelper”），由Mx https://sharepoint.stackexchange.com/questions/192974/where-to-place-a-js-script-with-whom-i-need-to-get-an-div-id/193009#193009提供

//use an IIFE to create a scope and dont dirty the global scope
(function (_) {

// use strict to ensure we dont code stupid
'use strict';

var initHandlers = [];
var initMDSHandlers = [];

var ensureSharePoint = function (handler) {
    var sodLoaded = typeof (_v_dictSod) !== 'undefined' && _v_dictSod['sp.js'] != null && _v_dictSod['sp.js'].state === Sods.loaded;

    if (sodLoaded) {
        handler();
    } else {
        SP.SOD.executeFunc('sp.js', 'SP.ClientContext', function () { });
        SP.SOD.executeOrDelayUntilScriptLoaded(handler, 'sp.js');
    }
};

var initMDS = function () {
    for (var i = 0; i < initMDSHandlers.length; i++) {
        initMDSHandlers[i]();
    }
};

var init = function () {
    // Register MDS handler
    if ('undefined' != typeof g_MinimalDownload && g_MinimalDownload && (window.location.pathname.toLowerCase()).endsWith('/_layouts/15/start.aspx') && 'undefined' != typeof asyncDeltaManager) {
        asyncDeltaManager.add_endRequest(initMDS);
    } else {
        for (var i = 0; i < initHandlers.length; i++) {
            initHandlers[i]();
        }
    }
};

var registerInit = function (handler) {
    initHandlers.push(handler);
};

var registerInitMDS = function (handler) {
    initMDSHandlers.push(handler);
};

var domReady = (function (handler) {
    var fns = [];
    var listener;
    var loaded = (document.documentElement.doScroll ? /^loaded|^c/ : /^loaded|^i|^c/).test(document.readyState);

    if (!loaded) {
        document.addEventListener('DOMContentLoaded', listener = function () {
            document.removeEventListener('DOMContentLoaded', listener);
            loaded = 1;
            while (listener = fns.shift()) listener();
        });
    }

    return function (fn) {
        loaded ? setTimeout(fn, 0) : fns.push(fn);
    };
})();


var attachToLoad = function (functionToAttach) {
    registerInit(functionToAttach);
    registerInitMDS(functionToAttach);
   domReady(function () {
       init();
    });
};

_.AttachToLoad = attachToLoad;

// THIS WILL PROTECT YOUR GLOBAL VAR FROM THE GARBAGE COLLECTOR
window.LifeCycleHelper = _;
if (window.Function != 'undefined' && typeof (Function.registerNamespace) == 'function') {
    Function.registerNamespace('LifeCycleHelper');
}
})({});

var theCodeYouWantToRun = function () {
    alert('theCodeYouWantToRun');
};

window.LifeCycleHelper.AttachToLoad(theCodeYouWantToRun);

以上是关于SharePoint 2016：尽管Ajax和/或MDS，如何强制JS在每个网站页面上执行？的主要内容，如果未能解决你的问题，请参考以下文章

Sharepoint 2013 中的 Ajax 连接 Web 部件

SharePoint 2013 REST API AJAX 更新工作流任务

SharePoint 2016 功能比较

SharePoint 2010 Web 部件部署错误

SharePoint 2016 图文安装教程

Sharepoint 2013：通过 REST API 确保用户