慕絲7291255
2022-08-18 16:39:27
當我嘗試在Netlify上托管項目時,我在Github中的存儲庫中遇到了一些困境。該項目包括一個名為的文件,并在兩個 HTML 頁上引用。它包括一些變量和一個用于存儲我的Google Maps API密鑰的函數,所以我創建了一個.gitignore文件來將其隱藏在我的Github存儲庫中。問題是,現在我已經在Netlify中部署了它,我不確定如何引用配置.js作為環境變量或類似的東西,以便Netlify能夠在呈現網站時找到我的Google Maps API密鑰?,F在,該網站呈現,但它不能完全工作,因為我遇到了錯誤,因為Netlify看不到我的配置.js文件。config.js您將在下面看到我的文件結構,包括 .gitignore 命令和我的 config.js它存儲 Google Maps API 密鑰,其中包含以下變量和函數調用:let head = document.getElementsByTagName("head").item(0);let script = document.createElement("script");script.setAttribute("type", "text/javascript");script.setAttribute( "src", "<MY GOOGLE MAPS API KEY>");head.appendChild(script);我的問題是,我如何引用上面的變量,這些變量將我的API密鑰存儲在Netlify上的環境變量中?或者,有沒有辦法只允許Netlify訪問config.js文件而不在Github中公開它?Netlify上有一些關于部署密鑰和子模塊的文檔,但我不明白這部分文檔,我不確定它們是否與我的問題相關。
1 回答

蕪湖不蕪
TA貢獻1796條經驗 獲得超7個贊
如前所述,您可以將要作為靜態站點的一部分包含的變量添加到 Netlify 的環境變量中。這使它們遠離Git存儲庫。
棘手的部分是將這些變量從Netlify構建環境中取出并放入您的源代碼中。您至少有兩個不同的選項,具體取決于變量的敏感程度:
如果你不希望你的變量被簽入 Git,但你可以將它們嵌入到你的公共 Javascript/HTML 文件中(Google Maps API 密鑰可能屬于這一類),你可以使用像 Webpack 這樣的構建工具將環境變量注入到源代碼中。如果你使用的是 React 或其他框架,他們通常有辦法包含構建環境中的環境變量。如果不是,則可能只需要編寫自定義生成腳本或利用預構建的 NPM 包在生成時將小包注入到 HTML 頁面中。實際上,看起來Netlify可以在您的頁面中注入一些自定義腳本。也許你可以試試。
<script>var myVar = "<myEnvironmentVariableValue>";</script>
如果您的變量更敏感,并且您不希望它們公開,則需要添加實際的服務器端組件。這可能與無服務器API或標準單調Web服務器一樣花哨。然后,當您的前端需要此秘密變量時,它會連接到服務器并請求它,大概是從您網站的經過身份驗證的部分。這樣可以將變量排除在公共HTML / JS之外,但仍然允許您的網站按需訪問它們。
添加回答
舉報
0/150
提交
取消