Cấu hình môi trường an toàn trong Angular

Mar 22 2022
Cách định cấu hình môi trường An toàn loại trong Angular
Angular là về các phương pháp hay, Angular là về TypeScript. Đương nhiên, các nhà phát triển thích hầu hết những thứ đã nhập.
Ảnh của Markus Spiske trên Unsplash

Angular là về các phương pháp hay, Angular là về TypeScript. Đương nhiên, các nhà phát triển thích hầu hết những thứ đã nhập. Một ngoại lệ là environment.tstệp. Nhưng tại sao nó vẫn không được định kiểu? Hãy làm cho nó có thể dự đoán được.

Bước 1: Giao diện

Tạo giao diện cho cấu hình môi trường. Để trình diễn, chúng tôi có một giao diện rất đơn giản. Nhưng vui lòng bao gồm các mục khác theo nhu cầu của bạn.

app-config.ts

Đi tới tệp môi trường của bạn và sử dụng giao diện:

môi trường.ts

Bước 2: Mã thông báo tiêm

Để đưa AppConfiggiá trị vào, chúng ta cần tạo một mã thông báo mà Angular sẽ sử dụng để tra cứu. Bạn có thể coi đây là một mã định danh duy nhất. Mã thông báo này sẽ cho Angular biết những gì cần cung cấp.

app-config.ts

Bước 3: Nhà cung cấp

Vì cấu hình môi trường đảm bảo được đưa vào ở giai đoạn đầu tiên, chúng tôi sẽ cung cấp các giá trị tại AppModule đó thường là mô-đun gốc của ứng dụng.

app.module.ts

Bước-4: Sử dụng

Bây giờ bạn có thể sử dụng các giá trị môi trường ở bất cứ đâu bạn cần. Ví dụ trong một dịch vụ REST:

tài sản.service.ts

Nếu bất cứ lúc nào bạn viết sai cấu hình hoặc xóa một thuộc tính khỏi đối tượng môi trường, bạn sẽ nhận được cảnh báo IDE và các cảnh báo phòng ngừa khác. Mát lạnh!

Phần thưởng: Sử dụng các biến môi trường trong Angular

Ứng dụng giao diện người dùng của bạn có thể chứa một số bí mật như URL điểm cuối API, khóa công khai, mã thông báo, v.v. Trong Angular, bạn có thể quản lý chúng trong tệp môi trường. Các cấu hình đó có thể khác nhau dựa trên các giai đoạn xây dựng, chẳng hạn như - phát triển, thử nghiệm và sản xuất. Angular thay thế điều đó bằng tệp cụ thể cho giai đoạn tương ứng đó. Khá thẳng thắn! Tuy nhiên, bạn có thể gặp phải những tình huống mà bạn không muốn tiết lộ những bí mật đó bằng cách mã hóa cứng, thay vì chọn chúng từ ENV_VARS.một Tình huống khác có thể là bạn không muốn giao các tệp môi trường chứa thông tin nhạy cảm cho kiểm soát phiên bản (git ).

Trong trường hợp như vậy, bạn có thể sử dụng một tập lệnh Node.js nhỏ để tạo tệp môi trường của bạn trong thời gian xây dựng.

Tạo tệp JavaScript make-env-file.jsở gốc của dự án:

make-env-file.js
  • Đảm bảo rằng tên tệp chính xác và đường dẫn trỏ đến tệp cấu hình môi trường dự kiến ​​của bạn.
  • Sửa đổi getContent()phương pháp để bao gồm tất cả các cấu hình.
  • Cập nhật các package.jsonlệnh để sử dụng tập lệnh đã tạo trước khi xây dựng tạo tác góc sản xuất.
  • package.json

Cảm ơn vì đã đọc!

Mã đầy đủ:

Nội dung khác tại PlainEnglish.io . Đăng ký nhận bản tin hàng tuần miễn phí của chúng tôi . Theo dõi chúng tôi trên TwitterLinkedIn . Tham gia cộng đồng Discord của chúng tôi .

© Copyright 2021 - 2023 | vngogo.com | All Rights Reserved