首頁猿問如何使用 JS 和 NodeJS...

如何使用 JS 和 NodeJS 服務(wù)器為標(biāo)準(zhǔn) html 頁面正確配置 app.yaml？

JavaScript

慕斯709654 2021-09-30 10:23:50

我正在 AppEngine 上設(shè)置一個簡單的網(wǎng)絡(luò)應(yīng)用程序，但在配置 app.yaml 時遇到了一些問題。它包括一個 HTML 頁面、一個 JS 腳本和一個 NodeJS 服務(wù)器。我的項目結(jié)構(gòu)：\app.yaml\package.json\www \index.html \js \server.js \index.js索引.html：<!DOCTYPE html><html><body> <div id="JShere" >Hello World !</div> <div id="ReqAnswer"></div></body><script src="js/index"></script></html>索引.js： document.getElementById('JShere').innerHTML = "JS is running"; var xhr = new XMLHttpRequest(); xhr.open('GET', "/srv", true); xhr.send(); xhr.addEventListener("readystatechange", processRequest, false); function processRequest(e) { if (xhr.readyState == 4 && xhr.status == 200) { document.getElementById('ReqAnswer').innerHTML = xhr.responseText; }}node.js 服務(wù)器：const express = require('express');const app = express();app.get('/srv', function (req, res) { res.send('Request anwser')})const PORT = process.env.PORT || 8080;app.listen(PORT, () => { console.log(`Server listening on port ${PORT}...`);});包.json：... "scripts": { "start": "node www/js/server.js", "test": "mocha --exit test/*.test.js" },...應(yīng)用程序.yaml：runtime: nodejs10handlers:- url: / static_files: www/index.html upload: www/index.html- url: /index static_files: www/index.html upload: www/index.html- url: /page2 static_files: www/page2.html upload: www/page2.html- url: /www static_dir: www當(dāng)我在本地檢查時，index.js 會正確修改index.html，但是當(dāng)我將其部署到 App Engine 時，index.js被阻止（MIME 類型（? text/html ?））。然后它“無法加載” index.html。盡管如此，腳本仍然向服務(wù)器發(fā)起 GET 請求并得到 404 錯誤。是 App.yaml 問題還是其他問題？

查看完整描述

1 回答

慕無忌1623718

TA貢獻(xiàn)1744條經(jīng)驗獲得超4個贊

仔細(xì)檢查 GAE 日志條目以獲取所請求的確切 URL（并被 404 拒絕）。這通常需要與您的靜態(tài)處理程序的url模式之一匹配。如果發(fā)生匹配，則由相應(yīng)處理程序的static_file/static_dir和upload規(guī)范（相對于您的應(yīng)用程序的頂級目錄 - app.yaml 文件所在的位置）指定的文件應(yīng)該發(fā)生。

讓我們假設(shè)初始請求是針對/. 這與您的第一個靜態(tài)處理程序匹配，因此www/index.html將為您提供服務(wù)。

但是該index.html文件引用了js/index里面的腳本，因此另一個請求將跟隨該 URL。但是該 URL 與您的任何處理程序的模式都不匹配，因此它會得到 404。您也沒有任何名為index.

假設(shè)在這種情況下www/js/index.js您想要提供的實際上是您必須提供的文件：

更正文件中的index.html文件名引用：
<script src="js/index.js"></script>
確保此引用與靜態(tài)處理程序url模式匹配?？赡苁沁@樣的（對于每個以結(jié)尾的請求路徑.js將嘗試提供與該路徑匹配但相對于www/js目錄的文件）：
```
- url: /(.*\.js)$
  static_files: www/js/\1
  upload: www/js/.*\.js$
```

或者，您可以使用可應(yīng)用于多種類型文件的方案，而不是那些以結(jié)尾的方案.js：

使用文件中的www前綴引用index.html文件：
```
`<script src="www/js/index.js"></script>`
```
重新使用您的最后一個處理程序，但向其添加通配符以url確保匹配下的所有內(nèi)容www（因為www/blah與 justwww模式不匹配）：
```
`- url: /www/*`
```

也可以在沒有.js后綴的情況下引用腳本，但是您需要一個專門用于該文件的處理程序 - 要將其映射到實際文件名，您不能使用通配符。所以我不推薦這樣做，因為它很快就會變得非常復(fù)雜。

您必須類似地考慮您需要提供的所有其他靜態(tài)元素。

反對回復(fù) 2021-09-30