首頁 > web前端 > js教程 > 主體

如何解決nodejs的路徑問題

不言
發布: 2018-06-30 15:13:46
原創
2010 人瀏覽過

這篇文章主要介紹了nodejs的路徑問題的解決,內容還挺不錯的,現在分享給大家,也給大家做個參考。

最近公司的一個開發項目,後端用的是nodejs。這兩天需要打包給客戶示範,就請公司一個小夥把之前3D機房的打包工具移植過來。打包之後,發現原本在開發環境下的跑的好好的項目,不能訪問了。出現專案的首頁無法存取的問題:

can not get file index.html

express.static

#問題出在哪裡?

nodejs後端的用了express,index.html是一個靜態檔案。我們知道,透過 Express 內建的 express.static 可以方便地託管靜態文件,例如圖片、CSS、JavaScript 文件等。

將靜態資源檔案所在的目錄作為參數傳遞給 express.static 中間件就可以提供靜態資源檔案的存取了。例如,假設在public 目錄放置了圖片、CSS 和JavaScript 文件,可以使用以下程式碼:

 app.use(express.static('public'));
登入後複製

所以,找到專案中的程式碼,查看static呼叫的地方,和上面一行程式碼很一樣:

 app.use(express.static('public'));
登入後複製

到此,我已經發現了問題,我告訴小夥伴,這個地方不用相對路徑可以解決這個問題。由於打包時間限制,我讓小夥伴先簡單處理下,打完包包之後,在來整理下思路:

app.use(express.static('resource/public'));
登入後複製

當然最重要的是,這個問題其實不難,自己多鑽研下,很容易發現問題,也就不會出這個問題,所以小夥伴自己打手心吧。

恩,你沒看錯,這個地方還是相對目錄。後續產品中會改成比較好的一種狀況。

express.static方法解析

#事實上,express.static方法如果傳入的是相對路徑,express會自己把他轉換為絕對路徑,我們可以查看下原始碼,在express.js找到如下程式碼:

exports.static = require('serve-static');
登入後複製

說明static 呼叫了serve-static這個包,直接找到這個包,查看index.js, 可以看到程式碼,下面列出重要的兩行

 ...
var resolve = require('path').resolve
...
opts.root = resolve(root)
...
登入後複製

這兩行就是,express把相對目錄轉換成絕對目錄的程式碼,可以看出,最終使用的path這個內建物件的resolve方法,繼續往下看。

path物件的resolve方法

#直接查看這個方法的api文檔,如下:https://nodejs.org/api/path .html#path_path_resolve_paths

##以下是這個方法的解釋:


##The path.resolve() method resolves a sequence of paths or path segments into an absoluteolves a sequence of paths or path segments into an absolute path.


啥意思呢?就是這個方法把一系列的paths或path segments 組織成一個絕對路徑,比如
 path.resolve('/foo','bar');
// return /foo/bar
登入後複製

詳細的說明請自行參考文檔,這個地方有一句話需要特別注意:


If after processing all given path segments an absolute path has not yet been generated, the current working directory is used.


啥,就是如果處理了所有的path 如何處理了,也沒有產生一個絕對路徑, 就要使用當前工作目錄(current working directory)。例如:
 path.resolve('bar');
// 加上 /Users/terry 是当前工作目录, return /Users/terry/bar
登入後複製

api文檔中一個比較複雜的範例(此處注意resolve的時候,從右到左,參考文件了解詳情):

path.resolve('wwwroot', 'static_files/png/', '../gif/image.gif');
// if the current working directory is /home/myself/node,
// this returns '/home/myself/node/wwwroot/static_files/gif/image.gif'
登入後複製

現在的問題是,啥是目前工作目錄。


nodejs 目前工作目錄 current working directory


nodejs 目前工作目錄是啟動Node的目錄。也就是說,從哪個目錄進去啟動node,就回傳哪個目錄。 

注意,這個目錄不是指js檔案所在的目錄


透過process.cwd()方法可以取得目前工作目錄。


下面透過一個範例來介紹這個目前工作目錄,假如在/Users/terry/Documents/JSWorkspace目錄下寫一個js文件,test.js,程式碼只有一行:

console.log(process.cwd());
登入後複製

此時如果,在目錄/Users/terry/Documents/JSWorkspace下面執行命令:node test.js 輸出如下:

 /Users/terry/Documents/JSWorkspace
登入後複製

但是如果在目錄/Users/terry/Documents/下面執行命令: node ./JSWorkspace/test.js,輸出的結果是:

/Users/terry/Documents
登入後複製

因此可以看出你在那個目錄執行node指令,目前目錄就是那個目錄。


回到之前的打包的問題,由於在開發階段,一般都是直接在js檔案所在目錄執行node指令,所以相對目錄寫的是相對於目前js檔案的目錄沒有問題。


可是打包之後,node的執行放到了js目錄的上一層去了。此時相對目錄「public」不在是相對於js檔案的相對目錄,而是相對於上一層的,自然就找不到這個資料夾了,從而也找不到該資料夾下的index.html文件。


如何解決

#解決的方法:

1.在前面已经说过了,改这个相对目录。但这种方法很蹩脚。因为,启动node命令的目录可能会变;而是如果这应该,开发阶段的node命令执行也需要跟着改。 总之不是兼容性很好的方法。

2.直接使用绝对路径。 但是这个绝对路径在不同的机器上又不一样,该如何解决呢?可以考虑使用全局变量__dirname.

全局变量__dirname

查看api文档 https://nodejs.org/api/modules.html#modules_dirname

看到解释如下:

The directory name of the current module. This is the same as the path.dirname() of the __filename。

啥意思呢,及时返回nodejs 的js文件的所在目录。

有了这个变量之后,我们就可以用如下代码解决这个问题。

app.use(express.static(__dirname + '/public'));
登入後複製

以上就是本文的全部内容,希望对大家的学习有所帮助,更多相关内容请关注PHP中文网!

相关推荐:

Node.js中路径处理模块path的介绍

如何在NodeJS项目中使用ES6

以上是如何解決nodejs的路徑問題的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板