File tĩnh trong ASP.NET Core

Ở đây, chúng ta sẽ tìm hiểu cách phục vụ các file tĩnh như html, JavaScript, CSS hoặc các file hình ảnh theo yêu cầu HTTP mà không cần xử lý phía máy chủ.

Ứng dụng ASP.NET Core không thể phục vụ các file tĩnh theo mặc định. Chúng ta phải thêm middleware Microsoft.AspNetCore.StaticFiles vào đường ống yêu cầu.

Bạn có thể truy cập Hướng dẫn lập trình ASP.NET Core để không bỏ lỡ bất kỳ bài viết nào của chúng tôi.

Cài đặt middleware StaticFiles

Gói middleware Microsoft.AspNetCore.StaticFiles đã được thêm vào trong gói Microsoft.AspNetCore.All, vì vậy chúng tôi không cần phải cài đặt nó một cách riêng biệt trong ứng dụng ASP.NET 2.x Core.

Để cài đặt middleware StaticFiles thủ công trong ứng dụng ASP.NET Core, bạn mở Manage NuGet Packages.. bằng cách nhấp chuột phải vào project trong solution explorer và chọn Manage NuGet Packages ... Tìm kiếm StaticFiles trong hộp tìm kiếm trong tab Browse. Điều này sẽ hiển thị middleware Microsoft.AspNetCore.StaticFiles như dưới đây.

Cài đặt middleware StaticFiles trong ASP.NET Core

Nhấp vào nút Install trên khung bên phải để cài đặt nó. Sau khi cài đặt Microsoft.AspNetCore.StaticFiles, nó sẽ tự động được thêm vào phần phụ thuộc của project.

Middleware StaticFiles trong

Sử dụng middleware StaticFiles

Theo mặc định, tất cả các file tĩnh của ứng dụng web phải được đặt trong thư mục gốc wwwroot . Để hiểu điều này, hãy tạo một file default.html đơn giản trong thư mục wwwroot với nội dung sau.

File Default.html trong thư mục wwwroot

Bây giờ, để phục vụ file tĩnh default.html ở trên, chúng ta phải thêm middleware StaticFiles vào phương thức Configure() của lớp Startup như dưới đây.

public class Startup
{
    public Startup()
    {
    } 
 
    public void Configure(IApplicationBuilder app, IHostingEnvironment env)
    {
        app.UseStaticFiles();

        app.Run(async (context) =>
        {
            await context.Response.WriteAsync("Hello World");
        });
    }
}

Như bạn có thể thấy ở trên, phương thức app.UseStaticFiles() thêm middleware StaticFiles vào đường ống yêu cầu. UseStaticFiles là một phương thức mở rộng có trong middleware StaticFiles để chúng ta có thể dễ dàng cấu hình nó.

Bây giờ, hãy nhấn F5 để chạy project, trình duyệt mở lên và bạn gõ địa chỉ http://localhost:<port>/default.html sẽ hiển thị file default.html như hình dưới đây.

Truy cập file HTML tĩnh trong ASP.NET Core

Bằng cách này, chúng ta có thể phục vụ bất kỳ file nào được lưu trữ trong thư mục wwwroot hoặc thư mục con của nó mà không cần phải xử lý ở phía máy chủ. Chẳng hạn như file javascript, css, images, web fonts, ...

ASP.NET Core MVC
Bài Viết Liên Quan:
Tạo liên kết đến các endpoint của ASP.NET Core
Trung Nguyen 02/11/2021
Tạo liên kết đến các endpoint của ASP.NET Core

Trong bài viết này, chúng ta sẽ tìm hiểu cách đặt tên cho các endpoint để có thể tạo liên kết đến chúng từ bất kỳ đâu trong ứng dụng ASP.NET Core.

Cách thêm model vào dự án ASP.NET Core
Trung Nguyen 31/10/2021
Cách thêm model vào dự án ASP.NET Core

Trong bài viết này, chúng ta sẽ khám phá Model trong ASP.NET Core và các sub-framework khác như ASP.NET Core MVC, Razor Pages, Endpoints và Blazor.

Sử dụng Svelte trong dự án ASP.NET Core
Trung Nguyen 30/10/2021
Sử dụng Svelte trong dự án ASP.NET Core

Bài viết này sẽ giới thiệu cho bạn những điều cơ bản về việc thiết lập một dự án ASP.NET Core để sử dụng các component Svelte phía máy khách.

Background Service trong ASP.NET Core
Trung Nguyen 28/10/2021
Background Service trong ASP.NET Core

Bài viết này hướng dẫn cách triển khai một background service trong ứng dụng ASP.NET Core và cách giao tiếp với background service từ một HTTP request.