Hướng dẫn deploy ứng dụng ReactJS lên IIS server

1. Chuẩn bị môi trường

Đầu tiên, việc cần làm là folder build hoặc source code của dự án ReactJS. Nên dùng folder build của dự án ReactJS, phần folder build này là do bên team FE cung cấp. Trong trường hợp nếu không có folder build mà chỉ có folder source code thì xem link sau: https://www.freecodecamp.org/news/how-to-build-a-react-project-with-create-react-app-in-10-steps/

2. Deploy lên IIS Server

2.1 Tạo website trên IIS Server

Nếu chưa tạo website trên IIS Server thì có thể tạo website trên IIS, tại đây thì nhấn vào Add Website > Điền thông tin > Chọn folder build.

2.2 Chuẩn bị file Web.config

Trong khi deploy ứng dụng trên IIS Server thì bắt buộc các folder build mà IIS trỏ đến thì phải có file Web.config. Nếu chưa hiểu file Web.config là gì thì có thể xem thông tin sau: https://learn.microsoft.com/en-us/aspnet/core/host-and-deploy/iis/web-config

Trong bài viết này chỉ tập trung đến project ReactJS, nên file config sẽ có nội dung sau:

<?xml version="1.0" encoding="UTF-8"?>

<configuration>

<system.webServer>

<rewrite>

<rules>

<rule name="React Routes" stopProcessing="true">

<match url=".*" />

<conditions logicalGrouping="MatchAll">

<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />

<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />

<add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />

</conditions>

<action type="Rewrite" url="/" />

</rule>

</rules>

</rewrite>

        <caching enabled="false" enableKernelCache="false" />

        <staticContent>

            <clientCache cacheControlMode="UseMaxAge" cacheControlMaxAge="00:00:01" />

<!-- required for apple-app-site-association: -->

  <mimeMap fileExtension="." mimeType="application/json" />

        </staticContent>

</system.webServer>

</configuration>

 

Lưu ý file web.config này phải đặt đúng ở folder build mà IIS mapping tới.

3. Lưu ý

Ở phần deploy này cần chú ý về permission, nếu khi chạy ứng dụng web mà hiển thị permission là 403, thì cần add permission trong folder build cho IIS, với user là: IIS_IUSRS
Với 3 permission default là: Read & Execute, List, Read.
Theo dõi
Thông báo của
guest
0 Góp ý
Phản hồi nội tuyến
Xem tất cả bình luận
spot_img

Có thể bạn sẽ thích

11 quy tắc quan trọng trong thiết kế Cơ...

Quy tắc 1: Bản chất của ứng dụng (OLTP hoặc OLAP) là gì? Khi bạn bắt đầu thiết...

2024 rồi, Flutter vs React Native: Chọn framework nào...

Cuộc “cạnh tranh” giữa các framework mobile đang trở nên “nhiệt” hơn bao giờ hết. Nhất là...

Hướng dẫn tích hợp xác thực vào Gitbook.

1. Gitbook là gì? Gitbook là một công cụ mạnh mẽ cho việc tạo, quản lý và chia sẻ...