当路径为/reset_page/jwt.token.here时,JS文件的相对路径将更改。

在我更改此项之前,应用程序一直运行良好:

app.use(express.static("dist"));  

app.get(["/", "/page_1", "/page_2"], api_pages_get);

为此(我在第二行添加了一条路径):

app.use(express.static("dist"));

app.get(["/", "/page_1", "/page_2", "/reset_page/:reset_password_token"], api_pages_get);

现在,前端HTML没有加载所需的JS文件,因为它引用了以下内容:

http://localhost:3000/reset_page/js/bundle.js

而不是这样:

http://localhost:3000/js/bundle.js

因此,出于某种原因,它向相对路径添加了一个目录。

chrome dev tools中的特定错误消息是:

加载资源失败:服务器响应状态为404 (未找到)拒绝从执行脚本 ’ http://localhost:3000/reset_page/js/bundle.js '因为它的mime类型 ('text/html')不是可执行文件,严格的mime类型检查是 启用。

JWT令牌的格式为:

eyJhbGciOiJIUzI1TiIsInR5cCI6IkpXVCJ0.eyJ1c2VySWQiOjEsImlhdCI6MTUzNDgzMzgyNn5.M8P0Xt92rKVmOximyyjgFISZc8hGFZA3eQjloRHGksB

也许是一个愚蠢的想法,但是JWT令牌中的“点”是否会在某种程度上混淆表达?

编辑

如果相关,我将使用 simple templating engine 示例,如下所述:

https://expressjs.com/en/advanced/developing-template-engines.html

res.render('index', { page_html: page_html, page_tagline: page_tagline });

app.engine('ntl', function(filePath, options, callback) { 
    fs.readFile(filePath, function(err, content) {
        if (err) return callback(err)
        var rendered = content.toString().replace('#page_html#', options.page_html).replace('#page_tagline#', options.page_tagline);
        return callback(null, rendered)
    })
})

app.set('views', './views')
app.set('view engine', 'ntl')

JS文件在模板文件中的引用方式如下 index.ntl :

<script src="js/bundle.js"></script>

在我进行上述更改之前,它一直工作正常。