SharePoint Add-ins 废止 替换方法及示例

SharePoint Add-ins（也称为Apps for SharePoint）已经被微软宣布为过时的技术，尤其是在SharePoint Online环境中。如果你正在使用SharePoint Add-ins并且需要寻找替代方案，可以考虑以下几种现代方法：

• SharePoint Framework (SPFx):

  • SPFx是开发SharePoint自定义解决方案的推荐方式。它允许你在SharePoint页面中添加Web部件、扩展和应用程序。
  • 使用React, Vue等现代前端框架构建交互式的用户界面。
  • 支持与Microsoft Graph集成以访问Office 365数据。

• Power Platform:

  • Power Apps: 可用于快速创建自定义业务应用，无需编写大量代码。你可以连接到SharePoint列表和其他数据源来构建表单和视图。
  • Power Automate: 前身为Flow，用来自动化工作流，可以轻松地触发和执行各种任务，包括但不限于文件管理、审批流程等。
  • Power BI: 对于报表和仪表板需求，Power BI提供强大的数据分析和可视化工具，可以直接从SharePoint获取数据。

• Azure Solutions:

  • 如果你需要更复杂的应用程序逻辑或者后端服务，可以考虑利用Azure提供的云服务如Azure Functions, Azure Logic Apps等。
  • 这些服务能够与SharePoint很好地集成，并且提供了更大的灵活性和可扩展性。

• 第三方工具和服务:

  • 市场上还有许多第三方供应商提供针对SharePoint的插件或SaaS产品，这些可能包含特定行业的功能或特性，可以根据具体需求选择合适的工具。

SharePoint Add-ins（也称为Apps for SharePoint）已经被微软宣布为过时的技术，尤其是在SharePoint Online环境中。以下是几种现代的替代方案及其示例代码或配置方法：

1. SharePoint Framework (SPFx)

场景：创建一个简单的Web部件

描述：使用SPFx创建一个显示欢迎信息的Web部件。

步骤：

• 安装必要的工具和依赖项：

  bash

  npm install -g yo generator-spfx

• 创建一个新的SPFx项目：

  bash

  yo @microsoft/sharepoint

• 在生成的项目中，编辑src/webparts/helloWorld/HelloWorldWebPart.ts文件：

  typescript

  import * as React from 'react';
  import * as ReactDom from 'react-dom';
  import { Version } from '@microsoft/sp-core-library';
  import {
    BaseClientSideWebPart,
    IPropertyPaneConfiguration,
    PropertyPaneTextField
  } from '@microsoft/sp-webpart-base';
  
  import * as strings from 'HelloWorldWebPartStrings';
  import HelloWorld from './components/HelloWorld';
  import { IHelloWorldProps } from './components/IHelloWorldProps';
  
  export interface IHelloWorldWebPartProps {
    description: string;
  }
  
  export default class HelloWorldWebPart extends BaseClientSideWebPart<IHelloWorldWebPartProps> {
  
    public render(): void {
      const element: React.ReactElement<IHelloWorldProps> = React.createElement(
        HelloWorld,
        {
          description: this.properties.description
        }
      );
  
      ReactDom.render(element, this.domElement);
    }
  
    protected get dataVersion(): Version {
      return Version.parse('1.0');
    }
  
    protected getPropertyPaneConfiguration(): IPropertyPaneConfiguration {
      return {
        pages: [
          {
            header: {
              description: strings.PropertyPaneDescription
            },
            groups: [
              {
                groupName: strings.BasicGroupName,
                groupFields: [
                  PropertyPaneTextField('description', {
                    label: strings.DescriptionFieldLabel
                  })
                ]
              }
            ]
          }
        ]
      };
    }
  }

• 构建并打包项目：

  bash

  gulp build
  gulp bundle --ship
  gulp package-solution --ship

• 将生成的.sppkg文件上传到SharePoint应用目录，并添加到页面上。

2. Power Platform

场景：使用Power Apps创建一个自定义表单

描述：创建一个连接到SharePoint列表的简单表单。

步骤：

• 打开Power Apps Studio。
• 选择“从数据开始”，然后选择“SharePoint”作为数据源。
• 选择你的SharePoint站点和列表。
• 使用拖放界面设计表单，添加文本框、按钮等控件。
• 发布应用并嵌入到SharePoint页面中。

示例代码（用于Power Automate自动化工作流）

场景：自动发送邮件通知当有新条目添加到SharePoint列表时。

json

{
  "definition": {
    "$schema": "https://schema.management.azure.com/providers/Microsoft.Logic/schemas/2016-06-01/workflowdefinition.json#",
    "contentVersion": "1.0.0.0",
    "parameters": {},
    "triggers": {
      "When_a_new_item_is_created": {
        "type": "SharePointTrigger",
        "inputs": {
          "siteAddress": "https://your-sharepoint-site",
          "listName": "YourListName",
          "operation": "When a new item is created"
        }
      }
    },
    "actions": {
      "Send_an_email_(V2)": {
        "type": "ApiConnection",
        "inputs": {
          "body": {
            "to": "recipient@example.com",
            "subject": "New Item Created in SharePoint List",
            "body": "A new item has been created in the SharePoint list."
          },
          "host": {
            "connection": {
              "name": "@parameters('$connections')['office365']['connectionId']"
            }
          },
          "method": "post",
          "path": "/v2/Mail"
        },
        "runAfter": {}
      }
    }
  }
}

3. Azure Solutions

场景：使用Azure Functions处理业务逻辑

描述：创建一个Azure Function来处理来自SharePoint的HTTP请求。

步骤：

• 创建一个新的Azure Function项目：

  bash

  func init MyFunctionApp --worker-runtime dotnet
  cd MyFunctionApp
  func new --template "HTTP trigger" --name HttpExample

• 编辑HttpExample.cs文件：

  csharp

  using System.IO;
  using Microsoft.AspNetCore.Mvc;
  using Microsoft.Azure.WebJobs;
  using Microsoft.Azure.WebJobs.Extensions.Http;
  using Microsoft.AspNetCore.Http;
  using Microsoft.Extensions.Logging;
  using Newtonsoft.Json;
  
  public static class HttpExample
  {
      [FunctionName("HttpExample")]
      public static IActionResult Run(
          [HttpTrigger(AuthorizationLevel.Function, "get", "post", Route = null)] HttpRequest req,
          ILogger log)
      {
          log.LogInformation("C# HTTP trigger function processed a request.");
  
          string name = req.Query["name"];
  
          string requestBody = new StreamReader(req.Body).ReadToEnd();
          dynamic data = JsonConvert.DeserializeObject(requestBody);
          name = name ?? data?.name;
  
          string responseMessage = string.IsNullOrEmpty(name)
              ? "This HTTP triggered function executed successfully. Pass a name in the query string or in the request body for a personalized response."
              : $"Hello, {name}. This HTTP triggered function executed successfully.";
  
          return new OkObjectResult(responseMessage);
      }
  }

• 部署Azure Function到Azure门户，并设置API端点以供SharePoint调用。