从 SharePoint Online 网站或页面创建 Teams Intranet 门户应用Create a Teams 'Intranet Portal app' from a SharePoint Online site or page

使用本文中的步骤,在 Teams 内创建一个链接到组织 Intranet 网站的独立和静态应用。Use the steps in this article to create a standalone and static app inside of Teams that links to the intranet site for your org.

你的 SharePoint Intranet 网站 Teams 个人应用创建完成,并在 Teams 内显示为一个选项卡。A Teams Personal App of your SharePoint intranet site is created, and will appear as a tab inside of Teams. 此选项卡中可能包含对所有团队用户非常重要的信息。This tab can contain information important to all your Teams users. 只需单击一下选项卡,Teams 用户就可以快速方便地获取更新。It is a quick and convenient way for Teams users to access updates just a tab click away.

注意显示的过程*必须使用***新式 SharePoint 网站或页面才能正常工作。Be aware that the process shown must use a modern SharePoint site or page to work. 此过程适用于经典网站或页面。This process is not available for classical sites or pages.

重要

确保已为租户启用了旁加载 Teams 应用。Make certain that side-loading of Teams apps is enabled for your tenant. 根据在 Teams Admin 门户迁移过程中所处的位置,在上一版本门户中,可能需要在Teams > “管理员” 或在 “管理员” > “设置” > “服务和加载项” > Microsoft Teams> “应用” > “外部应用”下进行启用!Depending on where you are in the migration process of the Teams Admin portal, you might need to enable it either under Teams > Admin, or under Admin > Settings > Services and Add-ins > Microsoft Teams > Apps > External Apps, in the previous version of the portal!

使用 App Studio 创建独立 SharePoint Online 应用Use App Studio to create your standalone SharePoint Online app

开始之前:Before you begin:

  1. 需要知道 SharePoint Online 新式通信或 Team 网站或页面的 URL。You'll need to know the URL of a SharePoint Online modern Communication or Team site, or page.

    • 这些网站在路径中始终包含 /teams//sites/These sites will always have either /teams/ or /sites/ in their paths.
  2. 需要知道在占位符 {{subdomain}} 中使用的租户子域。You'll need to know your tenant's subdomain, which will be used in the placeholder {{subdomain}}.

  3. 本文将使用占位符 {{siteUrl}} 作为所选网站或页面的 URLThis article will use {{siteUrl}} as a placeholder for the URL of the site or page you chose.

  4. 此外,{{sitePath}} 将用于表示 URL 的路径(例如: /teams/Contoso)。Also, {{sitePath}} will be used to denote the path of the URL (ex: /teams/Contoso).

    • 示例路径: /teams/Contoso /sites/ContosoExample paths: /teams/Contoso or /sites/Contoso

首先按照以下步骤进行操作:Begin by following the steps below:

  1. 转到 “Teams Store”。Go to the Teams Store.

  2. 安装或打开 App Studio。Install or open App Studio.

  3. 单击应用选项旁的“打开”。Click Open, next to the App option.

  4. App Studio 打开时,单击“清单编辑器”。With App Studio open, click on Manifest Editor.

  5. 新建应用Create a new app.

  6. 填写所有“应用详细信息”。Fill in all App Details.

  7. 单击功能下的“选项卡”。Click on Tabs under Capabilities.

  8. 单击“个人选项卡”下的“添加”。Click Add under Personal Tab.

  9. 输入“名称”并选择“新实体唯一 ID”。Fill in the Name and choose a new unique Entity ID.

  10. 输入“contentURL 和网站 URLFill in the contentURL and Website URL.

  1. 导航至“域和权限”。Navigate to Domains and Permissions. 确保有效的域部分包含你的 SharePoint online 域名。Make sure the valid domains section contains your SharePoint online domain name.

    示例:contoso.sharepoint.comExample: contoso.sharepoint.com

  2. 添加下列 web 应用单一登录属性:Add the following web app single sign-on properties:

    示例:AAD application ID:00000003-0000-0ff1-ce00-000000000000 资源 Url:{{subdomain}}.sharepoint.comExample: AAD application ID: 00000003-0000-0ff1-ce00-000000000000 Resource Url: {{subdomain}}.sharepoint.com

    Web 应用单一登录(使用 ID 和 URL)。

  3. 保存这些属性,然后导航到“测试并分发”。Save these properties and then navigate to Test and distribute.

  4. 安装此应用以亲自测试。Install the app to test the application personally.

重要

如果没使用 Teams App Studio,必须压缩刚创建的 manifest.JSON 文件,导航到Teams 中的 App Store,然后单击“上传自定义应用”链接(位于 App Store 右下角)。If you aren't using Teams App Studio, you will have to .zip the manifest.JSON file you just created, navigate to the App Store in Teams, and click upload custom app link (at the bottom right of the App Store). 然后可以使用此应用。This will make the app available to you.

  1. 现在此应用程序可用作静态选项卡,供你在 Teams 中加载和查看。Now the app is available as a static tab for you to load and view in Teams.

测试并查看新静态选项卡Test and view your new static tab

若要在 Teams 桌面上查看新选项卡,请导航至应用栏左侧的省略号 ()。To view the new tab on the Teams desktop, navigate to the ellipses () in the left-hand side of your app bar. 查找新应用程序、加载、然后在 Teams 中测试你的独立应用。Find your new app, load it, and test your standalone application in Teams.

如果要使新应用在更高位置的左侧菜单中可用,必须为其使用应用程序策略设置。If you want to make the new app available in the left menu at a higher position, you must use an app policy setting for this. 可以在“团队管理员”部分 > “应用策略” > “添加固定应用”下找到此设置。This setting can be found under the Team admin section > app policy > add a pinned application. 将策略分配给用户进行测试时,更改将在几个小时后显示。When you assign the policy to a user for testing, the change will appear a few hours later. 考虑到这一点,请确定应尽早在哪里显示此应用程序,以帮助避免延迟。With this in mind, please decide where the app should appear at your earliest convenience to help avoid delays.

如果要在移动设备上查看和测试新应用,请点击屏幕底部附近选项卡栏上方的人字形(^),打开应用列表。To view and test the new app on a mobile device, open the app drawer by tapping on the chevron (^) above the tab bar near the bottom of your screen. 查找你的应用程序,然后在移动设备上导航到此应用。Find your app and navigate to it on your mobile device.

注意

移动支持目前仅限开发人员预览模式。Mobile support is currently in Developer Preview. 若要启用开发人员预览,请导航到“设置” > “关于”,然后启用“开发人员预览”模式。To enable Developer Preview, navigate to Settings > About and then enable Developer Preview mode.

示例清单 JSON 文件A Sample Manifest.JSON file

生成的 JSON 文件如下所示。The JSON file you generate will look something like the one below.

{

    "$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.5/MicrosoftTeams.schema.json",

    "manifestVersion": "1.5",

    "version": "1.0.0",

    "id": "33ebded3-931c-4333-b0c5-b51dd8738873",

    "packageName": "com.contoso.teams.devapp",

    "developer": {

        "name": "Contoso", ''

        "websiteUrl": "https://www.contoso.com",

        "privacyUrl": "https://www.contoso.com/privacy",

        "termsOfUseUrl": "https://www.contoso.com/terms"

    },

    "icons": {

        "color": "color.png",

        "outline": "outline.png"

    },

    "name": {

        "short": "Contoso Intranet", '

        "full": "Intranet Portal for Contoso"

    },

    "des    ription": {

        "short": "Intranet portal for Contoso",

        "full": "This app is to demonstrate the capabilities of hosting a SharePoint communication and team site as a standalone app in Teams"

    },

    "accentColor": "#FFFFFF",

    "staticTabs": [

        {

                     "       nti        Id":       "com    unicat    onSi    eTab",

            "name": "Contoso Net",

            "contentUrl": "https://contoso.sharepoint.com/sites/ContosoNet/_layouts/15/teamslogon.aspx?SPFX=true&dest=/sites/ContosoNet/",

            "websiteUrl": "https://contoso.sharepoint.com/sites/ContosoNet",

            "scopes": [

                "personal"

            ]

        },

        {

            "entityId": "teamSiteTab",

            "name": "Team Contoso",

            "contentUrl": "https://contoso.sharepoint.com/teams/TeamContoso/_layouts/15/teamslogon.aspx?SPFX=true&dest=/teams/TeamContoso/",

            "websiteUrl": "https://contoso.sharepoint.com/teams/TeamContoso",

            "scopes": [

                "personal"

            ]

        }

    ],

    "permissions": [

        "identity",

        "messageTeamMembers"

    ],

    "validDomains": [

        "contoso.sharepoint.com"

    ],

    "webApplicationInfo": {

        "id": "00000003-0000-0ff1-ce00-000000000000",

        "resource": "https://contoso.sharepoint.com"

    }

}