使用fetch（）API返回部分视图

Question

fetch API在这里是旧XMLHttpRequest API的现代替代。

许多JavaScript库，例如jQuery，MooTools，Prototype和Zepto等，添加了非标准的X-Requested-With请求标头，该标头已成为deacto标准并受许多JavaScript支持库以及Web应用程序框架，例如Ruby on Rails，Laravel，Sinatra，Spring，Symfony，ASP.NET MVC等

随着JavaScript的现代化，jQuery逐渐失去了知名度，AngularJS曾经发送XMLHttpRequest标头，但现在不再发送。 ASP.NET Core MVC不再包含IsAjaxRequest扩展方法。

许多Web应用程序框架都具有“部分视图”的概念，因此它可以返回没有页眉和页脚的视图。

如何响应fetch()请求返回部分视图？

我可以将X-Requested-With标头添加到提取请求中，但似乎some people反对该说法，认为它是非标准标头，并且它破坏了某些Web代理中的缓存，可能会导致额外的飞行前OPTIONS请求等。

这些人说应该改用Accept标头。但是我该怎么做呢？我想返回两种类型的请求的HTML内容，只是fetch（）请求应获取页面的子集（内容，但没有页眉和页脚）。

Accept标头的值是什么？

if page_is_requested_by_fetch_api:
    return content
else:
    return header + content + footer

在我看来，Accept标头无法使用。我不知道如何使用它。当正常请求页面和请求局部视图时，我需要HTML内容，即text/html。

• 我应该使用Accept标头并发明自己的非标准MIME类型，例如text/partial+html吗？
• 我是否应该将X-Requested-With添加到我的fetch（）请求的标头中？
• 我应该附加查询字符串，例如/page?type=partialview吗？
• 我应该具有不同的HTTP端点，例如/Account/Login和/Account/LoginPartial吗？
• 我应该获取整页，解析DOM并提取<main>元素的内容吗？

Answer 1

如何响应fetch（）请求返回部分视图？

我自己在Razor Pages中使用它。这是JavaScript代码

fetch(url)
        .then((response) => { return response.text(); })
        .then((result) => {
                $('#container').html(result);
        });

这是cshtml.cs文件中的代码。我想对于MVC中的控制器也一样：

public async Task<PartialViewResult> OnGetSomeObjectList()
{
    return new PartialViewResult()
    {
        ViewName = "NAME_OF_PARTIAL_VIEW",
        ViewData = new ViewDataDictionary<IEnumerable<object>>(ViewData, new List<object>()
        {
            new object(),
            new object()
        })
    };
}

希望这会有所帮助！