【问题标题】:Pass folder name via URL to SPO Rest API call in Custom ASPX page通过 URL 将文件夹名称传递给自定义 ASPX 页面中的 SPO Rest API 调用
【发布时间】:2021-05-01 22:50:22
【问题描述】:

我有一页列出不同的文件夹 URL。单击该链接应使用从第一页的 URL 传递的参数触发第二页上的以下代码。

我正在尝试通过 URL 传递文件夹名称参数以在 SPO 上的自定义 ASPX 页面中加载 API 调用。链接到下面第二页代码的 URL 将包含文件夹详细信息。

第一页的 URL 格式 - <<<SPO_SITE>>>/teams/<<<SPO_TENANT>>>/SiteAssets/Image.aspx?Folder="<<<FOLDER_NAME>>>"

<link rel="stylesheet" href="css/bootstrap.min.css">
<script src="js/jquery-3.5.1.min.js"></script>
<script>
   $(function(){
           var requestUri = "<<<SPO_SITE>>>/teams/<<<SPO_TENANT>>>/_api/web/getfolderbyserverrelativeurl('<<<SPO_DOC_LIB>>>/<<<FOLDER>>>')/Files?$top=2000&$select=ServerRelativeUrl";
              $.ajax({
                 url: requestUri,
                 type: "GET",
                 headers: {
                     "accept":"application/json; odata=verbose"
                 },
                 success: onSuccess,
   });
   
     function onSuccess(data) {
        var objItems = data.d.results;
   
        var divContent = '<div class="row" id="myList">';
        for (var i = 0; i < objItems.length; i++) {
   
            divContent += '<div class="col-md-3"><div class="card mb-4 shadow-sm"><img src="<<<SPO_SITE>>>/' + objItems[i].ServerRelativeUrl + '"><a class="stretched-link" target="_blank" href="<<<SPO_SITE>>>/' + objItems[i].ServerRelativeUrl + '"></a></div></div>';
   
    }
      $('#ImgGrid').append(divContent);
      }
   });
</script>
<main role="main">
   <section class="pt-4 pb-4 text-center">
      <div class="container">


      </div>
   </section>
   <div class="container">
      <div id="myList">
         <div id="ImgGrid"></div>
      </div>
   </div>
</main>

<script src="js/popper.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script>

请查看代码和建议。

【问题讨论】:

    标签: javascript html jquery sharepoint-online rest


    【解决方案1】:

    如果图片在这样的 url 中:

    https://Tenantname.sharepoint.com/sites/sitename/SPO_DOC_LIB/FOLDER

    然后在getfolderbyserverrelativeurl中请像这样传递相对url:

    /_api/web/getfolderbyserverrelativeurl('/sites/sitename/>>/>')/Files?$top=2000&$select=ServerRelativeUrl

    用完整的代码更新sn-p:

       <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" />
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/2.6.0/umd/popper.min.js"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
        <script>
            $(function () {
            var relativeurl = "/sites/dev/Share Documents/" + GetParameterValues("Folder");
            var requestUri = _spPageContextInfo.webAbsoluteUrl +"/_api/web/getfolderbyserverrelativeurl('"+relativeurl+"')/Files?$top=2000&$select=ServerRelativeUrl";
            $.ajax({
                url: requestUri,
                type: "GET",
                headers: {
                    "accept": "application/json; odata=verbose"
                },
                success: onSuccess,
            });
    
    
            });
    
            function onSuccess(data) {
                var objItems = data.d.results;
                console.log(objItems);
                var divContent = '<div class="row" id="myList">';
                for (var i = 0; i < objItems.length; i++) {
    
                    divContent += '<div class="col-md-3"><div class="card mb-4 shadow-sm"><img src="' + objItems[i].ServerRelativeUrl + '"><a class="stretched-link" target="_blank" href="' + objItems[i].ServerRelativeUrl + '"></a></div></div>';
    
                }
                $('#ImgGrid').append(divContent);
            }
    
            function GetParameterValues(param) {
                var url = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
                for (var i = 0; i < url.length; i++) {
                    var urlparam = url[i].split('=');
                    if (urlparam[0] == param) {
                        return urlparam[1];
                    }
                }
            }
        </script>
    
    <main role="main">
        <section class="pt-4 pb-4 text-center">
            <div class="container">
    
    
            </div>
        </section>
        <div class="container">
            <div id="myList">
                <div id="ImgGrid"></div>
            </div>
        </div>
    

    在上面的代码演示中,我的网址是https://tenant.sharepoint.com/sites/dev/

    所以相对 url 使用的是 /sites/dev/Shared Documents/folder1

    更新:

    在第二页的url中获取文件夹查询字符串参数如下:

    JSRequest.EnsureSetup();
    var itemId = JSRequest.QueryString["Folder"];
    

    【讨论】:

    • 感谢您的建议。我是新手,我不知道将这个值从 url 传递给 api 调用。如果可能,请修改我的代码。
    • @JacksonChristopher,检查更新的答案。
    • 感谢您的帮助,澄清一下,我有一个页面提供了一个 url 来使用从第一页传递的 url 中的值生成第二个页面。第二个页面代码将是一个通用页面,它接收输入并使用 URL 参数更新 API 调用并呈现。希望这可以澄清。
    • 原帖解释。
    • 如果你想获取这个url中的?Folder查询字符串,使用这个博客中的函数:enjoysharepoint.com/get-query-string-value-in-jquery-sharepoint,我会在上面的答案中更新。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-06-26
    • 2012-10-09
    • 1970-01-01
    • 1970-01-01
    • 2014-12-26
    • 2017-04-18
    相关资源
    最近更新 更多