NextJS - ตั้งค่าตัวแปรสภาพแวดล้อมแบบไดนามิกเมื่อเริ่มต้นแอปพลิเคชัน

คุณสามารถใช้ publicRuntimeConfig ในไฟล์ next.config.js ของคุณได้

ตัวอย่าง:

// next.config.js
module.exports = {
  serverRuntimeConfig: { // Will only be available on the server side
    mySecret: 'secret'
  },
  publicRuntimeConfig: { // Will be available on both server and client
    staticFolder: '/static',
    mySecret: process.env.MY_SECRET // Pass through env variables
  }
}

โปรดทราบว่าตอนนี้ค่าของ publicRuntimeConfig.mySecret ได้รับการดึงมาจากตัวแปรสภาพแวดล้อม ตอนนี้คุณสามารถอ่านค่านั้นได้โดยการนำเข้าใน next/config

ตัวอย่าง:

import getConfig from 'next/config';

const { publicRuntimeConfig } = getConfig();
console.log(publicRuntimeConfig.mySecret);

แหล่งที่มา: next.js เอกสาร