REST API 生成的 Sharepoint 列表的“图像”列不显示图像预览

问题描述 投票:0回答:1

我有以下方法创建一个“hyperlinkOrPicture”列,因为它由 Graph API 引用,它本质上只是一个 URL。 Sharepoint API 通过 FieldTypeKind 值引用列类型。

async function createHyperlinkOrImage(sharePointAPIaccessToken, listId, columnName, isImage) {
    const sharePointApiUrl = `${process.env.SITE_URL}/_api/web/lists(guid'${listId}')/fields`;

    // FieldTypeKind = 11 => URL type
    // DisplayFormat = 0 => Hyperlink, 1 => Image
    const sharePointPayload = {
        "__metadata": { "type": "SP.FieldUrl" },
        "Title": columnName,
        "FieldTypeKind": 11,
        "DisplayFormat": isImage ? 1 : 0,
    };

    try {
        const response = await fetch(sharePointApiUrl, {
            method: "POST",
            headers: {
                Authorization: `Bearer ${sharePointAPIaccessToken}`,
                Accept: "application/json;odata=verbose",
                "Content-Type": "application/json;odata=verbose",
            },
            body: JSON.stringify(sharePointPayload),
        });
        // error handling 
    }
       
}

列已正确创建。它处理当列纯粹是超链接(isImage 设置为 0)时,问题出在图像列(isImage 设置为 1):上传图像,它不会在单元格中呈现,这在手动创建列时会发生:“添加列”->“图像”。我对以下两者进行了并排比较:

enter image description here

左侧是通过 REST API 生成的列,右侧是通过 UI 生成的列。

一个很大的区别(我认为这是发生这种情况的原因)是在查看列的属性时,我们看到 REST API 生成的图像列没有指定“类型”。

打开列设置时,我看到以下内容:

enter image description here

对于手动设置的列:

enter image description here

最后,我注意到在“添加新项目”页面上无法直接添加图像: enter image description here enter image description here

我无法从列名称旁边的图像图标清楚地看出 Sharepoint 将该列识别为什么,它应该呈现为图像列。然而,它的行为就像一个超链接列。

谢谢!

javascript sharepoint microsoft-graph-api sharepoint-api
1个回答
0
投票

以下是我对上面创建的列表向以下端点发出 GET 请求的结果:

${SITE_URL}/_api/web/lists(guid'${listId}')/fields

将工作超链接列与我们的“图像列”进行比较

首先,将常规超链接列与图像列进行比较(不起作用)。从现在开始我将分别将它们称为 A 和 B。

A 列的

SchemaXML
字段:

"SchemaXml": "<Field DisplayName=\"Hyperlinks to stuff\" Type=\"URL\"
Required=\"FALSE\" ID=\"{d5a65922-6472-4e3f-8262-1ecae1c8f157}\" SourceID=\"
{ca3a557c-cbe8-44be-9f86-04c68884d222}\"
StaticName=\"Hyperlinks_x0020_to_x0020_stuff\"
Name=\"Hyperlinks_x0020_to_x0020_stuff\" ColName=\"nvarchar7\"
RowOrdinal=\"0\" ColName2=\"nvarchar8\" RowOrdinal2=\"0\"
Format=\"Hyperlink\" Hidden=\"FALSE\" CanToggleHidden=\"TRUE\" Version=\"1\"
/>"

B 列的

SchemaXML
(图像列未正确渲染):

"SchemaXml": "<Field DisplayName=\"Files (Image Files Only)\" Type=\"URL\"
Required=\"FALSE\" ID=\"{c3645596-cd5a-455c-8489-7ad084fdbe4d}\" SourceID=\"
{ca3a557c-cbe8-44be-9f86-04c68884d222}\"
StaticName=\"Files_x0020__x0028_Image_x0020_F\"
Name=\"Files_x0020__x0028_Image_x0020_F\" ColName=\"nvarchar9\"
RowOrdinal=\"0\" ColName2=\"nvarchar10\" RowOrdinal2=\"0\" Version=\"2\"
Format=\"Image\" Hidden=\"FALSE\" CanToggleHidden=\"TRUE\"
/>"

主要区别

A:

SchemaXML.Format
显示为超链接

B:

SchemaXML.Format
显示为图像

其他相关差异:

// Column A data:
"FieldTypeKind": 11,
"TypeAsString": "URL",
"TypeDisplayName": "Hyperlink or Picture",
"TypeShortDescription": "Hyperlink or Picture",
"ValidationFormula": null,
"ValidationMessage": null,
"DisplayFormat": 0

// Column B Data: (Same as above with the exception):
"DisplayFormat": 1

比较 B 列和 C 列(手动添加的图像列)。我将为每列提供完整的有效负载...

B 栏

{
    "__metadata": {
      "id": "https://greymatterconcepts.sharepoint.com/sites/DataStrategy/_api/Web/Lists(guid'ca3a557c-cbe8-44be-9f86-04c68884d222')/Fields(guid'c3645596-cd5a-455c-8489-7ad084fdbe4d')",
      "uri": "https://greymatterconcepts.sharepoint.com/sites/DataStrategy/_api/Web/Lists(guid'ca3a557c-cbe8-44be-9f86-04c68884d222')/Fields(guid'c3645596-cd5a-455c-8489-7ad084fdbe4d')",
      "type": "SP.FieldUrl"
    },
    "DescriptionResource": {
      "__deferred": {
        "uri": "https://greymatterconcepts.sharepoint.com/sites/DataStrategy/_api/Web/Lists(guid'ca3a557c-cbe8-44be-9f86-04c68884d222')/Fields(guid'c3645596-cd5a-455c-8489-7ad084fdbe4d')/DescriptionResource"
      }
    },
    "TitleResource": {
      "__deferred": {
        "uri": "https://greymatterconcepts.sharepoint.com/sites/DataStrategy/_api/Web/Lists(guid'ca3a557c-cbe8-44be-9f86-04c68884d222')/Fields(guid'c3645596-cd5a-455c-8489-7ad084fdbe4d')/TitleResource"
      }
    },
    "AutofillInfo": null,
    "AutoIndexed": false,
    "CanBeDeleted": true,
    "ClientSideComponentId": "00000000-0000-0000-0000-000000000000",
    "ClientSideComponentProperties": null,
    "ClientValidationFormula": null,
    "ClientValidationMessage": null,
    "CustomFormatter": null,
    "DefaultFormula": null,
    "DefaultValue": null,
    "Description": "",
    "Direction": "none",
    "EnforceUniqueValues": false,
    "EntityPropertyName": "Files_x0020__x0028_Image_x0020_F",
    "Filterable": false,
    "FromBaseType": false,
    "Group": "Custom Columns",
    "Hidden": false,
    "Id": "c3645596-cd5a-455c-8489-7ad084fdbe4d",
    "Indexed": false,
    "IndexStatus": 0,
    "InternalName": "Files_x0020__x0028_Image_x0020_F",
    "IsModern": false,
    "JSLink": "clienttemplates.js",
    "PinnedToFiltersPane": false,
    "ReadOnlyField": false,
    "Required": false,
    "SchemaXml": "<Field DisplayName=\"Files (Image Files Only)\" Type=\"URL\" Required=\"FALSE\" ID=\"{c3645596-cd5a-455c-8489-7ad084fdbe4d}\" SourceID=\"{ca3a557c-cbe8-44be-9f86-04c68884d222}\" StaticName=\"Files_x0020__x0028_Image_x0020_F\" Name=\"Files_x0020__x0028_Image_x0020_F\" ColName=\"nvarchar9\" RowOrdinal=\"0\" ColName2=\"nvarchar10\" RowOrdinal2=\"0\" Version=\"2\" Format=\"Image\" Hidden=\"FALSE\" CanToggleHidden=\"TRUE\" />",
    "Scope": "/sites/DataStrategy/Lists/Test Table",
    "Sealed": false,
    "ShowInFiltersPane": 0,
    "Sortable": true,
    "StaticName": "Files_x0020__x0028_Image_x0020_F",
    "Title": "Files (Image Files Only)",
    "FieldTypeKind": 11,
    "TypeAsString": "URL",
    "TypeDisplayName": "Hyperlink or Picture",
    "TypeShortDescription": "Hyperlink or Picture",
    "ValidationFormula": null,
    "ValidationMessage": null,
    "DisplayFormat": 1
  }

C 栏

{
    "__metadata": {
      "id": "https://greymatterconcepts.sharepoint.com/sites/DataStrategy/_api/Web/Lists(guid'ca3a557c-cbe8-44be-9f86-04c68884d222')/Fields(guid'983cfe9e-e2a8-453f-8d82-5600d8641415')",
      "uri": "https://greymatterconcepts.sharepoint.com/sites/DataStrategy/_api/Web/Lists(guid'ca3a557c-cbe8-44be-9f86-04c68884d222')/Fields(guid'983cfe9e-e2a8-453f-8d82-5600d8641415')",
      "type": "SP.FieldMultiLineText"
    },
    "DescriptionResource": {
      "__deferred": {
        "uri": "https://greymatterconcepts.sharepoint.com/sites/DataStrategy/_api/Web/Lists(guid'ca3a557c-cbe8-44be-9f86-04c68884d222')/Fields(guid'983cfe9e-e2a8-453f-8d82-5600d8641415')/DescriptionResource"
      }
    },
    "TitleResource": {
      "__deferred": {
        "uri": "https://greymatterconcepts.sharepoint.com/sites/DataStrategy/_api/Web/Lists(guid'ca3a557c-cbe8-44be-9f86-04c68884d222')/Fields(guid'983cfe9e-e2a8-453f-8d82-5600d8641415')/TitleResource"
      }
    },
    "AutofillInfo": null,
    "AutoIndexed": false,
    "CanBeDeleted": true,
    "ClientSideComponentId": "00000000-0000-0000-0000-000000000000",
    "ClientSideComponentProperties": null,
    "ClientValidationFormula": null,
    "ClientValidationMessage": null,
    "CustomFormatter": null,
    "DefaultFormula": null,
    "DefaultValue": null,
    "Description": "",
    "Direction": "none",
    "EnforceUniqueValues": false,
    "EntityPropertyName": "ManualImageColumn",
    "Filterable": false,
    "FromBaseType": false,
    "Group": "Custom Columns",
    "Hidden": false,
    "Id": "983cfe9e-e2a8-453f-8d82-5600d8641415",
    "Indexed": false,
    "IndexStatus": 0,
    "InternalName": "ManualImageColumn",
    "IsModern": false,
    "JSLink": "clienttemplates.js",
    "PinnedToFiltersPane": false,
    "ReadOnlyField": false,
    "Required": false,
    "SchemaXml": "<Field ClientSideComponentId=\"00000000-0000-0000-0000-000000000000\" DisplayName=\"Another Image Column\" Format=\"Thumbnail\" Name=\"ManualImageColumn\" Title=\"Another Image Column\" Type=\"Thumbnail\" ID=\"{983cfe9e-e2a8-453f-8d82-5600d8641415}\" Version=\"2\" StaticName=\"ManualImageColumn\" SourceID=\"{ca3a557c-cbe8-44be-9f86-04c68884d222}\" ColName=\"ntext2\" RowOrdinal=\"0\" />",
    "Scope": "/sites/DataStrategy/Lists/Test Table",
    "Sealed": false,
    "ShowInFiltersPane": 0,
    "Sortable": false,
    "StaticName": "ManualImageColumn",
    "Title": "Another Image Column",
    "FieldTypeKind": 34,
    "TypeAsString": "Thumbnail",
    "TypeDisplayName": "Thumbnail",
    "TypeShortDescription": "Image",
    "ValidationFormula": null,
    "ValidationMessage": null,
    "AllowHyperlink": false,
    "AppendOnly": false,
    "IsLongHyperlink": false,
    "NumberOfLines": 6,
    "RestrictedMode": true,
    "RichText": false,
    "UnlimitedLengthInDocumentLibrary": false,
    "WikiLinking": false
  }

注意:

EntityPropertyName
是创建列时的原始名称,因此您会在一些地方看到“ManualImageColumn”。我已将名称更改为“另一个图像栏”以匹配我最初的帖子。

主要区别

  1. 在最顶部的
    __metadata
    下,我们看到 B 列的类型为:“SP.FieldUrl”,而 C 列的类型为:“SP.MultiLineText”。这显然对我来说没有任何意义。
  2. 比较
    SchemaXML
    可以清楚地看出,这两者的渲染方式完全不同。 C 列的
    SchemaXML.Format
    值为“缩略图”,其
    .Type
    属性也是“缩略图”。

我真的希望 Microsoft 团队清理 API 的文档,因为使用 Graph API 和 Sharepoint REST API 导航所有这些不同的字段类型和差异非常困难。

我想我的下一步是弄清楚是否可以创建一个字段类型为缩略图的列。否则我不知道如何继续进行任何修复。

© www.soinside.com 2019 - 2024. All rights reserved.