Возврат частичных представлений с помощью API fetch()

Question

API выборки здесь как современная замена старого XMLHttpRequest API.

Многие библиотеки JavaScript, такие как jQuery, MooTools, Prototype, Zepto и т. Д., Добавляют нестандартные X-Requested-With заголовок запроса, который стал стандартом де-факто и поддерживается многими библиотеками JavaScript, а также платформами веб-приложений, такими как Ruby on Rails, Laravel, Sinatra, Spring, Symfony, ASP.NET MVC и т. д.

Поскольку JavaScript модернизировался, jQuery терял известность, и AngularJS использовал для отправки XMLHttpRequest заголовок, но больше не делает. ASP.NET Core MVC больше не содержит IsAjaxRequest метод расширения.

Многие платформы веб-приложений имеют концепцию "частичных представлений", поэтому они могут возвращать представление без верхнего и нижнего колонтитула.

Как вернуть частичное представление в ответ на fetch() запрос?

Я мог бы добавить X-Requested-With заголовок запроса на выборку, но, похоже, есть люди, которые оспаривают это утверждение, которое является нестандартным заголовком и нарушает кэширование в некоторых веб-прокси, что может вызвать дополнительный запрос перед полетом 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()
        })
    };
}