Rumah > hujung hadapan web > tutorial js > Mengapa anda perlu sentiasa menambah jenis keselamatan pada pembolehubah persekitaran anda?

Mengapa anda perlu sentiasa menambah jenis keselamatan pada pembolehubah persekitaran anda?

Mary-Kate Olsen
Lepaskan: 2024-09-24 06:25:02
asal
674 orang telah melayarinya

Sedikit latar belakang

Jika anda telah membuat pengekodan untuk seketika, anda tahu kepentingan pembolehubah persekitaran dan peranan yang dimainkannya, dan juga kesakitan untuk mengetahui pepijat yang disebabkan hanya kerana pembolehubah env sialan tidak ditetapkan dalam projek anda , hihihi!

Awal tahun ini, saya bekerja di syarikat permulaan berasaskan produk sebagai pelatih pembangun tindanan penuh. Apabila projek berkembang, bilangan pembolehubah env juga meningkat. Dan, semua orang sedang mengusahakan ciri berasingan pada cawangan berasingan, jadi kami tidak tahu jika seseorang memperkenalkan beberapa pembolehubah env baharu dalam cawangan mereka yang kemudiannya digabungkan ke dalam cawangan utama. Ini menimbulkan masalah apabila saya cuba menggunakan cawangan saya, saya tahu bahawa env var baharu telah ditambahkan pada projek itu.

Kemudian, kemudian saya diperkenalkan kepada tindanan T3 dan ia mempunyai penyelesaian yang cemerlang untuk menambahkan keselamatan jenis pada pembolehubah env. Saya tidak tahu penyelesaian sedemikian wujud. Ia sentiasa berasa baik untuk mempelajari sesuatu yang baru apabila anda tidak menjangkakannya. Tindanan T3 menggunakan pakej zod dan @t3-oss/env-nextjs untuk menambah keselamatan jenis pada aplikasi anda yang saya sangat suka. Selepas itu, saya membuat komitmen untuk sentiasa menaip-selamat pembolehubah env saya tidak kira apa.

Jika anda memulakan projek baharu atau sudah bekerja dalam satu pasukan, saya amat mengesyorkan anda untuk menambah keselamatan jenis pada env anda. Menambahkan ini sahaja akan menjimatkan usaha anda untuk memikirkan masalah dalam pangkalan kod anda.

Berikut’ cara anda boleh menambahkannya pada projek anda. Ia agak mudah.

Apa itu zod?

Zod ialah pustaka pengisytiharan skema dan pengesahan yang ringan, pantas, dan. Skema boleh menjadi apa sahaja daripada rentetan ringkas, nombor kepada jenis objek kompleks.

Penggunaan asas

import {z} from 'zod';

const myBoolean = z.boolean();

myBoolean.parse('true'); // throws error
myBoolean.parse(true) // valid

Salin selepas log masuk

Mencipta skema objek bersarang

import { z } from 'zod';

const userSchema = z.object({
    name: z.string(),
    age: z.number(),
    address: z.object({
        house_no: z.string(),
        locality: z.string(),
        city: z.string(),
        state: z.string(),
    })
});
Salin selepas log masuk

Anda boleh mencipta skema objek mudah atau mencipta skema objek bersarang.

Apakah t3-oss/env-nextjs?

Ia hanyalah pakej yang akan membantu kami menambah jenis keselamatan pada pembolehubah env

Mari buat pembolehubah env selamat jenis

Buat fail env.js pada akar projek anda.

import {createEnv} from "@t3-oss/env-nextjs"; import {z} from "zod";

export const env = createEnv({
  /*
   * Serverside Environment variables, not available on the client.
   * Will throw if you access these variables on the client.
   */
  server: {
    DB_URI: z.string().url(),
  },
  /*
   * Environment variables available on the client (and server).
   *
   * You'll get type errors if these are not prefixed with NEXT_PUBLIC_.
   */
  client: {
    NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY: z.string().min(1),
  },
  /*
   * Due to how Next.js bundles environment variables on Edge and Client,
   * we need to manually destructure them to make sure all are included in bundle.
   *
   * You'll get type errors if not all variables from `server` & `client` are included here.
   */
  runtimeEnv: {
    DB_URI: process.env.DATABASE_URL,
    NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY:
      process.env.NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY,
  },
});
Salin selepas log masuk

Penggunaan

import {env} from '@/env';

const CLERK_PUBLISHABLE_KEY = env.NEXT_PUBLISHABLE_KEY;

Salin selepas log masuk

Jika anda menuding kursor anda di atas NEXT_PUBLISHABLE_KEY, anda boleh melihat bahawa nilai itu ditaip sebagai rentetan, itu bermakna pembolehubah env kami ditaip sekarang.

Kami telah menambah jenis pembolehubah env selamat, tetapi ini tidak akan dijalankan pada setiap masa binaan. kami perlu mengimport fail kami yang baru dibuat ke dalam fail next.config.js kami. Anda boleh menggunakan pakej unjs/jiti untuk itu.

Mula-mula, pasang pacakge jiti daripada npm.

import { fileURLToPath } from "node:url";
import createJiti from "jiti";
const jiti = createJiti(fileURLToPath(import.meta.url));

jiti("./app/env");
Salin selepas log masuk

Apabila bekerja dengan import.meta.url, ia menyediakan URL fail yang sedang anda kerjakan. Walau bagaimanapun, ia termasuk awalan fail:///, yang mungkin anda tidak mahu. Untuk mengalih keluar awalan itu, anda boleh menggunakan fungsi fileURLToPath daripada modul node:url.

Contohnya:

import {fileURLToPath} from 'node:url';

// Convert the file URL to a path
const filename = fileURLToPath(import.meta.url);

Salin selepas log masuk

Sekarang, jika anda tidak mempunyai pembolehubah env yang diperlukan, anda akan melihat ralat seperti ini -

Why you should always add type safety to your environment variables?

Bagaimana untuk menambah jenis-keselamatan pada pembolehubah env dalam Projek Node.js?

import dotenv from "dotenv";
import { z } from "zod";

dotenv.config();

const schema = z.object({
  MONGO_URI: z.string(),
  PORT: z.coerce.number(),
  JWT_SECRET: z.string(),
  NODE_ENV: z
    .enum(["development", "production", "test"])
    .default("development"),
});

const parsed = schema.safeParse(process.env);

if (!parsed.success) {
  console.error(
    "❌ Invalid environment variables:",
    JSON.stringify(parsed.error.format(), null, 4)
  );
  process.exit(1);
}

export default parsed.data;

Salin selepas log masuk

Dalam projek Node.js, kami hanya akan mencipta skema zod dan menghuraikannya terhadap process.env kami untuk menyemak sama ada semua pembolehubah env ditetapkan atau tidak.

Penggunaan

import express from "express";
import env from "./env";

const app = express();
const PORT = env.PORT || 5000; // PORT is type safe here....

app.listen(PORT, () => {
console.log("Connected to server on PORT ${PORT}");
connectDB();
});

Salin selepas log masuk

Begitulah anda menambahkan keselamatan jenis pada pembolehubah env anda. Saya harap anda mempelajari sesuatu yang baharu dalam tutorial ini.

Selamat Mengekod!! ?

Atas ialah kandungan terperinci Mengapa anda perlu sentiasa menambah jenis keselamatan pada pembolehubah persekitaran anda?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan