PowerBI 自定义视觉对象中的 IFrame 中的 asp.mvc 应用程序，执行 jquery

Question

我的 ASP.Net MVC 应用程序托管在 IFrame 中。由于服务器响应时间长，我在帖子上显示了一个等待符号。这意味着我的帖子是基于 jQuery 和 json 与我的控制器之间的。单独运行我的 MVC 应用程序可以正常工作，但在 iframe 中根本不行。 IFrame 位于 PowerBi 中的自定义视觉对象中。

在 Global.asax 我有代码

AntiForgeryConfig.SuppressXFrameOptionsHeader = true;

在我的控制器中我已经删除了

[ValidateAntiForgeryToken]

在我看来，我已经删除了

@Html.AntiForgeryToken()

发布后，我收到这些响应错误

• 选项https://myurl/Edit/707057500079987300 401（未授权）
• 对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，Origin 'null' 不允许访问。响应的 HTTP 状态代码为 401。

我已更改我的控制器和视图以使用 GET 请求。但是结果一样，http错误401。

我的目标不是让站点 A 与站点 B 交互，而只是展示它。

站点 B，我的 MVC 应用程序，应该做一些服务器端的事情并显示结果。 通过设置 AntiForgeryConfig.SuppressXFrameOptionsHeader = true 并删除验证，我认为我的目标可行。

请求：

选项 /AENettMicrofunctions/InstantReading/GetDetails/707057500079332843 HTTP/1.1 主持人：aensmartgrid.ae.no 连接：保持活动 访问控制请求方法：GET 产地：无 用户代理：Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36 访问控制请求标头：x-requested-with 接受： */* 接受编码：gzip、deflate、br 接受语言：nb-NO,nb;q=0.9,no;q=0.8,nn;q=0.7,en-US;q=0.6,en;q=0.5

回应

HTTP/1.1 200 正常 缓存控制：私有 内容类型：文本/html；字符集=utf-8 服务器：Microsoft-IIS/8.5 X-AspNetMvc-版本：5.2 X-AspNet-版本：4.0.30319 持久认证：真 X-Powered-By: ASP.NET 日期：格林威治标准时间 2018 年 6 月 21 日星期四 13:59:02 ntCoent-长度：5015 内容编码：gzip 内容长度：1651

如下所示，我已将以下内容添加到 web.config

<system.webServer>
<validation validateIntegratedModeConfiguration="false" />
<httpProtocol> 
    <customHeaders> 
        <add name="Access-Control-Allow-Origin" value="*" /> 
        <add name="Access-Control-Allow-Headers" value="Content-Type" />
        <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
    </customHeaders> 
</httpProtocol>

我在这里做错了什么？

为什么是 http 动词 OPTION，而在 jquery 中它显然是 GET？

我错过了什么？

我的视图代码如下。

问候 弗罗德

@model AE.Net.MicrofunctionViews.Models.InstantReadingRequest

@{
ViewBag.Title = "Momentanavlesning spenning";
}

<div>
@Html.ValidationSummary(false, "", new { @class = "text-danger" })
<div class="form-group">
    @Html.Label("model.UsagePoint", "Målepunkt: ")
    @Html.DisplayFor(model => model.UsagePoint)
    @Html.HiddenFor(model => model.UsagePoint, "UsagePointId")
</div>
<div id="divProcessing" class="col-md-10">
    <img src="~/Content/ajax-loader.gif" />
</div>
<div id="divData" class="form-group">
    @Html.Label("model.ReadingResult", "Resultat: ")
    <img src="~/Content/GreenSmiley.jpg" id="GreenSmiley" />
    <img src="~/Content/RedSmiley.jpg"  id="RedSmiley" />
    <div>
        @Html.TextAreaFor(model => model.ReadingResult, new { @cols = "50", @rows = "4" })
    </div>
</div>
</div>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")

<script type="text/javascript">

    $(document).ready(function () {

        // Hide the "busy" Gif at load:
        $("#divProcessing").show();
        $("#divData").hide();
        $("#GreenSmiley").hide();
        $("#RedSmiley").hide();

        var usagePointId = $("#UsagePoint").val();
        var url = "@Url.Action("GetDetails", "InstantReading")/" + usagePointId;
        $.ajax({
            url: url,
            type: "GET",
            dataType: "json",
            success: function (resp) {                    
                // Hide the "busy" gif:
                $("#divProcessing").hide();
                $("#divData").show();
                if (resp.errors) {

                    var $summaryUl = $(".validation-summary-valid").find("ul");
                    $summaryUl.empty();
                    $.each(resp.errors,
                        function (a, b) {
                            $summaryUl.append($("<li>").text(b.Errors[0].ErrorMessage));
                        });
                }
                else {
                    $("#ReadingResult").val(resp.ReadingResult);
                    var ResultHaveVoltageReading = resp.ResultHaveVoltageReading;
                    if (ResultHaveVoltageReading) {
                        var ResultVoltageReadingIsOk = resp.ResultVoltageReadingIsOk;
                        if (ResultVoltageReadingIsOk) {
                            $("#GreenSmiley").show();

                        }
                        else {
                            $("#RedSmiley").show();
                        }
                    }
                }
            },
            error: function (xhr) {
                $("#divProcessing").hide();
                $("#divData").show();
                $("#ReadingResult").val(xhr.val);
            }
        })
    });
</script>
}

Answer 1

这是一个 CORS 问题。

OPTION 请求在请求中没有任何身份验证。导致 IIS 忽略它。 OPTION 请求的自定义 http 处理程序解决了该问题。