用局部视图更新 asp.net MVc 4 视图的一部分答案

【问题标题】：updating portion of asp.net MVc 4 view with partial view用局部视图更新 asp.net MVc 4 视图的一部分
【发布时间】：2014-01-31 17:00:46
【问题描述】：

我正在开发 asp.net MVC 4 应用程序。我的主视图上有一个操作链接，如下所示：

  @Ajax.ActionLink("Get LinkedIn Profile","LinkedIn", new AjaxOptions
                 {
                     UpdateTargetId="partialDiv", // <-- DOM element ID to update
                     InsertionMode = InsertionMode.Replace, // <-- Replace the content of DOM element
                     HttpMethod = "GET" // <-- HTTP method
                 })
            <div id="partialDiv"></div>

在控制器中，我有执行重定向到linkedIn并返回另一个动作结果的动作结果。

  public ActionResult LinkedIn()
        {
            return Redirect("https://www.linkedin.com/uas/oauth2/authorization?response_type=code&redirect_uri=" + HttpUtility.HtmlEncode("http://127.0.0.1:81/Account/LinkedInAuthorized"));
}

现在从LinkedInAuthorized我想返回一个部分视图或一些应该插入到partialDiv中的内容，所以我这样做：

 public ActionResult LinkedInAuthorized(string code, string state)
        {
         // some code here
        return PartialView("LinkedInProfileInfo", returnVal);
        }

但它会替换整个视图，而不是在该 div 中插入部分视图。

请建议我解决这个问题。

【问题讨论】：

确保您的视图中有对 ajax.unobtrusive 的引用
@MattBodily 我们能否在不进行 ajax 调用的情况下渲染部分视图，因为在我的情况下它不是 ajax 调用。
这不是典型的 ajax 调用，但您的链接具有 ajax 选项，因此它正在进行 ajax 调用。由于缺少参考，它正在重定向而不是填充 div

标签： jquery asp.net ajax asp.net-mvc asp.net-mvc-4

【解决方案1】：

您需要退后一步，重新评估您正在尝试做的事情。对 AJAX 和 OAuth 做更多研究也无妨，因为您显然对这些概念不太熟悉。

首先，让我们从 OAuth 流程开始。首先，您需要将用户引导至提供商上的页面，在本例中为 LinkedIn。在那里，用户将向提供商授权，然后提供商将使用有效负载发回您网站上的指定页面。您的应用程序解密该有效负载，存储任何相关详细信息，例如在以后的请求中使用的身份验证令牌，然后该过程就完成了。这不能通过 AJAX 完成。获得身份验证令牌后，您可以使用 AJAX 做任何您想做的事情，但初始授权是同步的。

现在，您的 AJAX。 AJAX 可以被认为是一个简单的 HTTP 客户端。您的浏览器也是一个 HTTP 客户端，但要复杂得多。这种复杂性的一部分在于提供无缝的用户体验，无论幕后涉及多少请求。然而，AJAX 处理一个简单的请求-响应循环。现在，让我们看看为什么这是一个重要的区别。

请求您的LinkedIn 操作的浏览器

GET /url/to/linkedin/action
> HTTP/1.1 302
> Location: https://www.linkedin.com/uas/oauth2/authorization...

GET https://www.linkedin.com/uas/oauth2/authorization...
> HTTP/1.1 200
> (crap ton of HTML)

AJAX 请求您的 LinkedIn 操作：

GET /url/to/linkedin/action
> HTTP/1.1 302
> Location: https://www.linkedin.com/uas/oauth2/authorization...

您看，浏览器知道，由于您的原始 URL 已被重定向，您可能确实想去那里，因此它会发出另一个重定向 URL 的请求。 AJAX 不做这样的假设。它发送了请求并得到了响应，所以它完成了。您可以发出另一个 AJAX 请求以继续。因此，即使您可以使用 AJAX 进行 OAuth 授权，也不能这样做。

【讨论】：

感谢非常好的解释。如何使用第二个操作结果 LinkedInAuthorized 返回的 json 并更新视图 div？

【解决方案2】：

尝试在 partialDiv 中使用 Html.RenderPartial。像这样：

<div id="partialDiv">
  @{ Html.RenderPartial("LinkedInProfileInfo", returnVal); }
</div>

returnVal 可能不是那里的正确值。它也可能是模型（对不起，我是 MVC 的新手）。

【讨论】：