{"id":356199,"date":"2024-05-20T23:24:38","date_gmt":"2024-05-20T23:24:38","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=356199"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=356199","title":{"rendered":"<span>\u041f\u0435\u0440\u0435\u0434\u0430\u0447\u0430 \u0438 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 IAsyncEnumerable \u0432 Typescript \u0441 ASP.NET Core Web<\/span>"},"content":{"rendered":"<div><!--[--><!--]--><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/0d5\/11d\/059\/0d511d0590fef779d2c3b65b1fd5bff9.jpg\" alt=\"\u041e\u0431\u043c\u0435\u043d \u043c\u0435\u0436\u0434\u0443 ASP.NET Core \u0438 Typescript \u043d\u0430 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0435\" title=\"\u041e\u0431\u043c\u0435\u043d \u043c\u0435\u0436\u0434\u0443 ASP.NET Core \u0438 Typescript \u043d\u0430 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0435\" width=\"1560\" height=\"880\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/0d5\/11d\/059\/0d511d0590fef779d2c3b65b1fd5bff9.jpg\" data-blurred=\"true\"\/><\/p>\n<div><figcaption>\u041e\u0431\u043c\u0435\u043d \u043c\u0435\u0436\u0434\u0443 ASP.NET Core \u0438 Typescript \u043d\u0430 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0435<\/figcaption><\/div>\n<\/figure>\n<p>\u0412\u0441\u0435\u043c \u043f\u0440\u0438\u0432\u0435\u0442, \u041c\u0435\u043d\u044f \u0437\u043e\u0432\u0443\u0442 \u041e\u043b\u0435\u0433 \u0438 \u044f .NET \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0432 \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u0438 Bimeister. \u042f \u0445\u043e\u0442\u0435\u043b \u043f\u043e\u0434\u0435\u043b\u0438\u0442\u044c\u0441\u044f \u0441 \u0432\u0430\u043c\u0438 \u0441\u0432\u043e\u0438\u043c \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u043c \u043e\u043f\u044b\u0442\u043e\u043c \u043f\u043e \u0441\u0432\u044f\u0437\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u043d\u0430 ASP.NET Core Web App \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c <strong>IAsyncEnumerable<\/strong> \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u0439 \u0438 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434 SPA \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0430 Typescript \u0438 Vue.js 3 \u0432\u0435\u0440\u0441\u0438\u0438.<\/p>\n<p>\u0412 \u0434\u0430\u043d\u043d\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u043d\u043e \u043f\u043e\u0448\u0430\u0433\u043e\u0432\u043e\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u043a\u0430\u043a \u0434\u043b\u044f .NET, \u0442\u0430\u043a \u0438 \u0434\u043b\u044f \u0435\u0433\u043e \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u043e\u0439 \u0447\u0430\u0441\u0442\u0438, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u0438\u0445 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f. \u042f \u0445\u043e\u0442\u0435\u043b \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u043d\u0430 \u043d\u0435\u0441\u043b\u043e\u0436\u043d\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 (\u0434\u0430\u0436\u0435 \u0434\u043b\u044f \u043d\u043e\u0432\u0438\u0447\u043a\u043e\u0432 \u0432 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435 \u043f\u043e \u044d\u0442\u0438\u043c \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u044f\u043c) \u043a\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u043e\u0431\u043c\u0435\u043d \u0434\u0430\u043d\u043d\u044b\u043c\u0438 \u043c\u0435\u0436\u0434\u0443 \u043d\u0438\u043c\u0438. \u0422\u0435\u043c \u043d\u0435 \u043c\u0435\u043d\u0435\u0435, \u0434\u0430\u0436\u0435 \u0438\u0441\u043a\u0443\u0448\u0435\u043d\u043d\u044b\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430\u043c \u0441\u0442\u0430\u0442\u044c\u044f \u043c\u043e\u0436\u0435\u0442 \u043e\u043a\u0430\u0437\u0430\u0442\u044c\u0441\u044f \u043f\u043e\u043b\u0435\u0437\u043d\u043e\u0439, \u0435\u0441\u043b\u0438 \u0432\u044b \u0445\u043e\u0442\u0438\u0442\u0435 \u043f\u043e\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u0442\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u0442\u043e\u043a\u043e\u0432\u043e\u0435 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0445 \u0432 Typescript \u0438\u043b\u0438 \u0443\u0436\u0435 \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0438\u0441\u044c \u0441\u043e \u0441\u0442\u0440\u0430\u043d\u043d\u044b\u043c\u0438 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044f\u043c\u0438.<\/p>\n<p>\u0412\u0441\u0435 \u044d\u0442\u0438 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0438 \u043d\u0435 \u043d\u043e\u0432\u044b \u0438, \u043d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435, \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u0438 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434 \u0447\u0430\u0441\u0442\u044c \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u043b\u044e\u0431\u044b\u0435 \u043d\u0430 \u0432\u0430\u0448 \u0432\u043a\u0443\u0441: Angular, \u0438\u043b\u0438 React, \u0438\u043b\u0438 \u0447\u0442\u043e-\u043b\u0438\u0431\u043e \u0435\u0449\u0435. \u0412\u0435\u0441\u044c \u0438\u043d\u0442\u0435\u0440\u0435\u0441 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0431\u043e\u0439 \u0438\u043c\u0435\u043d\u043d\u043e \u0443\u043d\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0430 \u043e\u0431\u043c\u0435\u043d\u0430 \u0441 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u043e\u0439 \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u0435\u0439 \u0441 \u0431\u044d\u043a\u0435\u043d\u0434\u0430 \u043d\u0430 C#. \u042f \u043d\u0435 \u0431\u0443\u0434\u0443 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e \u0437\u0430\u043e\u0441\u0442\u0440\u044f\u0442\u044c \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043d\u0430 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0435 \u043e\u0431\u0435\u0438\u0445 \u043f\u043e\u043b\u043e\u0432\u0438\u043d \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0441\u043a\u0430\u0436\u0443 \u043b\u0438\u0448\u044c, \u0447\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b \u043e\u0434\u0438\u043d \u0438\u0437 \u0441\u043b\u043e\u0436\u0438\u0432\u0448\u0438\u0445\u0441\u044f \u0432 \u043c\u043e\u0435\u0439 \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0438 \u0448\u0430\u0431\u043b\u043e\u043d\u043e\u0432 \u0434\u043b\u044f \u0437\u0430\u043f\u0443\u0441\u043a\u0430 ASP.NET Core Web \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0441 SPA. \u0412\u0441\u0435 \u0434\u0435\u0442\u0430\u043b\u0438 \u043c\u043e\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u043c \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0438.<\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u043d\u0430\u0447\u043d\u0435\u043c \u0441 \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f \u2014 \u0437\u0430\u0447\u0435\u043c \u0432\u043e\u043e\u0431\u0449\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u044d\u0442\u043e\u0442 <strong>IAsyncEnumerable<\/strong> \u0438 \u0447\u0442\u043e \u0441 \u043d\u0438\u043c \u043c\u043e\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c? \u042d\u0442\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0431\u0440\u0430\u0449\u0430\u0442\u044c\u0441\u044f \u043a \u0434\u0430\u043d\u043d\u044b\u043c \u043a\u0430\u043a \u043a \u043f\u043e\u0442\u043e\u043a\u0443, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044f \u043f\u043e\u043b\u0443\u0447\u0430\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0442\u044c \u0438\u0445 \u0434\u043b\u044f \u0434\u0430\u043b\u044c\u043d\u0435\u0439\u0448\u0435\u0439 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u043f\u043e \u043c\u0435\u0440\u0435 \u0433\u043e\u0442\u043e\u0432\u043d\u043e\u0441\u0442\u0438 \u0432 \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435. \u041e\u043d \u0447\u0430\u0441\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u043f\u0440\u0438 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u0438 <strong>async foreach<\/strong> \u0438 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043e\u0431\u043e \u0432\u0441\u0435\u043c \u044d\u0442\u043e\u043c \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u0439\u0442\u0438 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043e\u0442\u043b\u0438\u0447\u043d\u044b\u0445 \u0441\u0442\u0430\u0442\u0435\u0439, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043d\u0430 <a href=\"https:\/\/habr.com\/ru\/companies\/otus\/articles\/514594\/\">\u0425\u0430\u0431\u0440\u0435<\/a>. \u042f \u043b\u0438\u0448\u044c \u0437\u0430\u043e\u0441\u0442\u0440\u044e \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043d\u0430 \u0442\u043e\u043c, \u0447\u0442\u043e \u0433\u043b\u0430\u0432\u043d\u044b\u0439 \u0438\u043d\u0442\u0435\u0440\u0435\u0441 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0431\u043e\u0439 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043d\u0435 \u0436\u0434\u0430\u0442\u044c \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u0446\u0435\u043b\u043e\u0439 \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u0438 \u0441\u0440\u0430\u0437\u0443, \u0430 \u0447\u0442\u043e-\u0442\u043e \u0434\u0435\u043b\u0430\u0442\u044c \u0441 \u043a\u0430\u0436\u0434\u044b\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c \u0438\u043b\u0438 \u0433\u0440\u0443\u043f\u043f\u043e\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043f\u043e \u043c\u0435\u0440\u0435 \u0438\u0445 \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u044f.\u00a0  <\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043f\u0440\u0438\u043c\u0438\u0442\u0438\u0432\u043d\u043e\u0435 \u0432\u0435\u0431-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441 \u0438\u043c\u0438\u0442\u0430\u0446\u0438\u0435\u0439 \u0441\u0447\u0438\u0442\u044b\u0432\u0430\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445 \u0438\u0437 \u0411\u0414 \u0432 \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435. \u042f \u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e \u0437\u0430 \u043f\u0440\u0435\u0434\u0435\u043b\u0430\u043c\u0438 \u0434\u0430\u043d\u043d\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0438 \u0440\u0430\u0437\u043c\u044b\u0448\u043b\u0435\u043d\u0438\u044f, \u043f\u043e\u0447\u0435\u043c\u0443 \u0441\u0442\u043e\u0438\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0431\u0430\u0437\u043e\u0432\u0443\u044e \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u043e\u0441\u0442\u044c \u0438\u043b\u0438 DI \u0432 \u0441\u0432\u043e\u0438\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445, \u0437\u0434\u0435\u0441\u044c \u043e\u043d\u0438 \u0431\u0443\u0434\u0443\u0442 \u0441\u043a\u043e\u0440\u0435\u0435 \u0432\u0441\u0451 \u0436\u0435 \u0438\u0437\u043b\u0438\u0448\u043d\u0438\u043c\u0438, \u043d\u043e \u0437\u0430\u0442\u043e \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u043c\u0438 \u043d\u0435\u043a\u0438\u043c \u043d\u044b\u043d\u0435\u0448\u043d\u0438\u043c \u043a\u043e\u0440\u043f\u043e\u0440\u0430\u0442\u0438\u0432\u043d\u044b\u043c \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u0430\u043c \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043e\u0434\u0430 \u043d\u0430 .NET. \u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u0431\u0430\u0437\u043e\u0432\u043e\u0435 Core Web App \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0447\u0435\u0440\u0435\u0437 Visual Studio 2022. \u042f \u0431\u0443\u0434\u0443 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c .NET 7, \u043d\u043e \u043f\u043e\u0434\u043e\u0439\u0434\u0435\u0442 \u043b\u044e\u0431\u043e\u0439 \u0438\u0437 \u043d\u0438\u0445 \u0441 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u043e\u0439 \u044d\u0442\u0438\u0445 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u0439. \u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0448\u0430\u0431\u043b\u043e\u043d\u0430 \u0432\u044b\u0431\u0440\u0430\u043d ASP.NET Core Web API \u0434\u043b\u044f \u043f\u0440\u043e\u0441\u0442\u043e\u0442\u044b \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u0441\u0432\u044f\u0437\u043a\u0438 \u0441 \u0431\u0443\u0434\u0443\u0449\u0438\u043c \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u043e\u043c.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/06b\/dce\/377\/06bdce377b4d52d10a031812120a6c22.PNG\" alt=\"\u0428\u0430\u0431\u043b\u043e\u043d \u043f\u0440\u043e\u0435\u043a\u0442\u0430\" title=\"\u0428\u0430\u0431\u043b\u043e\u043d \u043f\u0440\u043e\u0435\u043a\u0442\u0430\" width=\"866\" height=\"599\"\/><\/p>\n<div><figcaption>\u0428\u0430\u0431\u043b\u043e\u043d \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/figcaption><\/div>\n<\/figure>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/59f\/cf3\/4d5\/59fcf34d52a37f789122b8b9c2923025.PNG\" alt=\"\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\" title=\"\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\" width=\"704\" height=\"455\"\/><\/p>\n<div><figcaption>\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/figcaption><\/div>\n<\/figure>\n<p>\u0414\u043b\u044f \u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430 \u0440\u0430\u0431\u043e\u0442\u044b \u043d\u0435 \u0431\u0443\u0434\u0435\u043c \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u044b \u043f\u043e\u0434 \u0441\u043b\u043e\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f (\u0447\u0442\u043e \u043a\u043e\u043d\u0435\u0447\u043d\u043e \u0436\u0435 \u043e\u0447\u0435\u043d\u044c \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u0442\u0441\u044f \u0432 \u0432\u0430\u0448\u0438\u0445 \u0441\u0435\u0440\u044c\u0435\u0437\u043d\u044b\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u0445). \u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043f\u0430\u043f\u043a\u0438 ClientApp (\u0434\u043b\u044f \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430, \u0432\u0435\u0440\u043d\u0435\u043c\u0441\u044f \u043a \u043d\u0435\u0439 \u043d\u0438\u0436\u0435 \u0432 \u0441\u0442\u0430\u0442\u044c\u0435), Models \u0438 Repository, \u0438\u0437\u0431\u0430\u0432\u0438\u043c\u0441\u044f \u043e\u0442 WeatherForecast \u043a\u043b\u0430\u0441\u0441\u043e\u0432. \u0412 \u043f\u0430\u043f\u043a\u0443 Models \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u043a\u043b\u0430\u0441\u0441 \u043d\u0435\u043a\u043e\u0433\u043e \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430 \u0441 \u0440\u0430\u0437\u043d\u043e\u043e\u0431\u0440\u0430\u0437\u043d\u044b\u043c\u0438 \u043f\u043e\u043b\u044f\u043c\u0438 (\u0447\u0442\u043e\u0431\u044b \u043f\u043e\u0442\u043e\u043c \u0431\u044b\u043b\u043e \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u0435\u0435 \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u0438\u0445 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0443 \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0430). \u041d\u0430\u0431\u043e\u0440 \u043f\u043e\u043b\u0435\u0439 \u043d\u0435 \u0438\u043c\u0435\u0435\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u044f \u043b\u0438\u0448\u044c \u043f\u043e\u0441\u0442\u0430\u0440\u0430\u043b\u0441\u044f \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0438\u0445 \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0449\u0438\u043c\u0438\u0441\u044f. <\/p>\n<pre><code class=\"cs\">public class Product {     public Guid Id { get; set; }      public string Code { get; set; }      public string Name { get; set; }      public int SortOrder { get; set; }      public bool Enabled { get; set; }      public DateTime ActivationDate { get; set; }   }<\/code><\/pre>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0432 \u043f\u0430\u043f\u043a\u0435 \u0434\u043b\u044f \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f \u043e\u0431\u044a\u044f\u0432\u0438\u043c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 IProductRepository, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0443\u0434\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c 2 \u043c\u0435\u0442\u043e\u0434\u0430. \u041f\u0435\u0440\u0432\u044b\u0439 \u2014 \u0434\u043b\u044f \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u043e\u0442\u0434\u0430\u0447\u0438 \u0432\u0441\u0435\u0439 \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u0438, \u0432\u0442\u043e\u0440\u043e\u0439 \u2014 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c <strong>IAsyncEnumerable<\/strong>. \u0415\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u043e\u0431\u0430 \u043e\u043d\u0438 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d\u044b \u0441 \u0443\u0447\u0435\u0442\u043e\u043c async\/await \u043f\u043e\u0434\u0445\u043e\u0434\u0430 \u0441 \u0442\u043e\u043a\u0435\u043d\u0430\u043c\u0438 \u043e\u0442\u043c\u0435\u043d\u044b \u0438 Task, \u0447\u0442\u043e\u0431\u044b \u0431\u044b\u043b\u043e \u043d\u0430\u0433\u043b\u044f\u0434\u043d\u0435\u0435 \u0438 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u0435\u0435. \u041a\u0430\u0436\u0434\u044b\u0439 \u043c\u0435\u0442\u043e\u0434 \u0442\u0430\u043a\u0436\u0435 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 onlyEnabled, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0434\u043e\u043b\u0436\u0435\u043d \u0437\u0430\u0434\u0430\u0432\u0430\u0442\u044c \u0444\u0438\u043b\u044c\u0442\u0440\u0430\u0446\u0438\u044e \u2014 \u043b\u0438\u0431\u043e \u0432\u0441\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b, \u043b\u0438\u0431\u043e \u0441 Enabled == true.<\/p>\n<pre><code class=\"cs\">public interface IProductRepository {     Task&lt;IReadOnlyCollection&lt;Product>> GetClassicListAsync(bool onlyEnabled, CancellationToken ct = default);     IAsyncEnumerable&lt;Product> GetEnumerableListAsync(bool onlyEnabled, CancellationToken ct = default); }<\/code><\/pre>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e \u044d\u0442\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 ProductRepository, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u043e\u0441\u0442\u043e \u0441 \u0437\u0430\u0434\u0435\u0440\u0436\u043a\u043e\u0439 (\u0441\u043f\u0430\u0441\u0438\u0431\u043e \u043a\u043e\u043c\u0430\u043d\u0434\u0435 await Task.Delay \u0434\u043b\u044f \u0441\u0438\u043c\u0443\u043b\u044f\u0446\u0438\u0438 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u0411\u0414) \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u0443\u044e \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u044e \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432. \u0414\u043b\u044f \u0433\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u043d\u0430\u043f\u0438\u0441\u0430\u043d \u043f\u0440\u0438\u043c\u0438\u0442\u0438\u0432\u043d\u044b\u0439 \u043c\u0435\u0442\u043e\u0434 GenerateProducts, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u043e\u0441\u0442\u043e \u0437\u0430\u043f\u043e\u043b\u043d\u044f\u0435\u0442 \u0432\u0441\u0435 \u043f\u043e\u043b\u044f \u043a\u0430\u043a\u0438\u043c\u0438-\u0442\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438, \u043f\u0440\u0438\u0447\u0435\u043c \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u043b\u043e\u0432\u0438\u043d\u0430 \u0431\u0443\u0434\u0435\u0442 \u0441 Enabled == true. \u041e\u043d \u043d\u0435 \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u044b\u0439, \u0442\u0430\u043a \u0447\u0442\u043e \u0438 \u0434\u043b\u044f GetEnumerableListAsync \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u043e\u0431\u044b\u0447\u043d\u044b\u0439 foreach \u0441 yield return \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043f\u043e\u0441\u043b\u0435 \u0437\u0430\u0434\u0435\u0440\u0436\u043a\u0438. GetClassicListAsync \u0436\u0435 \u0432\u0435\u0440\u043d\u0435\u0442 \u0432\u0441\u044e \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u044e \u043f\u043e\u0441\u043b\u0435 \u043f\u043e\u0442\u0435\u043d\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0439 \u0444\u0438\u043b\u044c\u0442\u0440\u0430\u0446\u0438\u0438 \u0432 LINQ.<\/p>\n<pre><code class=\"cs\">public class ProductRepository : IProductRepository {     \/\/emulate some datasource     private IReadOnlyCollection&lt;Product> GenerateProducts()     {         var retval = new List&lt;Product>();         for (int i = 0; i &lt; 100; i++)         {             var product = new Product()             {                 Id = Guid.NewGuid(),                 Name = $\"Some name for HABR {i}\",                 Code = $\"{Math.Abs(i.ToString().GetHashCode())}\",                 SortOrder = i,                 ActivationDate = DateTime.Today.AddDays(-1 * i),                 Enabled = i % 2 == 0             };             retval.Add(product);         }         return retval.AsReadOnly();     }      public async Task&lt;IReadOnlyCollection&lt;Product>> GetClassicListAsync(bool onlyEnabled, CancellationToken ct = default)     {         ct.ThrowIfCancellationRequested();         \/\/emulate slow connection         await Task.Delay(2000, ct);         return GenerateProducts()             .Where(p => !onlyEnabled || p.Enabled)             .ToList()             .AsReadOnly();     }      public async IAsyncEnumerable&lt;Product> GetEnumerableListAsync(bool onlyEnabled, CancellationToken ct = default)     {         foreach (var product in GenerateProducts())         {             ct.ThrowIfCancellationRequested();             if (!onlyEnabled || product.Enabled)             {                 \/\/emulate slow connection                 await Task.Delay(1000, ct);                 yield return product;             }         }     } }<\/code><\/pre>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u043c API \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440 ProductController \u0434\u043b\u044f \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445 \u044d\u0442\u0438\u0445 \u043e\u0431\u043e\u0438\u0445 \u043c\u0435\u0442\u043e\u0434\u043e\u0432. \u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u0435\u0433\u043e \u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u0438\u0437 \u0448\u0430\u0431\u043b\u043e\u043d\u0430 API Controller \u2014 Empty. \u0414\u043e\u0431\u0430\u0432\u0438\u043c \u0430\u0442\u0440\u0438\u0431\u0443\u0442 \u0434\u043b\u044f \u0440\u043e\u0443\u0442\u0438\u043d\u0433\u0430 \u0441 \u044f\u0432\u043d\u044b\u043c \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435\u043c \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u043c\u0435\u0442\u043e\u0434\u0430 api\/[controller]\/[action] \u0438 \u0447\u0435\u0440\u0435\u0437 DI \u043f\u043e\u0434\u0442\u044f\u043d\u0435\u043c \u043f\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0443 \u043d\u0430\u0448 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439. \u041d\u0430\u0448\u0435 API \u0431\u0443\u0434\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c 2 \u043c\u0435\u0442\u043e\u0434\u0430, \u0434\u043b\u044f \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u0438 \u0434\u043b\u044f  <strong>IAsyncEnumerable<\/strong> \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e. \u041e\u043f\u0443\u0441\u0442\u0438\u043c \u043b\u043e\u0433\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435, \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u043e\u0448\u0438\u0431\u043e\u043a \u0438 \u043f\u0440\u043e\u0447\u0438\u0435, \u0431\u0435\u0437\u0443\u0441\u043b\u043e\u0432\u043d\u043e \u0432\u0430\u0436\u043d\u044b\u0435, \u0430\u0441\u043f\u0435\u043a\u0442\u044b \u0440\u0430\u0431\u043e\u0442\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041a\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c, \u0432\u043c\u0435\u0441\u0442\u043e \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e Task&lt;ActionResult> \u0437\u0434\u0435\u0441\u044c \u044f\u0432\u043d\u043e \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u044f \u0432 \u043c\u0435\u0442\u043e\u0434\u0435 GetAsyncStream.<\/p>\n<pre><code class=\"cs\">[ApiController] [Route(\"api\/[controller]\/[action]\")] public class ProductController : ControllerBase {     public ProductController(IProductRepository rep)     {         _rep = rep;     }      private readonly IProductRepository _rep;      [HttpGet]     public IAsyncEnumerable&lt;Product> GetAsyncStream(bool onlyEnabled, CancellationToken ct)     {         return _rep.GetEnumerableListAsync(onlyEnabled, ct);     }      [HttpGet]     public async Task&lt;ActionResult&lt;IReadOnlyCollection&lt;Product>>> GetList(bool onlyEnabled, CancellationToken ct)     {         var retval = await _rep.GetClassicListAsync(onlyEnabled, ct);         return Ok(retval);     } }<\/code><\/pre>\n<p>\u0414\u0430\u043b\u044c\u0448\u0435 \u0432 ASP \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u043e\u0441\u0442\u0430\u043b\u043e\u0441\u044c \u0434\u043e\u043b\u0433\u043e \u0438 \u043d\u0443\u0434\u043d\u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0432\u0435\u0449\u0435\u0439, \u0431\u043e\u043b\u044c\u0448\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0438\u0437 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0432 Program.cs \u0438 \u0432 csproj \u0444\u0430\u0439\u043b\u0435 \u0441\u0430\u043c\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u041d\u0435 \u0431\u0443\u0434\u0435\u043c \u043e\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u043d\u0430 \u043a\u0430\u0436\u0434\u043e\u0439 (\u043d\u0430\u0432\u0435\u0440\u043d\u044f\u043a\u0430 \u0435\u0441\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u0438\u0437\u044f\u0449\u043d\u044b\u0435 \u0441\u043f\u043e\u0441\u043e\u0431\u044b), \u043b\u0438\u0448\u044c \u043f\u043e\u0434\u0447\u0435\u0440\u043a\u043d\u0435\u043c \u0441\u0430\u043c\u043e\u0435 \u0432\u0430\u0436\u043d\u043e\u0435. \u041f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0431\u0443\u0434\u0435\u0442 \u0437\u043d\u0430\u0442\u044c \u0447\u0442\u043e \u043e\u043d\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043f\u0440\u0438 \u043e\u0442\u043b\u0430\u0434\u043a\u0435 \u0432 \u0441\u0432\u044f\u0437\u043a\u0435 \u0441 SpaDevelopmentServer, \u0442\u0430\u043a \u0447\u0442\u043e \u0432\u044b\u043d\u0435\u0441\u0435\u043c \u0432 \u0444\u0430\u0439\u043b appsettings.json (\u0432\u0441\u0451 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u043e\u0435 \u0438\u0437 \u043d\u0435\u0433\u043e \u044f \u0443\u0434\u0430\u043b\u0438\u043b) \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0443 VitePortNumber \u0434\u043b\u044f \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 Vite. \u041a \u043d\u0435\u043c\u0443 \u043c\u044b \u0434\u043e\u0431\u0435\u0440\u0435\u043c\u0441\u044f \u0443\u0436\u0435 \u0441\u043a\u043e\u0440\u043e! \u042f \u043f\u043e\u0441\u0442\u0430\u0432\u0438\u043b \u043f\u043e\u0440\u0442 4444, \u0432\u044b \u0432\u043e\u043b\u044c\u043d\u044b \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u043b\u044e\u0431\u043e\u0439 \u0434\u0440\u0443\u0433\u043e\u0439, \u0433\u043b\u0430\u0432\u043d\u043e\u0435 \u0447\u0442\u043e\u0431\u044b \u043e\u043d \u043e\u0442\u043b\u0438\u0447\u0430\u043b\u0441\u044f \u043e\u0442 \u0434\u0435\u0444\u043e\u043b\u0442\u043d\u043e\u0433\u043e \u043f\u043e\u0440\u0442\u0430 \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u0441\u0430\u043c\u043e\u0433\u043e \u043d\u0430\u0448\u0435\u0433\u043e API \u0438\u0437 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. <\/p>\n<pre><code class=\"json\">{   \"VitePortNumber\": 4444 }<\/code><\/pre>\n<p>\u041e\u0431\u043d\u043e\u0432\u0438\u043c \u0444\u0430\u0439\u043b Program.cs \u0447\u0442\u043e\u0431\u044b \u043e\u043d \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u043b \u0432\u0441\u0435 \u0431\u0430\u0437\u043e\u0432\u044b\u0435 \u0432\u0435\u0449\u0438 \u0432\u0440\u043e\u0434\u0435 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u0438, \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u043e\u0432 \u0438 \u043f\u0440\u043e\u0447\u0435\u0433\u043e. \u0421\u043d\u0430\u0447\u0430\u043b\u0430 \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u043f\u0430\u043a\u0435\u0442\u044b \u0447\u0435\u0440\u0435\u0437 Nuget<\/p>\n<ul>\n<li>\n<p>Microsoft.AspNetCore.Authorization<\/p>\n<\/li>\n<li>\n<p>Microsoft.AspNetCore.SpaServices.Extensions<\/p>\n<\/li>\n<li>\n<p>Microsoft.Extensions.Configuration<\/p>\n<\/li>\n<li>\n<p>Microsoft.Extensions.DependencyInjection<\/p>\n<\/li>\n<\/ul>\n<p>\u0417\u0430\u0442\u0435\u043c \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u0432\u0441\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u043a\u043e\u043c\u0430\u043d\u0434\u044b \u0434\u043b\u044f middleware \u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0442\u043e\u0433\u043e, \u0443 \u043d\u0430\u0441 Development (\u0442\u043e\u0433\u0434\u0430 \u0440\u044f\u0434\u043e\u043c \u0437\u0430\u043f\u0443\u0449\u0435\u043d Vite) \u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u0430\u044f \u0441\u0440\u0435\u0434\u0430.<\/p>\n<pre><code class=\"cs\">public static void Main(string[] args) {     var builder = WebApplication.CreateBuilder(args);     string environmentName = Environment.GetEnvironmentVariable(\"ASPNETCORE_ENVIRONMENT\") ?? \"Development\";     var configuration = new ConfigurationBuilder()         .AddJsonFile($\"appsettings.json\")         .AddEnvironmentVariables()         .Build();          var port = configuration.GetValue&lt;int>(\"VitePortNumber\", 4444);         builder.Services.AddAuthentication(IISDefaults.AuthenticationScheme);         builder.Services.AddAuthorization();         builder.Services.AddCors(options =>         {             options.AddDefaultPolicy(builder =>                 builder.SetIsOriginAllowed(_ => true)                     .WithOrigins($\"http:\/\/localhost:{port}\")                     .AllowAnyMethod()                     .AllowAnyHeader()                     .AllowCredentials());         });         \/\/ Add services to the container.         builder.Services.AddControllers()             .AddJsonOptions(options => options.JsonSerializerOptions.PropertyNameCaseInsensitive = true);         builder.Services.AddEndpointsApiExplorer();         builder.Services.AddHttpContextAccessor();         \/\/DI         builder.Services.AddScoped&lt;IProductRepository, ProductRepository>();         if (builder.Environment.IsStaging() || builder.Environment.IsProduction())         {             builder.Services.AddSpaStaticFiles(configuration =>             {                 configuration.RootPath = \"ClientApp\/dist\";             });         }         \/\/         var app = builder.Build();         app.UseStaticFiles();         if (builder.Environment.IsStaging() || builder.Environment.IsProduction())         {             app.UseSpaStaticFiles();         }         else         {             app.UseCors();         }         app.UseRouting();         app.UseAuthentication();         app.UseAuthorization();         app.UseEndpoints(endpoints => endpoints.MapControllers());         app.UseSpa(spa =>         {             if (app.Environment.IsDevelopment())             {                 spa.UseProxyToSpaDevelopmentServer($\"http:\/\/localhost:{port}\");             }         });         app.Run(); }<\/code><\/pre>\n<p>\u0422\u0430\u043a\u0436\u0435 \u043e\u0431\u043d\u043e\u0432\u0438\u0442\u0435 \u0444\u0430\u0439\u043b \u043f\u0440\u043e\u0435\u043a\u0442\u0430, \u0447\u0442\u043e\u0431\u044b \u043e\u043d \u0437\u043d\u0430\u043b \u043f\u0440\u043e SPA \u0440\u0435\u0436\u0438\u043c \u0434\u043b\u044f \u043d\u0430\u0433\u043b\u044f\u0434\u043d\u043e\u0441\u0442\u0438. \u0416\u0451\u0441\u0442\u043a\u0438\u0445 \u043f\u0440\u0430\u0432\u0438\u043b \u043d\u0435\u0442, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0442\u043e\u0442 \u0448\u0430\u0431\u043b\u043e\u043d, \u0447\u0442\u043e \u0443\u0434\u043e\u0431\u0435\u043d \u0438 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0443 \u0432\u0430\u0441. \u041f\u043e\u043b\u043d\u044b\u0439 \u0442\u0435\u043a\u0441\u0442:<\/p>\n<pre><code class=\"xml\">&lt;Project Sdk=\"Microsoft.NET.Sdk.Web\">    &lt;PropertyGroup>     &lt;TargetFramework>net7.0&lt;\/TargetFramework>     &lt;Nullable>enable&lt;\/Nullable>   &lt;TypeScriptCompileBlocked>true&lt;\/TypeScriptCompileBlocked>   &lt;TypeScriptToolsVersion>Latest&lt;\/TypeScriptToolsVersion>   &lt;IsPackable>false&lt;\/IsPackable>   &lt;SpaRoot>ClientApp\\&lt;\/SpaRoot>   &lt;DefaultItemExcludes>$(DefaultItemExcludes);$(SpaRoot)node_modules\\**&lt;\/DefaultItemExcludes>   &lt;ImplicitUsings>enable&lt;\/ImplicitUsings>   &lt;\/PropertyGroup>  &lt;ItemGroup> &lt;!-- Don't publish the SPA source files, but do show them in the project files list --> &lt;Compile Remove=\"logs\\**\" \/> &lt;Content Remove=\"$(SpaRoot)**\" \/> &lt;Content Remove=\"logs\\**\" \/> &lt;EmbeddedResource Remove=\"logs\\**\" \/> &lt;None Remove=\"$(SpaRoot)**\" \/> &lt;None Remove=\"logs\\**\" \/> &lt;None Include=\"$(SpaRoot)**\" Exclude=\"$(SpaRoot)node_modules\\**\" \/> &lt;\/ItemGroup>  &lt;ItemGroup> &lt;Folder Include=\"ClientApp\\\" \/> &lt;\/ItemGroup>  &lt;ItemGroup> &lt;PackageReference Include=\"Microsoft.AspNetCore.Authorization\" Version=\"7.0.10\" \/> &lt;PackageReference Include=\"Microsoft.AspNetCore.SpaServices.Extensions\" Version=\"7.0.10\" \/> &lt;PackageReference Include=\"Microsoft.Extensions.Configuration\" Version=\"7.0.0\" \/> &lt;\/ItemGroup>  &lt;\/Project><\/code><\/pre>\n<p>\u0418 \u0432 \u0437\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0438 \u043e\u0431\u043d\u043e\u0432\u0438\u043c launchSettings.json, \u0447\u0442\u043e\u0431\u044b \u0432 IIS Express \u0432\u0435\u0440\u043d\u043e \u043f\u043e\u0434\u043d\u0438\u043c\u0430\u043b\u043e\u0441\u044c \u043d\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u043f\u043e\u043c\u043d\u0438\u0442\u0435 \u0447\u0442\u043e \u043f\u043e\u0440\u0442\u044b \u0443 \u0432\u0430\u0441 \u0431\u0443\u0434\u0443\u0442 \u0441\u0432\u043e\u0438.<\/p>\n<pre><code class=\"json\">{   \"$schema\": \"https:\/\/json.schemastore.org\/launchsettings.json\",   \"iisSettings\": {     \"windowsAuthentication\": true,     \"anonymousAuthentication\": false,     \"iisExpress\": {       \"applicationUrl\": \"http:\/\/localhost:24443\",       \"sslPort\": 0     }   },   \"profiles\": {     \"IIS Express\": {       \"commandName\": \"IISExpress\",       \"launchBrowser\": true,       \"environmentVariables\": {         \"ASPNETCORE_ENVIRONMENT\": \"Development\"       }     }   } }<\/code><\/pre>\n<p>\u041f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c, \u0447\u0442\u043e \u0432\u0441\u0451 \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442\u0441\u044f, \u0438 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u043c \u043a\u043e\u043b\u0434\u043e\u0432\u0430\u0442\u044c \u043d\u0430\u0434 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u043e\u0432\u043e\u0439 \u0447\u0430\u0441\u0442\u044c\u044e! \u0423\u0431\u0435\u0434\u0438\u0442\u0435\u0441\u044c, \u0447\u0442\u043e \u0443 \u0432\u0430\u0441 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d Node.js. \u0414\u043b\u044f \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b \u0447\u0443\u0442\u044c \u0443\u0441\u0442\u0430\u0440\u0435\u0432\u0448\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e v16.20.2 (64-bit). \u041e\u0442\u0434\u0435\u043b\u044c\u043d\u043e \u0433\u043e\u0442\u043e\u0432 \u043f\u043e\u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u043e\u0432\u0430\u0442\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0443\u0442\u0438\u043b\u0438\u0442\u0443 NVM \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u0432\u0435\u0440\u0441\u0438\u0439 \u043d\u043e\u0434\u044b \u0434\u043b\u044f \u0440\u0430\u0437\u043d\u044b\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u0432! \u041f\u043e\u0441\u043b\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0432\u0441\u0435\u0445 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0445 (\u0438\u043b\u0438 \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0440\u0438\u0432\u044b\u0447\u043d\u044b\u0445 \u043c\u043d\u0435) \u0444\u0430\u0439\u043b\u043e\u0432 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0439 \u0432 \u043f\u0430\u043f\u043a\u0435 ClientApp \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0432\u043e\u0442 \u0442\u0430\u043a\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430:<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2ab\/2f3\/746\/2ab2f3746ed644bd0f0c624fbc494fac.PNG\" alt=\"\u0414\u0435\u0440\u0435\u0432\u043e \u0444\u0430\u0439\u043b\u043e\u0432 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430\" title=\"\u0414\u0435\u0440\u0435\u0432\u043e \u0444\u0430\u0439\u043b\u043e\u0432 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430\" width=\"215\" height=\"346\"\/><\/p>\n<div><figcaption>\u0414\u0435\u0440\u0435\u0432\u043e \u0444\u0430\u0439\u043b\u043e\u0432 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430<\/figcaption><\/div>\n<\/figure>\n<p>\u0420\u0430\u0437\u0431\u043e\u0440 \u0442\u0438\u043f\u0438\u0447\u043d\u043e\u0433\u043e SPA \u043d\u0430 Vue.Js \u043e\u0441\u0442\u0430\u043d\u0435\u0442\u0441\u044f \u0437\u0430 \u0440\u0430\u043c\u043a\u0430\u043c\u0438 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0438, \u044f \u043b\u0438\u0448\u044c \u043f\u0440\u0438\u0432\u0435\u0434\u0443 package.json \u0441 \u043e\u0431\u0449\u0435\u0439 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0435\u0439 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0438 \u0432\u0441\u0435\u043c\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u043c\u0438 \u043d\u0430\u043c \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u044f\u043c\u0438. <\/p>\n<pre><code class=\"json\">{    \"name\": \"clientapp\",    \"private\": true,    \"version\": \"0.0.0\",    \"type\": \"module\",    \"scripts\": {       \"dev\": \"vite --mode dev\",       \"build\": \"vue-tsc &amp;&amp; vite build --mode dev\",       \"build:qa\": \"vue-tsc &amp;&amp; vite build --mode qa\",       \"build:prd\": \"vue-tsc &amp;&amp; vite build --mode prd\",       \"preview\": \"vite preview\",       \"lint\": \"eslint --ext .ts,vue --ignore-path .gitignore .\",       \"format\": \"prettier .  --write\"    },    \"dependencies\": {       \"@rollup\/plugin-inject\": \"^5.0.3\",       \"axios\": \"^1.3.4\",       \"eslint-config-prettier\": \"^8.7.0\",       \"eslint-plugin-import\": \"^2.27.5\",       \"lodash\": \"^4.17.21\",       \"path\": \"^0.12.7\",       \"pinia\": \"^2.0.33\",       \"prettier\": \"^2.8.4\",       \"ts-simple-nameof\": \"^1.3.1\",       \"vue\": \"^3.2.45\",       \"vue-router\": \"^4.1.6\"    },    \"devDependencies\": {       \"@types\/lodash\": \"^4.14.191\",       \"@types\/node\": \"^18.14.6\",       \"@typescript-eslint\/eslint-plugin\": \"^5.54.1\",       \"@typescript-eslint\/parser\": \"^5.54.1\",       \"@vitejs\/plugin-vue\": \"^4.0.0\",       \"@vue\/eslint-config-typescript\": \"^11.0.2\",       \"eslint\": \"^8.35.0\",       \"eslint-plugin-vue\": \"^9.9.0\",       \"sass\": \"^1.58.3\",       \"typescript\": \"^5.0.4\",       \"vite\": \"^4.1.0\",       \"vite-plugin-eslint\": \"^1.8.1\",       \"vue-tsc\": \"^1.0.24\"    } } <\/code><\/pre>\n<p>\u0412\u0441\u0435 \u0432\u043e\u043f\u0440\u043e\u0441\u044b \u043b\u0438\u043d\u0442\u0435\u0440\u0430, \u043f\u0440\u0435\u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0440\u0430 CSS \u0438\u043b\u0438 prettier \u043e\u0441\u0442\u0430\u0432\u0438\u043c \u0437\u0430 \u0441\u043a\u043e\u0431\u043a\u0430\u043c\u0438. \u0412 env \u0444\u0430\u0439\u043b\u044b \u043a\u043b\u0430\u0434\u0435\u043c 2 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435: VITE_NODE_ENV \u0441 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435\u043c \u0442\u0435\u043a\u0443\u0449\u0435\u0439 \u0441\u0440\u0435\u0434\u044b \u0438 VITE_VUE_APP_BASE_URL \u0441 \u043f\u0443\u0442\u0435\u043c \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043a\u043e\u0440\u043d\u0435\u0432\u043e\u0433\u043e \u0434\u043e\u043c\u0435\u043d\u0430 (\u0438\u043d\u043e\u0433\u0434\u0430 \u0445\u043e\u0447\u0435\u0442\u0441\u044f, \u0447\u0442\u043e\u0431\u044b http:\/\/mysite.com\/subdomain\/ \u0431\u044b\u043b \u043a\u043e\u0440\u043d\u0435\u0432\u044b\u043c \u0434\u043b\u044f \u0440\u043e\u0443\u0442\u0438\u043d\u0433\u0430 \u0438 \u043f\u0440\u043e\u0447\u0438\u0445 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432, \u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0431\u0443\u0434\u0435\u0442 \u0441\u0447\u0438\u0442\u0430\u0442\u044c \u0442\u0430\u043a\u043e\u0432\u044b\u043c \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043e\u043c\u0435\u043d \u0432\u0435\u0440\u0445\u043d\u0435\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u044f). \u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0442\u0443\u0442 \u043f\u0440\u043e\u0441\u0442\u043e \/, \u0442\u0430\u043a \u043a\u0430\u043a \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0432\u0441\u0451 \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0442\u044c \u0432 \u043e\u0442\u043b\u0430\u0434\u043a\u0435 \u043f\u043e\u0434 localhost:4444. \u041d\u0430 \u043f\u0440\u043e\u0434\u0435 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043d\u0435 \u0442\u0430\u043a. \u0422\u0430\u043a\u0436\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u0444\u0430\u0439\u043b vite.config.ts, \u0433\u0434\u0435 \u0443\u043a\u0430\u0436\u0435\u043c \u0442\u043e\u0442 \u0436\u0435 \u0441\u0430\u043c\u044b\u0439 \u043f\u043e\u0440\u0442 4444, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u044b\u043b \u0437\u0430\u0434\u0430\u043d \u0432 ASP.NET \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438. \u041e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u043c\u0430\u043d\u0438\u043f\u0443\u043b\u044f\u0446\u0438\u0438 \u0441\u0434\u0435\u043b\u0430\u043d\u044b \u0440\u0430\u0434\u0438 \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u0432\u0441\u0435\u0445 \u043f\u043b\u0430\u0433\u0438\u043d\u043e\u0432 \u0438 \u043e\u043f\u0446\u0438\u0439 \u0438 \u0442\u043e\u0436\u0435 \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u044b \u0441 \u0436\u0438\u0432\u044b\u0445 \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0449\u0438\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439.<\/p>\n<pre><code class=\"typescript\">import { defineConfig, loadEnv } from 'vite'; import vue from '@vitejs\/plugin-vue'; import eslintPlugin from 'vite-plugin-eslint'; import * as path from 'path';  export default ({ mode }) => {    process.env = { ...process.env, ...loadEnv(mode, process.cwd()) };    const basePath = process.env.VITE_VUE_APP_BASE_URL;    return defineConfig({       base: basePath, \/\/for paths in dist files       plugins: [vue(), eslintPlugin()],       server: {          port: 4444, \/\/check port in ASP Core appsettings for debug          strictPort: true,       },       resolve: {          alias: [{ find: '@', replacement: path.resolve(__dirname, 'src') }],       },       optimizeDeps: {          force: true,       },    }); }; <\/code><\/pre>\n<p>\u0427\u0442\u043e \u0436, \u043c\u044b \u0433\u043e\u0442\u043e\u0432\u044b \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c npm install \u0432 \u043f\u0430\u043f\u043a\u0435 ClientApp \u0438 \u043d\u0430\u043a\u043e\u043d\u0435\u0446 \u043f\u0440\u0438\u0431\u043b\u0438\u0437\u0438\u0442\u044c\u0441\u044f \u043a \u0446\u0435\u043b\u0438 \u0441\u0442\u0430\u0442\u044c\u0438. \u041f\u043e\u0441\u043b\u0435 \u044d\u0442\u043e\u0433\u043e \u043f\u043e\u0434\u0433\u043e\u0442\u043e\u0432\u0438\u043c \u043f\u0430\u043f\u043a\u0443 src. \u0412 \u043f\u043e\u0434\u043f\u0430\u043f\u043a\u0435 Models \u043e\u043f\u0438\u0448\u0435\u043c \u043e\u0447\u0435\u043d\u044c \u0437\u043d\u0430\u043a\u043e\u043c\u044b\u0439 \u043d\u0430\u043c Product.ts \u043f\u043e \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0438 \u0441 \u043c\u043e\u0434\u0435\u043b\u044c\u044e \u0438\u0437 .NET<\/p>\n<pre><code class=\"typescript\">export class Product {    id: string;    code: string;    name: string;    sortOrder: number;    enabled: boolean;    activationDate: Date; }<\/code><\/pre>\n<p>\u0422\u0430\u043a\u0436\u0435 \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043f\u043e\u043a\u0430 \u043f\u0443\u0441\u0442\u043e\u0439 \u0444\u0430\u0439\u043b App.vue \u0438 \u0442\u043e\u0447\u043a\u0443 \u0432\u0445\u043e\u0434\u0430 &#8212; main.ts<\/p>\n<pre><code class=\"typescript\">import { createApp } from 'vue'; import App from '@\/App.vue';  const app = createApp(App); app.mount('#app');<\/code><\/pre>\n<p>\u0418 \u043d\u0435 \u0437\u0430\u0431\u0443\u0434\u0435\u043c \u0443\u043f\u043e\u043c\u044f\u043d\u0443\u0442\u044c \u0435\u0433\u043e \u0432 index.html<\/p>\n<pre><code class=\"xml\">&lt;!DOCTYPE html> &lt;html lang=\"en\">    &lt;head>       &lt;meta charset=\"UTF-8\" \/>       &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>       &lt;title>Test IAsyncEnumerable Application&lt;\/title>    &lt;\/head>    &lt;body>       &lt;div id=\"app\">&lt;\/div>       &lt;script type=\"module\" src=\"\/src\/main.ts\">&lt;\/script>    &lt;\/body> &lt;\/html><\/code><\/pre>\n<p>\u0414\u043b\u044f \u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430 \u0432 \u043f\u0430\u043f\u043a\u0443 utils \u044f \u043f\u043e\u043b\u043e\u0436\u0438\u043b \u0434\u0432\u0430 \u0444\u0430\u0439\u043b\u0430. \u0414\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u043f\u0443\u0442\u044f\u043c\u0438 \u0432 \u0441\u0432\u043e\u0438\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445 \u043c\u043d\u0435 \u043f\u043e\u043c\u043e\u0433\u0430\u0435\u0442 baseUrl.ts, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043a\u0430\u043a \u0440\u0430\u0437 \u0447\u0438\u0442\u0430\u0435\u0442 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0438\u0437 env:<\/p>\n<pre><code class=\"typescript\">const envBaseUrl = `${import.meta.env.VITE_VUE_APP_BASE_URL}`; const basePath = envBaseUrl.endsWith('\/') ? envBaseUrl : `${envBaseUrl}\/`; const currentMode = `${import.meta.env.VITE_NODE_ENV}`;  export { basePath, currentMode };<\/code><\/pre>\n<p>\u0410 \u0434\u043b\u044f \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0435\u043d\u0438\u044f \u043a &#171;\u0441\u0442\u0430\u0440\u044b\u043c \u0434\u043e\u0431\u0440\u044b\u043c&#187; Deferred \u0432\u043c\u0435\u0441\u0442\u043e \u043d\u0430\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u043a\u043b\u0430\u0441\u0441\u0430 Promise \u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e \u0432\u043e\u0442 \u0442\u0430\u043a\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435:<\/p>\n<pre><code class=\"typescript\">\/* eslint-disable @typescript-eslint\/no-empty-function *\/ export function getDeferred&lt;T>() {    let resolve: (value: T) => void = () => {};    let reject: (error: Error) => void = () => {};    const promise = new Promise&lt;T>((res, rej) => {       resolve = res;       reject = rej;    });    return { promise, reject, resolve }; }<\/code><\/pre>\n<p>\u0414\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432 \u0432 \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u043c \u0432\u0438\u0434\u0435 \u043f\u0440\u0435\u043a\u0440\u0430\u0441\u043d\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 Axios, \u043d\u043e, \u043a \u0441\u043e\u0436\u0430\u043b\u0435\u043d\u0438\u044e, \u0443 \u043d\u0438\u0445 \u0432\u0441\u0451 \u0435\u0449\u0435 \u043e\u0441\u0442\u0430\u044e\u0442\u0441\u044f \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0441 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u043e\u0439 \u043f\u043e\u043b\u043d\u043e\u0446\u0435\u043d\u043d\u043e\u0433\u043e \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445 \u043a\u0430\u043a \u043f\u043e\u0442\u043e\u043a\u0430 (stream). \u0423 \u043c\u0435\u043d\u044f \u043d\u0435 \u0432\u044b\u0448\u043b\u043e &#171;\u043f\u043e\u0434\u0440\u0443\u0436\u0438\u0442\u044c&#187; \u043c\u0435\u0436\u0434\u0443 \u0441\u043e\u0431\u043e\u0439 \u0442\u0430\u043a\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0435, \u0447\u0442\u043e\u0431\u044b \u043e\u043d\u0438 \u0441\u0447\u0438\u0442\u044b\u0432\u0430\u043b\u0438\u0441\u044c \u043d\u0435 \u0432\u0441\u0435 \u0446\u0435\u043b\u0438\u043a\u043e\u043c \u0438 \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u0442\u0438\u043f\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043b\u0438\u0441\u044c Typescript-\u043e\u043c, \u0442\u0435\u043c \u043d\u0435 \u043c\u0435\u043d\u0435\u0435, \u0434\u043b\u044f \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0438\u043c\u0435\u043d\u043d\u043e Axios. \u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043f\u0430\u043f\u043a\u0443 API \u0438 \u043d\u0430\u0447\u043d\u0435\u043c \u0435\u0451 \u0437\u0430\u043f\u043e\u043b\u043d\u044f\u0442\u044c. <\/p>\n<p>\u041c\u043d\u0435 \u0431\u044b \u0445\u043e\u0442\u0435\u043b\u043e\u0441\u044c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0443\u043d\u0438\u0432\u0435\u0440\u0441\u0430\u043b\u044c\u043d\u044b\u0439 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u043e\u0433 \u0431\u044b \u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c \u043b\u044e\u0431\u043e\u0439 \u043f\u043e\u0442\u043e\u043a \u0442\u0438\u043f\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445 \u0438 \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u043e\u0448\u0438\u0431\u043a\u0438, \u0442\u0430\u043a \u0447\u0442\u043e \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c generics \u043f\u043e \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0438 \u0441 C#. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u043c \u0434\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u043d\u0430\u0448\u0438\u043c <strong>IAsyncEnumerable<\/strong> \u043d\u043e\u0432\u044b\u0439 \u043a\u043b\u0430\u0441\u0441 \u0432 \u0444\u0430\u0439\u043b\u0435 fetchFactory.ts. \u041e\u043d \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0432 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 \u0431\u0430\u0437\u043e\u0432\u043e\u0433\u043e \u043f\u0443\u0442\u0438 \u0434\u043b\u044f \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432, \u043f\u0440\u0435\u0434\u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0435 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0438 \u0438 \u0438\u043c\u0435\u0435\u0442 \u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 \u043c\u0435\u0442\u043e\u0434 fetchGet, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u043e\u043c\u0443 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u043c\u0443 \u043f\u0443\u0442\u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 Promise&lt;Responce> \u0437\u0430\u043f\u0440\u043e\u0441\u0430. \u0414\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 \u044d\u0442\u043e\u0433\u043e \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f EnableStreamReader, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 Generic \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 T \u043a\u0430\u043a \u0442\u0438\u043f \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u043c\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0447\u0438\u0442\u0430\u0435\u043c\u043e\u0439 \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u0438, \u043d\u0430 \u0432\u0445\u043e\u0434 \u0445\u043e\u0447\u0435\u0442 \u0442\u043e\u0442 \u0441\u0430\u043c\u044b\u0439 Responce \u0438\u0437 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0435\u0433\u043e \u043c\u0435\u0442\u043e\u0434\u0430 \u043a\u043b\u0430\u0441\u0441\u0430 \u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u0432 \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u0434\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0431\u0443\u0434\u0443\u0442 \u043f\u043e\u043f\u0430\u0434\u0430\u0442\u044c \u0441\u0447\u0438\u0442\u0430\u043d\u043d\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b. \u041c\u044b \u043d\u0435 \u043c\u043e\u0436\u0435\u043c \u0433\u0430\u0440\u0430\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u0447\u0438\u0442\u044b\u0432\u0430\u043d\u0438\u0435 \u0441\u0442\u0440\u043e\u0433\u043e \u043f\u043e 1, \u0442\u0430\u043a \u0447\u0442\u043e \u0434\u043b\u044f \u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430 \u0432\u0441\u0435\u0433\u0434\u0430 \u043e\u0436\u0438\u0434\u0430\u0435\u043c \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u0438.<\/p>\n<p>\u041e\u0437\u043d\u0430\u043a\u043e\u043c\u044c\u0442\u0435\u0441\u044c \u0441 \u043f\u043e\u043b\u043d\u044b\u043c \u043a\u043e\u0434\u043e\u043c \u0438 \u0434\u0430\u043b\u044c\u0448\u0435 \u044f \u0440\u0430\u0437\u0431\u0435\u0440\u0443 \u0441\u0430\u043c\u044b\u0435 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0435 \u043c\u043e\u043c\u0435\u043d\u0442\u044b:<\/p>\n<pre><code class=\"typescript\">import { getDeferred } from '@\/utils\/deferred';  export class FetchFactory {    private baseUrl: string;    private requestHeaders: HeadersInit;     constructor(baseUrl: string) {       this.baseUrl = baseUrl;       this.requestHeaders = new Headers();       this.requestHeaders.set('Content-Type', 'application\/json');       this.requestHeaders.set('Access-Control-Allow-Credentials', 'true');    }     public fetchGet(url: string, params?: URLSearchParams, signal?: AbortSignal): Promise&lt;Response> {       let checkedUrl = url.startsWith('\/') ? `${this.baseUrl}${url}` : `${this.baseUrl}\/${url}`;       checkedUrl = params === undefined ? checkedUrl : `${checkedUrl}?${params}`;       return fetch(checkedUrl, {          method: 'GET',          headers: this.requestHeaders,          credentials: 'include',          signal: signal,       });    } }  export async function EnableStreamReader&lt;T>(    apiResponse: Response,    resultIterator: (newElems: T[]) => void, ): Promise&lt;void> {    const { promise, resolve, reject } = getDeferred&lt;void>();    const decoder = new TextDecoder();    const reader = apiResponse.body?.getReader();    if (reader != null) {       let streamNotEnded = true;       while (streamNotEnded) {          const { done, value } = await reader.read(); \/\/reading new batch          streamNotEnded = !done;          if (streamNotEnded) {             const result = decoder.decode(value).replace(\/^\\s*\\[|]\\s*$\/g, '').replace(\/^\\s*,\/, ''); \/\/convert bytes to text             if (result != null) {                const parsed = JSON.parse(`[${result}]`); \/\/parse to array                if (parsed != null) {                   const casted = parsed as T[]; \/\/cast to array of T                   if (casted != null) {                      resultIterator(parsed); \/\/iterate on result                   } else reject(new Error('Readed value is not a JSON of expected Type'));                } else reject(new Error('Readed value is not a JSON object'));             } else reject(new Error('Readed value is not a string'));          }       }       reader.releaseLock();       resolve();    } else reject(new Error('Reader not ready'));     return promise; } <\/code><\/pre>\n<p>\u0412 \u0446\u0435\u043b\u043e\u043c, \u043f\u043e \u0448\u0430\u0433\u0430\u043c \u0437\u0430\u0434\u0430\u0447\u0430 \u043d\u0435 \u0441\u0430\u043c\u0430\u044f \u0441\u043b\u043e\u0436\u043d\u0430\u044f \u2014 \u043f\u043e\u043a\u0430 \u043d\u0430\u043c \u0435\u0441\u0442\u044c \u0447\u0442\u043e \u0447\u0438\u0442\u0430\u0442\u044c (await reader.read() \u043d\u0435 \u0432\u0435\u0440\u043d\u0443\u043b \u0432 done \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u0435 \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f), \u043c\u044b \u043f\u044b\u0442\u0430\u0435\u043c\u0441\u044f \u0434\u0435\u043a\u043e\u0434\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435. \u0422\u0430\u043a \u043a\u0430\u043a \u043c\u044b \u043f\u043e\u0441\u044b\u043b\u0430\u0435\u043c \u0438\u0445 \u0441 ASP.NET \u0432 \u0444\u043e\u0440\u043c\u0430\u0442\u0435 JSON, \u0442\u043e \u0438 \u0441\u044e\u0434\u0430 \u043e\u043d\u0438 \u0442\u043e\u0436\u0435 \u043f\u043e\u043f\u0430\u0434\u0430\u044e\u0442 \u0442\u0430\u043a, \u043d\u043e&#8230; \u043f\u0440\u043e\u0441\u0442\u043e \u043a\u0430\u043a \u0431\u0443\u0434\u0442\u043e \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0435 \u0440\u043e\u0432\u043d\u043e \u043c\u0435\u0436\u0434\u0443 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u043c\u0430\u0441\u0441\u0438\u0432\u0430. \u041f\u0440\u0438 \u044d\u0442\u043e\u043c \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u044e\u0449\u0430\u044f \u0438 \u0437\u0430\u043a\u0440\u044b\u0432\u0430\u044e\u0449\u0430\u044f \u0441\u043a\u043e\u0431\u043a\u0430 \u043c\u0430\u0441\u0441\u0438\u0432\u043e\u0432 \u0442\u043e\u0436\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0441\u044f \u0432 \u043f\u0435\u0440\u0432\u043e\u043c \u0438 \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0435\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0435 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e. \u0412\u043e\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u0447\u0442\u0435\u043d\u0438\u044f \u043d\u0430\u0448\u0438\u0445 Product<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/77c\/09f\/ee5\/77c09fee50754fb25865d25ccbcd2881.PNG\" alt=\"\u0421\u0447\u0438\u0442\u0430\u043d\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u043e \u043f\u043e\u0440\u0446\u0438\u044f\u043c\" title=\"\u0421\u0447\u0438\u0442\u0430\u043d\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u043e \u043f\u043e\u0440\u0446\u0438\u044f\u043c\" width=\"1152\" height=\"250\"\/><\/p>\n<div><figcaption>\u0421\u0447\u0438\u0442\u0430\u043d\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u043e \u043f\u043e\u0440\u0446\u0438\u044f\u043c<\/figcaption><\/div>\n<\/figure>\n<p>\u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u043c\u044b \u0443\u0431\u0438\u0440\u0430\u0435\u043c \u0441\u0438\u043c\u0432\u043e\u043b\u044b \u043a\u0432\u0430\u0434\u0440\u0430\u0442\u043d\u044b\u0445 \u0441\u043a\u043e\u0431\u043e\u043a \u0438 \u0437\u0430\u043f\u044f\u0442\u043e\u0439 \u0438\u0437 \u0441\u0447\u0438\u0442\u0430\u043d\u043d\u043e\u0433\u043e \u0431\u043b\u043e\u043a\u0430. \u0414\u0430\u043b\u044c\u0448\u0435 \u043f\u044b\u0442\u0430\u0435\u043c\u0441\u044f \u043f\u043e\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u044d\u0442\u0443 \u0441\u0442\u0440\u043e\u043a\u0443 \u0432 \u043f\u043e\u043b\u043d\u043e\u0446\u0435\u043d\u043d\u044b\u0439 \u043c\u0430\u0441\u0441\u0438\u0432 [&#8230;] \u0438 \u043f\u0440\u0435\u0432\u0440\u0430\u0442\u0438\u0442\u044c \u0447\u0435\u0440\u0435\u0437 JSON.parse. \u041c\u0430\u0441\u0441\u0438\u0432 \u043d\u0430\u043c \u043f\u0440\u0438\u0433\u043e\u0434\u0438\u0442\u0441\u044f \u043d\u0430 \u0441\u043b\u0443\u0447\u0430\u0439, \u0435\u0441\u043b\u0438 \u0442\u0430\u043c \u0438 \u043f\u0440\u0430\u0432\u0434\u0430 \u0441\u0447\u0438\u0442\u0430\u043b\u043e\u0441\u044c \u0431\u043e\u043b\u044c\u0448\u0435 1 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0437\u0430 \u0440\u0430\u0437 (\u0442\u0430\u043a \u0431\u0443\u0434\u0435\u0442, \u0435\u0441\u043b\u0438 \u0441\u043d\u044f\u0442\u044c Delay \u0432 \u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u0439 \u0447\u0430\u0441\u0442\u0438), \u0438\u043d\u0430\u0447\u0435 \u043c\u043e\u043c\u0435\u043d\u0442 \u043f\u0430\u0440\u0441\u0438\u043d\u0433\u0430 \u043c\u043e\u0436\u0435\u0442 \u0432\u044b\u0437\u0432\u0430\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0443. \u0414\u0430\u043b\u0435\u0435 \u043c\u044b \u043a\u0430\u0441\u0442\u0443\u0435\u043c \u0441\u0447\u0438\u0442\u0430\u043d\u043d\u044b\u0439 \u043c\u0430\u0441\u0441\u0438\u0432 \u043a \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u043c\u0443 \u0442\u0438\u043f\u0443 \u0434\u0430\u043d\u043d\u044b\u0445 \u0438, \u0435\u0441\u043b\u0438 \u0432\u0441\u0451 \u0445\u043e\u0440\u043e\u0448\u043e, \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u0432 \u043c\u0435\u0442\u043e\u0434 \u0434\u043b\u044f \u0434\u0430\u043b\u044c\u043d\u0435\u0439\u0448\u0435\u0439 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438.<\/p>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u0444\u0430\u0439\u043b productApi.ts, \u043a\u0443\u0434\u0430 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0438\u043c \u043a\u0430\u043a \u043d\u0430\u0448\u0443 &#171;\u0447\u0438\u0442\u0430\u043b\u043a\u0443&#187; \u0441\u0442\u0440\u0438\u043c\u043e\u0432, \u0442\u0430\u043a \u0438 AxiosInstance \u043a\u043b\u0430\u0441\u0441 (\u0435\u0433\u043e \u043c\u044b \u043e\u043f\u0438\u0448\u0435\u043c \u0432 \u0442\u043e\u0447\u043a\u0435 \u0432\u0445\u043e\u0434\u0430 \u0432 API \u0447\u0443\u0442\u044c \u043d\u0438\u0436\u0435). \u0417\u0434\u0435\u0441\u044c \u0443 \u043d\u0430\u0441 \u0431\u0443\u0434\u0435\u0442 \u0442\u0440\u0438 \u043c\u0435\u0442\u043e\u0434\u0430 &#8212; \u0434\u043b\u044f \u0437\u0430\u0433\u0440\u0443\u0437\u043e\u043a \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0438 &#171;\u043f\u043e\u0442\u043e\u043a\u043e\u0432\u043e\u0433\u043e&#187; \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430 \u0434\u0430\u043d\u043d\u044b\u0445, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043c\u0435\u0442\u043e\u0434 \u043e\u0442\u043c\u0435\u043d\u044b \u0434\u043b\u044f \u043d\u0430\u0433\u043b\u044f\u0434\u043d\u043e\u0441\u0442\u0438. \u0420\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e \u043e\u0442\u043c\u0435\u043d\u044b \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e \u0438\u0437\u0443\u0447\u0438\u0442\u044c, \u043c\u043d\u0435 \u043e\u0447\u0435\u043d\u044c \u043f\u043e\u043d\u0440\u0430\u0432\u0438\u043b\u043e\u0441\u044c \u0432\u043e\u0442 \u0442\u0430\u043a \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c abortController. \u041d\u0430\u043c \u0432\u0430\u0436\u043d\u043e \u0443\u0431\u0435\u0434\u0438\u0442\u044c\u0441\u044f, \u0447\u0442\u043e\u0431\u044b \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0443\u0442\u0438 \u043f\u0440\u0438\u0432\u0435\u043b\u0438 \u043d\u0430\u0441 \u0432 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440 ASP.NET \u0442\u0430\u043a, \u043a\u0430\u043a \u043c\u044b \u0435\u0433\u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043b\u0438 \u0432 \u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u0439 \u0447\u0430\u0441\u0442\u0438.<\/p>\n<pre><code class=\"typescript\">import { Product } from '@\/models\/product'; import { AxiosInstance } from 'axios'; import { FetchFactory, EnableStreamReader } from '@\/API\/fetchFactory';  export class ProductAPI {    constructor(httpRequest: AxiosInstance, asyncEnumerableRequest: FetchFactory) {       this.httpRequest = httpRequest;       this.asyncEnumerableRequest = asyncEnumerableRequest;    }     private httpRequest: AxiosInstance;    private asyncEnumerableRequest: FetchFactory;    private abortController: AbortController;     async getProducts(onlyEnabled: boolean): Promise&lt;Product[]> {       this.cancel();       const result = await this.httpRequest.get&lt;Product[]>('product\/GetList', {          params: {             onlyEnabled: onlyEnabled,          },          signal: this.abortController.signal,       });       return result.data;    }     async getProductStream(onlyEnabled: boolean, onReceive: (elem: Product[]) => void) {       this.cancel();       const params = new URLSearchParams();       params.append('onlyEnabled', onlyEnabled.toString());       const response = await this.asyncEnumerableRequest.fetchGet(          'product\/GetAsyncStream',          params,          this.abortController.signal,       );       await EnableStreamReader&lt;Product>(response, onReceive);    }     cancel(): void {       if (this.abortController) {          this.abortController.abort();       }       this.abortController = new AbortController();    } } <\/code><\/pre>\n<p>\u042f \u043f\u0440\u0435\u0434\u043f\u043e\u0447\u0438\u0442\u0430\u044e, \u0447\u0442\u043e\u0431\u044b \u0434\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 API \u0431\u044b\u043b\u0430 \u0435\u0434\u0438\u043d\u0430\u044f \u0442\u043e\u0447\u043a\u0430 \u0432\u0445\u043e\u0434\u0430, \u0442\u0430\u043a \u0447\u0442\u043e \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c apiService.ts, \u0433\u0434\u0435 \u0437\u0430\u0434\u0430\u0434\u0438\u043c \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043f\u0443\u0442\u044c, \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440 AxiosInstance \u0438 \u0432\u044b\u0441\u0442\u0430\u0432\u0438\u043c \u043d\u0430\u0440\u0443\u0436\u0443 \u0434\u0440\u0443\u0433\u0438\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0443\u0434\u043e\u0431\u043d\u044b\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c \u043a\u043b\u0430\u0441\u0441\u044b \u0432\u0440\u043e\u0434\u0435 productApi.<\/p>\n<pre><code class=\"typescript\">&lt;script setup lang=\"ts\"> import { ref } from 'vue'; import { API } from '@\/API\/apiService'; import { Product } from '@\/models\/product';  const list = ref&lt;Product[]>([]); const onlyEnabled = ref&lt;boolean>(true);  async function getList() {    list.value = [];    const newValues = await API.product.getProducts(onlyEnabled.value);    list.value = newValues; } async function getListByStream() {    list.value = [];    await API.product.getProductStream(onlyEnabled.value, (prodArr) => {       if (prodArr != undefined &amp;&amp; prodArr.length > 0) {          list.value.push(...prodArr);       }    }); } function cancelLoading() {    API.product.cancel(); } &lt;\/script> &lt;template>    &lt;h3>Classic load - wait all items from backend before render it&lt;\/h3>    &lt;h3>Stream load - render items when they are received from backend&lt;\/h3>    &lt;h3>Cancel to stop&lt;\/h3>    &lt;div class=\"panel\">       &lt;input id=\"onlyEnabledChb\" v-model=\"onlyEnabled\" type=\"checkbox\" \/>       &lt;label for=\"onlyEnabledChb\"> only enabled? &lt;\/label>    &lt;\/div>    &lt;div class=\"panel\">       &lt;button @click=\"getList\">Classic load&lt;\/button>       &lt;button @click=\"getListByStream\">Stream load&lt;\/button>       &lt;button @click=\"cancelLoading\">Cancel loading&lt;\/button>    &lt;\/div>    &lt;div v-for=\"item in list\" :key=\"item.id\" class=\"product\">       &lt;b>Name:&lt;\/b> '{{ item.name }}' &lt;b>Code:&lt;\/b> '{{ item.code }}' &lt;b>SortOrder:&lt;\/b> '{{ item.sortOrder }}'       &lt;b>Enabled:&lt;\/b> '{{ item.enabled }}'    &lt;\/div> &lt;\/template> &lt;style lang=\"scss\" scoped> .product {    margin: 10px;    text-align: center; }  .panel {    display: flex;    flex-direction: row;    flex-wrap: nowrap;    justify-content: center;    align-items: baseline; } .panel button {    margin-left: 10px; } &lt;\/style><\/code><\/pre>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0432\u0441\u0451 \u0433\u043e\u0442\u043e\u0432\u043e \u0434\u043b\u044f \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043e\u0434\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b App.vue. \u0412 \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0442\u0443\u0442 \u0431\u044b\u043b \u0431\u044b \u0440\u043e\u0443\u0442\u0438\u043d\u0433, \u0440\u0430\u0437\u0431\u0438\u0435\u043d\u0438\u0435 \u043d\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0438 \u043f\u0440\u043e\u0447\u0435\u0435, \u043d\u043e \u043c\u044b \u043e\u0441\u0442\u0430\u0432\u0438\u043c \u0432\u0441\u0451 \u0432 \u043e\u0434\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435 \u0434\u043b\u044f \u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430, \u043f\u0440\u043e\u0441\u0442\u043e\u0442\u044b \u0438 \u043d\u0430\u0433\u043b\u044f\u0434\u043d\u043e\u0441\u0442\u0438. \u042f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b \u0441\u0432\u0435\u0436\u0438\u0439 \u043f\u043e\u0434\u0445\u043e\u0434 Vue 3 \u0441 Composition API, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043a\u0430\u0436\u0435\u0442\u0441\u044f \u0443\u0434\u043e\u0431\u043d\u0435\u0435 \u0447\u0435\u043c \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0438\u0435 \u0432\u0435\u0440\u0441\u0438\u0438, \u043d\u043e \u0432\u0441\u0451 \u043f\u0440\u0435\u043a\u0440\u0430\u0441\u043d\u043e \u0437\u0430\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0438 \u043d\u0430 \u043d\u0438\u0445. \u041e\u043f\u0438\u0448\u0435\u043c \u0442\u0440\u0438 \u043a\u043d\u043e\u043f\u043a\u0438 \u0434\u043b\u044f \u0432\u044b\u0437\u043e\u0432\u0430 \u0442\u0440\u0435\u0445 \u043d\u0430\u0448\u0438\u0445 \u043c\u0435\u0442\u043e\u0434\u043e\u0432 API, \u0447\u0435\u043a\u0431\u043e\u043a\u0441 \u0434\u043b\u044f \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430 &#171;\u0442\u043e\u043b\u044c\u043a\u043e \u0441 Enabled == true&#187; \u0438 \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u044e \u0441\u0447\u0438\u0442\u0430\u043d\u043d\u044b\u0445 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432. \u0421\u043f\u0438\u0441\u043e\u043a \u043e\u0447\u0438\u0449\u0430\u0435\u0442\u0441\u044f \u043f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u0437\u0430\u043f\u0443\u0441\u043a\u0435 \u0434\u043b\u044f \u043d\u0430\u0433\u043b\u044f\u0434\u043d\u043e\u0441\u0442\u0438. \u041a\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c, \u043f\u0440\u0438 \u0447\u0442\u0435\u043d\u0438\u0438 &#171;\u0441\u0442\u0440\u0438\u043c\u043e\u043c&#187; \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u0443\u044e \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0434\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u043f\u0440\u0438\u0445\u043e\u0434\u044f\u0449\u0438\u0445 \u0434\u0430\u043d\u043d\u044b\u0445. \u041f\u0440\u0438 \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u043c \u0447\u0442\u0435\u043d\u0438\u0438 \u043c\u043e\u0436\u043d\u043e \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0432\u0441\u0451 \u0442\u043e\u043b\u044c\u043a\u043e \u0446\u0435\u043b\u0438\u043a\u043e\u043c. <\/p>\n<pre><code class=\"typescript\">&lt;script setup lang=\"ts\"> import { ref } from 'vue'; import { API } from '@\/API\/apiService'; import { Product } from '@\/models\/product';  const list = ref&lt;Product[]>([]); const onlyEnabled = ref&lt;boolean>(true);  async function getList() {    list.value = [];    const newValues = await API.product.getProducts(onlyEnabled.value);    list.value = newValues; } async function getListByStream() {    list.value = [];    await API.product.getProductStream(onlyEnabled.value, (prodArr) => {       if (prodArr != undefined &amp;&amp; prodArr.length > 0) {          list.value.push(...prodArr);       }    }); } function cancelLoading() {    API.product.cancel(); } &lt;\/script> &lt;template>    &lt;h3>Classic load - wait all items from backend before render it&lt;\/h3>    &lt;h3>Stream load - render items when they are received from backend&lt;\/h3>    &lt;h3>Cancel to stop&lt;\/h3>    &lt;div class=\"panel\">       &lt;input id=\"onlyEnabledChb\" v-model=\"onlyEnabled\" type=\"checkbox\" \/>       &lt;label for=\"onlyEnabledChb\"> only enabled? &lt;\/label>    &lt;\/div>    &lt;div class=\"panel\">       &lt;button @click=\"getList\">Classic load&lt;\/button>       &lt;button @click=\"getListByStream\">Stream load&lt;\/button>       &lt;button @click=\"cancelLoading\">Cancel loading&lt;\/button>    &lt;\/div>    &lt;div v-for=\"item in list\" :key=\"item.id\" class=\"product\">       &lt;b>Name:&lt;\/b> '{{ item.name }}' &lt;b>Code:&lt;\/b> '{{ item.code }}' &lt;b>SortOrder:&lt;\/b> '{{ item.sortOrder }}'       &lt;b>Enabled:&lt;\/b> '{{ item.enabled }}'    &lt;\/div> &lt;\/template> &lt;style lang=\"scss\" scoped> .product {    margin: 10px;    text-align: center; }  .panel {    display: flex;    flex-direction: row;    flex-wrap: nowrap;    justify-content: center;    align-items: baseline; } .panel button {    margin-left: 10px; } &lt;\/style><\/code><\/pre>\n<p>\u0412\u0441\u0451 \u0433\u043e\u0442\u043e\u0432\u043e \u043a \u0442\u0435\u0441\u0442\u043e\u0432\u043e\u043c\u0443 \u0437\u0430\u043f\u0443\u0441\u043a\u0443. \u0421\u043d\u0430\u0447\u0430\u043b\u0430 \u0432 \u043f\u0430\u043f\u043a\u0435 ClientApp \u0432\u044b\u0437\u043e\u0432\u0435\u043c npm run dev \u0434\u043b\u044f \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u043e\u0442\u043b\u0430\u0434\u043e\u0447\u043d\u043e\u0433\u043e \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u043d\u0430 \u043f\u043e\u0440\u0442\u0443 4444, \u0437\u0430\u0442\u0435\u043c \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u043c \u0432 Visual Studio \u043d\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0432 IIS Express. \u0427\u0435\u0440\u0435\u0437 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0432\u0440\u0435\u043c\u044f \u043e\u043d\u0438 &#171;\u043f\u043e\u0434\u0440\u0443\u0436\u0430\u0442\u0441\u044f&#187; \u0438 \u0443 \u043d\u0430\u0441 \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u0441\u044f \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0449\u0438\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0430\u043c\u0438.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/4e7\/1d3\/4b8\/4e71d34b83dc53385780220efe1d1ec0.PNG\" alt=\"\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0440\u0430\u0431\u043e\u0442\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\" title=\"\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0440\u0430\u0431\u043e\u0442\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\" width=\"1299\" height=\"495\"\/><\/p>\n<div><figcaption>\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0440\u0430\u0431\u043e\u0442\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/figcaption><\/div>\n<\/figure>\n<p>\u0427\u0442\u043e \u0436, \u0432\u0441\u0451 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0440\u0430\u0431\u043e\u0447\u0438\u043c, \u043d\u043e \u043f\u0440\u0438 \u0437\u0430\u043f\u0443\u0441\u043a\u0435 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u0442\u044c\u0441\u044f \u0441 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u043e\u0439, \u0447\u0442\u043e .NET \u0432\u0441\u0451 \u0440\u0430\u0432\u043d\u043e \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 &#171;\u043f\u043e\u0442\u043e\u043a\u043e\u0432\u044b\u0439&#187; \u043a\u043e\u0434 \u0442\u043e\u043b\u044c\u043a\u043e \u0446\u0435\u043b\u0438\u043a\u043e\u043c, \u043d\u0438\u0432\u0435\u043b\u0438\u0440\u0443\u044f \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430 \u0438 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043e\u0431\u043c\u0435\u043d\u0430. \u041e\u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c, \u0447\u0442\u043e \u0434\u0435\u043b\u043e \u0432 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0435 \u0431\u0443\u0444\u0435\u0440\u0438\u0437\u0430\u0446\u0438\u0438 \u043e\u0442\u0432\u0435\u0442\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043f\u043e\u043b\u0435\u0437\u043d\u0430 \u043f\u0440\u0438 \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u0435, \u043d\u043e \u0430\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u0430 \u0432\u0440\u0435\u0434\u043e\u043d\u043e\u0441\u043d\u0430 \u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435. \u0427\u0442\u043e\u0431\u044b \u0432\u0441\u0451 \u0437\u0430\u0440\u0430\u0431\u043e\u0442\u0430\u043b\u043e \u043a\u0430\u043a \u043d\u0430\u0434\u043e \u2014 \u043f\u0440\u043e\u0441\u0442\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u0432 \u0432\u044b\u0437\u043e\u0432 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u0430 ASP \u0442\u0430\u043a\u0443\u044e \u0441\u0442\u0440\u043e\u043a\u0443<\/p>\n<pre><code class=\"cs\">HttpContext?.Features?.Get&lt;IHttpResponseBodyFeature>()?.DisableBuffering();<\/code><\/pre>\n<p>\u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u044f \u0445\u043e\u0442\u0435\u043b \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u0432\u0430\u043c \u043a\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c IAsyncEnumerable \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u0438 \u043f\u043e\u0440\u0446\u0438\u044f\u043c\u0438 \u0431\u0435\u0437 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0445 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a \u0432 Typescript. \u041d\u0430\u0434\u0435\u044e\u0441\u044c \u044d\u0442\u0430 \u0441\u0442\u0430\u0442\u044c\u044f \u043e\u043a\u0430\u0436\u0435\u0442\u0441\u044f \u043a\u043e\u043c\u0443-\u0442\u043e \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043f\u043e\u043b\u0435\u0437\u043d\u043e\u0439, \u0441\u043f\u0430\u0441\u0438\u0431\u043e \u0437\u0430 \u0447\u0442\u0435\u043d\u0438\u0435 \u0438 \u0443\u0434\u0430\u0447\u043d\u043e\u0433\u043e \u043a\u043e\u0434\u0438\u043d\u0433\u0430 \u043a\u0430\u043a \u043d\u0430 \u0431\u044d\u043a\u0435\u043d\u0434\u0435, \u0442\u0430\u043a \u0438 \u043d\u0430 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0435 \u0432\u0441\u0435\u043c! \u0422\u0430\u043a\u043e\u0432 \u043f\u0443\u0442\u044c \ud83d\ude42<\/p>\n<p><a href=\"https:\/\/github.com\/AlDantefox\/Bimeister.Habr.TestWebApp\"><u>\u0421\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439 \u0441 \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u043c \u043a\u043e\u0434\u043e\u043c<\/u><\/a>.<\/p>\n<\/p>\n<\/div>\n<\/div>\n<\/div>\n<p><!----><!----><\/div>\n<p><!----><!----><br \/> \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"https:\/\/habr.com\/ru\/articles\/764256\/\"> https:\/\/habr.com\/ru\/articles\/764256\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<div><!--[--><!--]--><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<figure class=\"full-width\">\n<div><figcaption>\u041e\u0431\u043c\u0435\u043d \u043c\u0435\u0436\u0434\u0443 ASP.NET Core \u0438 Typescript \u043d\u0430 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0435<\/figcaption><\/div>\n<\/figure>\n<p>\u0412\u0441\u0435\u043c \u043f\u0440\u0438\u0432\u0435\u0442, \u041c\u0435\u043d\u044f \u0437\u043e\u0432\u0443\u0442 \u041e\u043b\u0435\u0433 \u0438 \u044f .NET \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0432 \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u0438 Bimeister. \u042f \u0445\u043e\u0442\u0435\u043b \u043f\u043e\u0434\u0435\u043b\u0438\u0442\u044c\u0441\u044f \u0441 \u0432\u0430\u043c\u0438 \u0441\u0432\u043e\u0438\u043c \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u043c \u043e\u043f\u044b\u0442\u043e\u043c \u043f\u043e \u0441\u0432\u044f\u0437\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u043d\u0430 ASP.NET Core Web App \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c <strong>IAsyncEnumerable<\/strong> \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u0439 \u0438 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434 SPA \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0430 Typescript \u0438 Vue.js 3 \u0432\u0435\u0440\u0441\u0438\u0438.<\/p>\n<p>\u0412 \u0434\u0430\u043d\u043d\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u043d\u043e \u043f\u043e\u0448\u0430\u0433\u043e\u0432\u043e\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u043a\u0430\u043a \u0434\u043b\u044f .NET, \u0442\u0430\u043a \u0438 \u0434\u043b\u044f \u0435\u0433\u043e \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u043e\u0439 \u0447\u0430\u0441\u0442\u0438, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u0438\u0445 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f. \u042f \u0445\u043e\u0442\u0435\u043b \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u043d\u0430 \u043d\u0435\u0441\u043b\u043e\u0436\u043d\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 (\u0434\u0430\u0436\u0435 \u0434\u043b\u044f \u043d\u043e\u0432\u0438\u0447\u043a\u043e\u0432 \u0432 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435 \u043f\u043e \u044d\u0442\u0438\u043c \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u044f\u043c) \u043a\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u043e\u0431\u043c\u0435\u043d \u0434\u0430\u043d\u043d\u044b\u043c\u0438 \u043c\u0435\u0436\u0434\u0443 \u043d\u0438\u043c\u0438. \u0422\u0435\u043c \u043d\u0435 \u043c\u0435\u043d\u0435\u0435, \u0434\u0430\u0436\u0435 \u0438\u0441\u043a\u0443\u0448\u0435\u043d\u043d\u044b\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430\u043c \u0441\u0442\u0430\u0442\u044c\u044f \u043c\u043e\u0436\u0435\u0442 \u043e\u043a\u0430\u0437\u0430\u0442\u044c\u0441\u044f \u043f\u043e\u043b\u0435\u0437\u043d\u043e\u0439, \u0435\u0441\u043b\u0438 \u0432\u044b \u0445\u043e\u0442\u0438\u0442\u0435 \u043f\u043e\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u0442\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u0442\u043e\u043a\u043e\u0432\u043e\u0435 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0445 \u0432 Typescript \u0438\u043b\u0438 \u0443\u0436\u0435 \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0438\u0441\u044c \u0441\u043e \u0441\u0442\u0440\u0430\u043d\u043d\u044b\u043c\u0438 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044f\u043c\u0438.<\/p>\n<p>\u0412\u0441\u0435 \u044d\u0442\u0438 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0438 \u043d\u0435 \u043d\u043e\u0432\u044b \u0438, \u043d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435, \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u0438 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434 \u0447\u0430\u0441\u0442\u044c \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u043b\u044e\u0431\u044b\u0435 \u043d\u0430 \u0432\u0430\u0448 \u0432\u043a\u0443\u0441: Angular, \u0438\u043b\u0438 React, \u0438\u043b\u0438 \u0447\u0442\u043e-\u043b\u0438\u0431\u043e \u0435\u0449\u0435. \u0412\u0435\u0441\u044c \u0438\u043d\u0442\u0435\u0440\u0435\u0441 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0431\u043e\u0439 \u0438\u043c\u0435\u043d\u043d\u043e \u0443\u043d\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0430 \u043e\u0431\u043c\u0435\u043d\u0430 \u0441 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u043e\u0439 \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u0435\u0439 \u0441 \u0431\u044d\u043a\u0435\u043d\u0434\u0430 \u043d\u0430 C#. \u042f \u043d\u0435 \u0431\u0443\u0434\u0443 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e \u0437\u0430\u043e\u0441\u0442\u0440\u044f\u0442\u044c \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043d\u0430 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0435 \u043e\u0431\u0435\u0438\u0445 \u043f\u043e\u043b\u043e\u0432\u0438\u043d \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0441\u043a\u0430\u0436\u0443 \u043b\u0438\u0448\u044c, \u0447\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b \u043e\u0434\u0438\u043d \u0438\u0437 \u0441\u043b\u043e\u0436\u0438\u0432\u0448\u0438\u0445\u0441\u044f \u0432 \u043c\u043e\u0435\u0439 \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0438 \u0448\u0430\u0431\u043b\u043e\u043d\u043e\u0432 \u0434\u043b\u044f \u0437\u0430\u043f\u0443\u0441\u043a\u0430 ASP.NET Core Web \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0441 SPA. \u0412\u0441\u0435 \u0434\u0435\u0442\u0430\u043b\u0438 \u043c\u043e\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u043c \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0438.<\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u043d\u0430\u0447\u043d\u0435\u043c \u0441 \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f \u2014 \u0437\u0430\u0447\u0435\u043c \u0432\u043e\u043e\u0431\u0449\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u044d\u0442\u043e\u0442 <strong>IAsyncEnumerable<\/strong> \u0438 \u0447\u0442\u043e \u0441 \u043d\u0438\u043c \u043c\u043e\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c? \u042d\u0442\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0431\u0440\u0430\u0449\u0430\u0442\u044c\u0441\u044f \u043a \u0434\u0430\u043d\u043d\u044b\u043c \u043a\u0430\u043a \u043a \u043f\u043e\u0442\u043e\u043a\u0443, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044f \u043f\u043e\u043b\u0443\u0447\u0430\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0442\u044c \u0438\u0445 \u0434\u043b\u044f \u0434\u0430\u043b\u044c\u043d\u0435\u0439\u0448\u0435\u0439 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u043f\u043e \u043c\u0435\u0440\u0435 \u0433\u043e\u0442\u043e\u0432\u043d\u043e\u0441\u0442\u0438 \u0432 \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435. \u041e\u043d \u0447\u0430\u0441\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u043f\u0440\u0438 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u0438 <strong>async foreach<\/strong> \u0438 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043e\u0431\u043e \u0432\u0441\u0435\u043c \u044d\u0442\u043e\u043c \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u0439\u0442\u0438 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043e\u0442\u043b\u0438\u0447\u043d\u044b\u0445 \u0441\u0442\u0430\u0442\u0435\u0439, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043d\u0430 <a href=\"https:\/\/habr.com\/ru\/companies\/otus\/articles\/514594\/\">\u0425\u0430\u0431\u0440\u0435<\/a>. \u042f \u043b\u0438\u0448\u044c \u0437\u0430\u043e\u0441\u0442\u0440\u044e \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043d\u0430 \u0442\u043e\u043c, \u0447\u0442\u043e \u0433\u043b\u0430\u0432\u043d\u044b\u0439 \u0438\u043d\u0442\u0435\u0440\u0435\u0441 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0431\u043e\u0439 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043d\u0435 \u0436\u0434\u0430\u0442\u044c \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u0446\u0435\u043b\u043e\u0439 \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u0438 \u0441\u0440\u0430\u0437\u0443, \u0430 \u0447\u0442\u043e-\u0442\u043e \u0434\u0435\u043b\u0430\u0442\u044c \u0441 \u043a\u0430\u0436\u0434\u044b\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c \u0438\u043b\u0438 \u0433\u0440\u0443\u043f\u043f\u043e\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043f\u043e \u043c\u0435\u0440\u0435 \u0438\u0445 \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u044f.\u00a0  <\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043f\u0440\u0438\u043c\u0438\u0442\u0438\u0432\u043d\u043e\u0435 \u0432\u0435\u0431-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441 \u0438\u043c\u0438\u0442\u0430\u0446\u0438\u0435\u0439 \u0441\u0447\u0438\u0442\u044b\u0432\u0430\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445 \u0438\u0437 \u0411\u0414 \u0432 \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435. \u042f \u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e \u0437\u0430 \u043f\u0440\u0435\u0434\u0435\u043b\u0430\u043c\u0438 \u0434\u0430\u043d\u043d\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0438 \u0440\u0430\u0437\u043c\u044b\u0448\u043b\u0435\u043d\u0438\u044f, \u043f\u043e\u0447\u0435\u043c\u0443 \u0441\u0442\u043e\u0438\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0431\u0430\u0437\u043e\u0432\u0443\u044e \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u043e\u0441\u0442\u044c \u0438\u043b\u0438 DI \u0432 \u0441\u0432\u043e\u0438\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445, \u0437\u0434\u0435\u0441\u044c \u043e\u043d\u0438 \u0431\u0443\u0434\u0443\u0442 \u0441\u043a\u043e\u0440\u0435\u0435 \u0432\u0441\u0451 \u0436\u0435 \u0438\u0437\u043b\u0438\u0448\u043d\u0438\u043c\u0438, \u043d\u043e \u0437\u0430\u0442\u043e \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u043c\u0438 \u043d\u0435\u043a\u0438\u043c \u043d\u044b\u043d\u0435\u0448\u043d\u0438\u043c \u043a\u043e\u0440\u043f\u043e\u0440\u0430\u0442\u0438\u0432\u043d\u044b\u043c \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u0430\u043c \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043e\u0434\u0430 \u043d\u0430 .NET. \u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u0431\u0430\u0437\u043e\u0432\u043e\u0435 Core Web App \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0447\u0435\u0440\u0435\u0437 Visual Studio 2022. \u042f \u0431\u0443\u0434\u0443 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c .NET 7, \u043d\u043e \u043f\u043e\u0434\u043e\u0439\u0434\u0435\u0442 \u043b\u044e\u0431\u043e\u0439 \u0438\u0437 \u043d\u0438\u0445 \u0441 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u043e\u0439 \u044d\u0442\u0438\u0445 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u0439. \u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0448\u0430\u0431\u043b\u043e\u043d\u0430 \u0432\u044b\u0431\u0440\u0430\u043d ASP.NET Core Web API \u0434\u043b\u044f \u043f\u0440\u043e\u0441\u0442\u043e\u0442\u044b \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u0441\u0432\u044f\u0437\u043a\u0438 \u0441 \u0431\u0443\u0434\u0443\u0449\u0438\u043c \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u043e\u043c.<\/p>\n<figure class=\"full-width\">\n<div><figcaption>\u0428\u0430\u0431\u043b\u043e\u043d \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/figcaption><\/div>\n<\/figure>\n<figure class=\"full-width\">\n<div><figcaption>\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/figcaption><\/div>\n<\/figure>\n<p>\u0414\u043b\u044f \u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430 \u0440\u0430\u0431\u043e\u0442\u044b \u043d\u0435 \u0431\u0443\u0434\u0435\u043c \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u044b \u043f\u043e\u0434 \u0441\u043b\u043e\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f (\u0447\u0442\u043e \u043a\u043e\u043d\u0435\u0447\u043d\u043e \u0436\u0435 \u043e\u0447\u0435\u043d\u044c \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u0442\u0441\u044f \u0432 \u0432\u0430\u0448\u0438\u0445 \u0441\u0435\u0440\u044c\u0435\u0437\u043d\u044b\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u0445). \u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043f\u0430\u043f\u043a\u0438 ClientApp (\u0434\u043b\u044f \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434\u0430, \u0432\u0435\u0440\u043d\u0435\u043c\u0441\u044f \u043a \u043d\u0435\u0439 \u043d\u0438\u0436\u0435 \u0432 \u0441\u0442\u0430\u0442\u044c\u0435), Models \u0438 Repository, \u0438\u0437\u0431\u0430\u0432\u0438\u043c\u0441\u044f \u043e\u0442 WeatherForecast \u043a\u043b\u0430\u0441\u0441\u043e\u0432. \u0412 \u043f\u0430\u043f\u043a\u0443 Models \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u043a\u043b\u0430\u0441\u0441 \u043d\u0435\u043a\u043e\u0433\u043e \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430 \u0441 \u0440\u0430\u0437\u043d\u043e\u043e\u0431\u0440\u0430\u0437\u043d\u044b\u043c\u0438 \u043f\u043e\u043b\u044f\u043c\u0438 (\u0447\u0442\u043e\u0431\u044b \u043f\u043e\u0442\u043e\u043c \u0431\u044b\u043b\u043e \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u0435\u0435 \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u0438\u0445 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0443 \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0430). \u041d\u0430\u0431\u043e\u0440 \u043f\u043e\u043b\u0435\u0439 \u043d\u0435 \u0438\u043c\u0435\u0435\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u044f \u043b\u0438\u0448\u044c \u043f\u043e\u0441\u0442\u0430\u0440\u0430\u043b\u0441\u044f \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0438\u0445 \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0449\u0438\u043c\u0438\u0441\u044f. <\/p>\n<pre><code class=\"cs\">public class Product {     public Guid Id { get; set; }      public string Code { get; set; }      public string Name { get; set; }      public int SortOrder { get; set; }      public bool Enabled { get; set; }      public DateTime ActivationDate { get; set; }   }<\/code><\/pre>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0432 \u043f\u0430\u043f\u043a\u0435 \u0434\u043b\u044f \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f \u043e\u0431\u044a\u044f\u0432\u0438\u043c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 IProductRepository, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0443\u0434\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c 2 \u043c\u0435\u0442\u043e\u0434\u0430. \u041f\u0435\u0440\u0432\u044b\u0439 \u2014 \u0434\u043b\u044f \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u043e\u0442\u0434\u0430\u0447\u0438 \u0432\u0441\u0435\u0439 \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u0438, \u0432\u0442\u043e\u0440\u043e\u0439 \u2014 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c <strong>IAsyncEnumerable<\/strong>. \u0415\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u043e\u0431\u0430 \u043e\u043d\u0438 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d\u044b \u0441 \u0443\u0447\u0435\u0442\u043e\u043c async\/await \u043f\u043e\u0434\u0445\u043e\u0434\u0430 \u0441 \u0442\u043e\u043a\u0435\u043d\u0430\u043c\u0438 \u043e\u0442\u043c\u0435\u043d\u044b \u0438 Task, \u0447\u0442\u043e\u0431\u044b \u0431\u044b\u043b\u043e \u043d\u0430\u0433\u043b\u044f\u0434\u043d\u0435\u0435 \u0438 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u0435\u0435. \u041a\u0430\u0436\u0434\u044b\u0439 \u043c\u0435\u0442\u043e\u0434 \u0442\u0430\u043a\u0436\u0435 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 onlyEnabled, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0434\u043e\u043b\u0436\u0435\u043d \u0437\u0430\u0434\u0430\u0432\u0430\u0442\u044c \u0444\u0438\u043b\u044c\u0442\u0440\u0430\u0446\u0438\u044e \u2014 \u043b\u0438\u0431\u043e \u0432\u0441\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b, \u043b\u0438\u0431\u043e \u0441 Enabled == true.<\/p>\n<pre><code class=\"cs\">public interface IProductRepository {     Task&lt;IReadOnlyCollection&lt;Product>> GetClassicListAsync(bool onlyEnabled, CancellationToken ct = default);     IAsyncEnumerable&lt;Product> GetEnumerableListAsync(bool onlyEnabled, CancellationToken ct = default); }<\/code><\/pre>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e \u044d\u0442\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 ProductRepository, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u043e\u0441\u0442\u043e \u0441 \u0437\u0430\u0434\u0435\u0440\u0436\u043a\u043e\u0439 (\u0441\u043f\u0430\u0441\u0438\u0431\u043e \u043a\u043e\u043c\u0430\u043d\u0434\u0435 await Task.Delay \u0434\u043b\u044f \u0441\u0438\u043c\u0443\u043b\u044f\u0446\u0438\u0438 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u0411\u0414) \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u0443\u044e \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u044e \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432. \u0414\u043b\u044f \u0433\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u043d\u0430\u043f\u0438\u0441\u0430\u043d \u043f\u0440\u0438\u043c\u0438\u0442\u0438\u0432\u043d\u044b\u0439 \u043c\u0435\u0442\u043e\u0434 GenerateProducts, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u043e\u0441\u0442\u043e \u0437\u0430\u043f\u043e\u043b\u043d\u044f\u0435\u0442 \u0432\u0441\u0435 \u043f\u043e\u043b\u044f \u043a\u0430\u043a\u0438\u043c\u0438-\u0442\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438, \u043f\u0440\u0438\u0447\u0435\u043c \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u043b\u043e\u0432\u0438\u043d\u0430 \u0431\u0443\u0434\u0435\u0442 \u0441 Enabled == true. \u041e\u043d \u043d\u0435 \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u044b\u0439, \u0442\u0430\u043a \u0447\u0442\u043e \u0438 \u0434\u043b\u044f GetEnumerableListAsync \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u043e\u0431\u044b\u0447\u043d\u044b\u0439 foreach \u0441 yield return \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043f\u043e\u0441\u043b\u0435 \u0437\u0430\u0434\u0435\u0440\u0436\u043a\u0438. GetClassicListAsync \u0436\u0435 \u0432\u0435\u0440\u043d\u0435\u0442 \u0432\u0441\u044e \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u044e \u043f\u043e\u0441\u043b\u0435 \u043f\u043e\u0442\u0435\u043d\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0439 \u0444\u0438\u043b\u044c\u0442\u0440\u0430\u0446\u0438\u0438 \u0432 LINQ.<\/p>\n<pre><code class=\"cs\">public class ProductRepository : IProductRepository {     \/\/emulate some datasource     private IReadOnlyCollection&lt;Product> GenerateProducts()     {         var retval = new List&lt;Product>();         for (int i = 0; i &lt; 100; i++)         {             var product = new Product()             {                 Id = Guid.NewGuid(),                 Name = $\"Some name for HABR {i}\",                 Code = $\"{Math.Abs(i.ToString().GetHashCode())}\",                 SortOrder = i,                 ActivationDate = DateTime.Today.AddDays(-1 * i),                 Enabled = i % 2 == 0             };             retval.Add(product);         }         return retval.AsReadOnly();     }      public async Task&lt;IReadOnlyCollection&lt;Product>> GetClassicListAsync(bool onlyEnabled, CancellationToken ct = default)     {         ct.ThrowIfCancellationRequested();         \/\/emulate slow connection         await Task.Delay(2000, ct);         return GenerateProducts()             .Where(p => !onlyEnabled || p.Enabled)             .ToList()             .AsReadOnly();     }      public async IAsyncEnumerable&lt;Product> GetEnumerableListAsync(bool onlyEnabled, CancellationToken ct = default)     {         foreach (var product in GenerateProducts())         {             ct.ThrowIfCancellationRequested();             if (!onlyEnabled || product.Enabled)             {                 \/\/emulate slow connection                 await Task.Delay(1000, ct);                 yield return product;             }         }     } }<\/code><\/pre>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u043c API \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440 ProductController \u0434\u043b\u044f \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445 \u044d\u0442\u0438\u0445 \u043e\u0431\u043e\u0438\u0445 \u043c\u0435\u0442\u043e\u0434\u043e\u0432. \u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u0435\u0433\u043e \u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u0438\u0437 \u0448\u0430\u0431\u043b\u043e\u043d\u0430 API Controller \u2014 Empty. \u0414\u043e\u0431\u0430\u0432\u0438\u043c \u0430\u0442\u0440\u0438\u0431\u0443\u0442 \u0434\u043b\u044f \u0440\u043e\u0443\u0442\u0438\u043d\u0433\u0430 \u0441 \u044f\u0432\u043d\u044b\u043c \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435\u043c \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u043c\u0435\u0442\u043e\u0434\u0430 api\/[controller]\/[action] \u0438 \u0447\u0435\u0440\u0435\u0437 DI \u043f\u043e\u0434\u0442\u044f\u043d\u0435\u043c \u043f\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0443 \u043d\u0430\u0448 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439. \u041d\u0430\u0448\u0435 API \u0431\u0443\u0434\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c 2 \u043c\u0435\u0442\u043e\u0434\u0430, \u0434\u043b\u044f \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u0438 \u0434\u043b\u044f  <strong>IAsyncEnumerable<\/strong> \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e. \u041e\u043f\u0443\u0441\u0442\u0438\u043c \u043b\u043e\u0433\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435, \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u043e\u0448\u0438\u0431\u043e\u043a \u0438 \u043f\u0440\u043e\u0447\u0438\u0435, \u0431\u0435\u0437\u0443\u0441\u043b\u043e\u0432\u043d\u043e \u0432\u0430\u0436\u043d\u044b\u0435, \u0430\u0441\u043f\u0435\u043a\u0442\u044b \u0440\u0430\u0431\u043e\u0442\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041a\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c, \u0432\u043c\u0435\u0441\u0442\u043e \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e Task&lt;ActionResult> \u0437\u0434\u0435\u0441\u044c \u044f\u0432\u043d\u043e \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u044f \u0432 \u043c\u0435\u0442\u043e\u0434\u0435 GetAsyncStream.<\/p>\n<pre><code class=\"cs\">[ApiController] [Route(\"api\/[controller]\/[action]\")] public class ProductController : ControllerBase {     public ProductController(IProductRepository rep)     {         _rep = rep;     }      private readonly IProductRepository _rep;      [HttpGet]     public IAsyncEnumerable&lt;Product> GetAsyncStream(bool onlyEnabled, CancellationToken ct)     {         return _rep.GetEnumerableListAsync(onlyEnabled, ct);     }      [HttpGet]     public async Task&lt;ActionResult&lt;IReadOnlyCollection&lt;Product>>> GetList(bool onlyEnabled, CancellationToken ct)     {         var retval = await _rep.GetClassicListAsync(onlyEnabled, ct);         return Ok(retval);     } }<\/code><\/pre>\n<p>\u0414\u0430\u043b\u044c\u0448\u0435 \u0432 ASP \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u043e\u0441\u0442\u0430\u043b\u043e\u0441\u044c \u0434\u043e\u043b\u0433\u043e \u0438 \u043d\u0443\u0434\u043d\u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0432\u0435\u0449\u0435\u0439, \u0431\u043e\u043b\u044c\u0448\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0438\u0437 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0432 Program.cs \u0438 \u0432 csproj \u0444\u0430\u0439\u043b\u0435 \u0441\u0430\u043c\u043e\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u041d\u0435 \u0431\u0443\u0434\u0435\u043c \u043e\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u043d\u0430 \u043a\u0430\u0436\u0434\u043e\u0439 (\u043d\u0430\u0432\u0435\u0440\u043d\u044f\u043a\u0430 \u0435\u0441\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u0438\u0437\u044f\u0449\u043d\u044b\u0435 \u0441\u043f\u043e\u0441\u043e\u0431\u044b), \u043b\u0438\u0448\u044c \u043f\u043e\u0434\u0447\u0435\u0440\u043a\u043d\u0435\u043c \u0441\u0430\u043c\u043e\u0435 \u0432\u0430\u0436\u043d\u043e\u0435. \u041f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0431\u0443\u0434\u0435\u0442 \u0437\u043d\u0430\u0442\u044c \u0447\u0442\u043e \u043e\u043d\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043f\u0440\u0438 \u043e\u0442\u043b\u0430\u0434\u043a\u0435 \u0432 \u0441\u0432\u044f\u0437\u043a\u0435 \u0441 SpaDevelopmentServer, \u0442\u0430\u043a \u0447\u0442\u043e \u0432\u044b\u043d\u0435\u0441\u0435\u043c \u0432 \u0444\u0430\u0439\u043b appsettings.json (\u0432\u0441\u0451 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u043e\u0435 \u0438\u0437 \u043d\u0435\u0433\u043e \u044f \u0443\u0434\u0430\u043b\u0438\u043b) \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0443 VitePortNumber \u0434\u043b\u044f \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u0444\u0440\u043e\u043d\u0442\u0435\u043d\u0434 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 Vite. \u041a \u043d\u0435\u043c\u0443 \u043c\u044b \u0434\u043e\u0431\u0435\u0440\u0435\u043c\u0441\u044f \u0443\u0436\u0435 \u0441\u043a\u043e\u0440\u043e! \u042f \u043f\u043e\u0441\u0442\u0430\u0432\u0438\u043b \u043f\u043e\u0440\u0442 4444, \u0432\u044b \u0432\u043e\u043b\u044c\u043d\u044b \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u043b\u044e\u0431\u043e\u0439 \u0434\u0440\u0443\u0433\u043e\u0439, \u0433\u043b\u0430\u0432\u043d\u043e\u0435 \u0447\u0442\u043e\u0431\u044b \u043e\u043d \u043e\u0442\u043b\u0438\u0447\u0430\u043b\u0441\u044f \u043e\u0442 \u0434\u0435\u0444\u043e\u043b\u0442\u043d\u043e\u0433\u043e \u043f\u043e\u0440\u0442\u0430 \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u0441\u0430\u043c\u043e\u0433\u043e \u043d\u0430\u0448\u0435\u0433\u043e API \u0438\u0437 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. <\/p>\n<pre><code class=\"json\">{   \"VitePortNumber\": 4444 }<\/code><\/pre>\n<p>\u041e\u0431\u043d\u043e\u0432\u0438\u043c \u0444\u0430\u0439\u043b Program.cs \u0447\u0442\u043e\u0431\u044b \u043e\u043d \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u043b \u0432\u0441\u0435 \u0431\u0430\u0437\u043e\u0432\u044b\u0435 \u0432\u0435\u0449\u0438 \u0432\u0440\u043e\u0434\u0435 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u0438, \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u043e\u0432 \u0438 \u043f\u0440\u043e\u0447\u0435\u0433\u043e. \u0421\u043d\u0430\u0447\u0430\u043b\u0430 \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u043f\u0430\u043a\u0435\u0442\u044b \u0447\u0435\u0440\u0435\u0437 Nuget<\/p>\n<ul>\n<li>\n<p>Microsoft.AspNetCore.Authorization<\/p>\n<\/li>\n<li>\n<p>Microsoft.AspNetCore.SpaServices.Extensions<\/p>\n<\/li>\n<li>\n<p>Microsoft.Extensions.Configuration<\/p>\n<\/li>\n<li>\n<p>Microsoft.Extensions.DependencyInjection<\/p>\n<\/li>\n<\/ul>\n<p>\u0417\u0430\u0442\u0435\u043c \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u0432\u0441\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u043a\u043e\u043c\u0430\u043d\u0434\u044b \u0434\u043b\u044f middleware \u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0442\u043e\u0433\u043e, \u0443 \u043d\u0430\u0441 Development (\u0442\u043e\u0433\u0434\u0430 \u0440\u044f\u0434\u043e\u043c \u0437\u0430\u043f\u0443\u0449\u0435\u043d Vite) \u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u0430\u044f \u0441\u0440\u0435\u0434\u0430.<\/p>\n<pre><code class=\"cs\">public static void Main(string[] args) {     var builder = WebApplication.CreateBuilder(args);     string environmentName = Environment.GetEnvironmentVariable(\"ASPNETCORE_ENVIRONMENT\") ?? \"Development\";     var configuration = new ConfigurationBuilder()         .AddJsonFile($\"appsettings.json\")         .AddEnvironmentVariables()         .Build();          var port = configuration.GetValue&lt;int>(\"VitePortNumber\", 4444);         builder.Services.AddAuthentication(IISDefaults.AuthenticationScheme);         builder.Services.AddAuthorization();         builder.Services.AddCors(options =>         {             options.AddDefaultPolicy(builder =>                 builder.SetIsOriginAllowed(_ => true)                     .WithOrigins($\"http:\/\/localhost:{port}\")                     .AllowAnyMethod()                     .AllowAnyHeader()                     .AllowCredentials());         });         \/\/ Add services to the container.         builder.Services.AddControllers()             .AddJsonOptions(options => options.JsonSerializerOptions.PropertyNameCaseInsensitive = true);         builder.Services.AddEndpointsApiExplorer();         builder.Services.AddHttpContextAccessor();         \/\/DI         builder.Services.AddScoped&lt;IProductRepository, ProductRepository>();         if (builder.Environment.IsStaging() || builder.Environment.IsProduction())         {<\/code><\/pre>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-356199","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/356199","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=356199"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/356199\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=356199"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=356199"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=356199"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}