iT邦幫忙

2022 iThome 鐵人賽

DAY 15
0
Modern Web

使用 Vue 3 從 0 到 1 架設網站!!!系列 第 15

Deno 程式讀取環境設定檔 .env

  • 分享至 

  • xImage
  •  

一般在架設網站的時候,都會有所謂的環境設定檔,常見的檔名為 .env,當然也有可能是其它的。

環境設定檔做什麼?

環境設定檔最主要的用途,就是用來儲存一些設定類的東西,例如資料庫連線資訊、帳密等。
而且環境設定檔通常不會進版本控管,因為不同的主機環境(例 production 環境、staing 環境等),會有不同的設定;而且環境設定檔通常也是機密資訊,也不應放到 github 之類的平台。


建立環境設定檔 .env

在我的 webmix_api 資料夾下,建立 .env 檔案,內容如下(# 字號那行是註解的意思。然後可放入對應的資料):

# DATABASE
HOSTNAME=主機名稱
USERNAME=資料庫的帳號
DB=資料庫名稱
DB_PASSWORD=資料庫密碼
PORT=資料庫埠號

那麼原來 resolvers.ts 檔案,有資料庫的連線資訊,所以要改成是讀取 .env 的內容。

然而呢,使用 docker 的方式,跟一般執行 deno run 指令,會不太一樣,所以以下也分兩種方式。


第一種:若有使用 docker

更新 resolvers.ts 檔案,將以下的程式:

const client = await new Client().connect({
  hostname: "資料庫主機",
  username: "資料庫帳號",
  db: "資料庫名稱",
  password: "資料庫密碼",
  port: 資料庫埠號
});

更改成:

const client = await new Client().connect({
  hostname: Deno.env.get("HOSTNAME"),
  username: Deno.env.get("USERNAME"),
  db: Deno.env.get("DB"),
  password: Deno.env.get("DB_PASSWORD"),
  port: parseInt(Deno.env.get("PORT"))
});

所以讀取 .env 檔的方式,就是 Deno.env.get() 這樣的方式即可。

當然還有 container 需重新建立,將原來的 container 刪掉,然後執行以下指令來重新建立:

docker run --env-file ./.env -it -p 8080:8080 --name webmix_api -v $PWD:/app denoland/deno:alpine run --allow-net --allow-read --allow-env --watch /app/graphql.ts

主要是多了 --env-file ./.env 指定環境設定檔 .env;還有多了 --allow-read--allow-env,也就是允許讀取檔案、允許使用環境變數。

這樣就完成了。


第二種:沒有使用 docker

更新 resolvers.ts 檔案,該檔的最上方加入以下的程式:

import { config } from "https://deno.land/std@0.155.0/dotenv/mod.ts";

const configData = await config({
  export: true,
  allowEmptyValues: true,
});

然後一樣原來的以下程式:

const client = await new Client().connect({
  hostname: "資料庫主機",
  username: "資料庫帳號",
  db: "資料庫名稱",
  password: "資料庫密碼",
  port: 資料庫埠號
});

更改成:

const client = await new Client().connect({
  hostname: Deno.env.get("HOSTNAME"),
  username: Deno.env.get("USERNAME"),
  db: Deno.env.get("DB"),
  password: Deno.env.get("DB_PASSWORD"),
  port: parseInt(Deno.env.get("PORT"))
});

然後重新啟動,就執行以下指令:

deno run --allow-net --allow-read --allow-env --watch ./graphql.ts

主要是多了 --allow-read--allow-env,也就是允許讀取檔案、允許使用環境變數。

這樣就完成了。


再開啟 GraphQL 環境

再開啟 GraphQL API 的執行環境,測試看看是否一樣能夠正常執行喔,如下圖,有正常:

https://ithelp.ithome.com.tw/upload/images/20220915/20069901MThhmXxsBX.png

然後我也再測試,刻意的把環境設定檔 .env 裡的資料庫密碼打錯,然後再測試,如果是用 docker 的話,容器 container 要刪掉再重新建立;如果沒有使用 docker,那麼就重新執行 docker run 指令即可。

下圖是資料庫密碼刻意打錯,出現的錯誤訊息:

https://ithelp.ithome.com.tw/upload/images/20220915/2006990167q4rEOUks.png


結語

讀取環境設定檔(.env)也讓我測了許久,主要是使用 docker 要加上 --env-file 的部份。不過總算是又打通了一個關卡。


上一篇
Vite + Vue3 建立頁面 - 首頁微調、建立註冊頁面、規劃註冊流程
下一篇
使用 Deno 建立資料庫 migration 檔
系列文
使用 Vue 3 從 0 到 1 架設網站!!!30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言