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:
Ngăn chặn các yêu cầu trùng lặp trong ASP.NET Core
Trung Nguyen 24/10/2021
Ngăn chặn các yêu cầu trùng lặp trong ASP.NET Core

Bài viết này sẽ trình bày một kỹ thuật đơn giản phía server để giảm các yêu cầu trùng lặp của người dùng trong khi vẫn giữ trải nghiệm hài lòng cho họ.

Yêu cầu phạm vi và phản hồi một phần trong ASP.NET Core
Trung Nguyen 22/10/2021
Yêu cầu phạm vi và phản hồi một phần trong ASP.NET Core

Trong bài viết này, chúng ta sẽ thấy ba cách để xử lý các yêu cầu phạm vi HTTP (HTTP range request), những lợi ích mà chúng ta sẽ thấy khi sử dụng chúng.

Chuyển hướng đơn giản với ASP.NET Core Endpoint
Trung Nguyen 21/10/2021
Chuyển hướng đơn giản với ASP.NET Core Endpoint

Trong bài viết này, chúng ta sẽ thêm một số phương thức mở rộng vào interface IEndpointRouteBuilder để giúp việc lập bản đồ chuyển hướng trở nên dễ dàng.

Tăng hiệu suất ASP.NET Core với nội dung tĩnh
Trung Nguyen 20/10/2021
Tăng hiệu suất ASP.NET Core với nội dung tĩnh

Trong bài viết này, chúng ta sẽ xem cách sử dụng môi trường lưu trữ của ASP.NET Core để tạo các trang tĩnh từ nội dung động của chúng ta.