microsoft-teams - 如何让 OnPost 在 Microsoft Teams 中触发

Question

我们有一个使用 ASP.NetCore 和 Razor 页面编写的 Web 应用程序。

我们希望将其用作选项卡中的 Teams 应用程序。

但是，我注意到提交（触发 OnPost 事件）无法在 Teams 下工作，即使它作为标准 Web 应用程序都可以正常工作。

我怀疑这可能与应用程序在 Teams IFrame 下运行并且无法提交的事实有关。

任何人都可以向我提供任何建议或代码示例，以便在 Teams 下运行时，我需要修改如下提交以触发 OnPost。我附上了一个简单的表单（登录表单），后面有代码。

谢谢。

1. 登录.cshtml

@page
@model AreoWeb.Pages.Registration.Login
<br />
<h2 class="text-info">Login</h2>
<br />

<div class="border container" style="padding:30px">
    <form id="frm" method="post" >

        <div class="text-danger" asp-validation-summary="ModelOnly"></div>


        <div class="form-group row">
            <div class="col-2">
                <label>Email Address</label>
            </div>
            <div class="col-5">
                <input asp-for="LoginDetails.EmailAddress" class="form-control" />
            </div>

            <span asp-validation-for="LoginDetails.EmailAddress" class="text-danger"></span>

        </div>

        <div class="form-group row">
            <div class="col-2">
                <label>Password</label>
            </div>
            <div class="col-5">
                <input asp-for="LoginDetails.Password" class="form-control" />
            </div>

            <span asp-validation-for="LoginDetails.Password" class="text-danger"></span>

        </div>

        <div class="form-group row">
            <div class="col-2 offset-2">
                <input type="submit" value="Login" class=" btn btn-primary form-control" asp-page="Login" />
            </div>

            <div class="col-1">
            </div>

            <div class="col-2">
                <a asp-page="/Index" class="btn btn-success form-control">Cancel</a>
            </div>
        </div>
    </form>
</div>

    

</script>
@section Scripts
{
    <partial name="_ValidationScriptsPartial"/>

}

2. 登录.cshtml.cs

using System.Threading.Tasks;
using areo;
using AreoErr;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using AreoWeb.Model;
using AreoWeb.Pages.Shared;


namespace AreoWeb.Pages.Registration
{
    public class Login : PageModel
    {
        [BindProperty] 
        public LoginDetails LoginDetails { get; set; }
        
         public async Task <IActionResult> OnPost()
        {

            if(ModelState.IsValid)
            {
                ErrConsts.ErrorCode ret = await DoLogin(LoginDetails.EmailAddress,LoginDetails.Password);
                if (ret==ErrConsts.ErrorCode.Success)
                    return RedirectToPage("/Messages/Index");
                else
                    return RedirectToPage("Error");
            }
            else
            {
                return Page();
            }
        }


        public async Task<ErrConsts.ErrorCode> DoLogin(string emailAddress,string password)
        {
         // 
        }

当直接从浏览器运行时，应用程序会在浏览器调试器下记录以下内容。页面加载并成功提交：

DOM7011: The code on this page disabled back and forward caching. For more information, see: http://go.microsoft.com/fwlink/?LinkID=291337
repost.htm
HTML1300: Navigation occurred.
Login
DOM7011: The code on this page disabled back and forward caching. For more information, see: http://go.microsoft.com/fwlink/?LinkID=291337
repost.htm

在 Microsoft Team 下运行时，相同的页面加载和提交会在浏览器调试器中生成以下内容（最后一个条目在按下提交后出现。前两个和最后一个条目是错误）：

2020-07-23T07:08:37.621Z ChannelService: Empty threadId         0-angular-jquery.min-eee9041.js:114:37
2020-07-23T07:08:38.574Z ChannelService: Empty threadId         0-angular-jquery.min-eee9041.js:114:37
Feature Policy: Skipping unsupported feature name “midi”.       0-angular-jquery.min-eee9041.js:1:49340
Feature Policy: Skipping unsupported feature name “encrypted-media”.    0-angular-jquery.min-eee9041.js:1:49340
Feature Policy: Skipping unsupported feature name “midi”.       0-angular-jquery.min-eee9041.js:1:49340
Feature Policy: Skipping unsupported feature name “encrypted-media”.    0-angular-jquery.min-eee9041.js:1:49340
Content Security Policy: Ignoring “'unsafe-inline'” within script-src or style-src: nonce-source or hash-source specified 2
Feature Policy: Skipping unsupported feature name “midi”.       0-angular-jquery.min-eee9041.js:27:416
Feature Policy: Skipping unsupported feature name “encrypted-media”.    0-angular-jquery.min-eee9041.js:27:416
Feature Policy: Skipping unsupported feature name “midi”.       0-angular-jquery.min-eee9041.js:1:48779
Feature Policy: Skipping unsupported feature name “encrypted-media”.    0-angular-jquery.min-eee9041.js:1:48779
Content Security Policy: Ignoring “'unsafe-inline'” within script-src or style-src: nonce-source or hash-source specified 2
Feature Policy: Skipping unsupported feature name “midi”.       3.2-app.min-0f0e437.js:5:662533
Feature Policy: Skipping unsupported feature name “encrypted-media”.    3.2-app.min-0f0e437.js:5:662533
Content Security Policy: Ignoring “'unsafe-inline'” within script-src or style-src: nonce-source or hash-source specified

The character encoding of the plain text document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the file needs to be declared in the transfer protocol or file needs to use a byte order mark as an encoding signature. Login

?

应用程序生成的 HEAD 部分确实定义了字符集，如下所示：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title> - Areo Web</title>
    <link rel="stylesheet" href="/lib/bootstrap/dist/css/bootstrap.min.css" />
    <link rel="stylesheet" href="/css/site.css" />
</head>
<body>

标签： microsoft-teamsasp.net-core-3.1