通过 URL 将文件夹名称传递给 SPO Rest API 调用自定义 ASPX 页面

Question

我有一页列出不同的文件夹 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>

请查看代码和建议。

Answer 1

如果图像在 url 中，如下所示：

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

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

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

使用完整的代码片段更新：

   <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>

在上面的代码演示中，我的站点 url 是https://tenant.sharepoint.com/sites/dev/

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

更新：

在第二页中像这样在 url 中获取文件夹查询字符串参数：

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