如何使用React App無法正確加載與Content Security Policy相關的內容來解決Node.js問題

Question

當我在筆記本電腦上運行服務器時似乎沒有問題時，當前我的代碼無法在Heroku上部署並帶有“無法獲取/”消息的問題。 我不確定這是否是路徑問題，因為我的控制台發出了以下錯誤：內容安全策略：頁面的設置阻止了自身的資源加載（“ default-src https://mvpauto.herokuapp.com ”）。 來源：;（function installGlobalHook（window）{

我尚未設置代碼來修改響應對象標頭來設置CSP，也沒有在body-parser之外運行任何中間件，我也嘗試在調試中禁用該中間件，但無濟於事。 我的標題如下：

Server  Cowboy
Connection  keep-alive
X-Powered-By    Express
Content-Security-Policy default-src 'self'
X-Content-Type-Options  nosniff
Content-Type    text/html; charset=utf-8
Content-Length  139
Date    Sun, 01 Oct 2017 04:12:05 GMT
Via 1.1 vegur


Request headers (364 B) 
Host    
mvpauto.herokuapp.com
User-Agent      Mozilla/5.0 (Windows NT 10.0; …) Gecko/20100101 Firefox/55.0
Accept      text/html,application/xhtml+xm…plication/xml;q=0.9,*/*;q=0.8
Accept-Language     en-US,en;q=0.5
Accept-Encoding     gzip, deflate, br
DNT     1
Connection      keep-alive
Upgrade-Insecure-Requests       1
Cache-Control       max-age=0

這些是使用“ heroku local”在本地成功運行時的標頭

X-Powered-By        Express
Accept-Ranges       bytes
Cache-Control       public, max-age=0
Last-Modified       Sun, 01 Oct 2017 03:26:11 GMT
ETag        W/"17f-15ed5f847af"
Date        Sun, 01 Oct 2017 04:29:45 GMT
Connection      keep-alive

Request headers (439 B) 
Host        localhost:5000
User-Agent      Mozilla/5.0 (Windows NT 10.0; …) Gecko/20100101 Firefox/55.0
Accept    text/html,application/xhtml+xm…plication/xml;q=0.9,*/*;q=0.8
Accept-Language     en-US,en;q=0.5
Accept-Encoding     gzip, deflate
DNT     1
Connection      keep-alive
Upgrade-Insecure-Requests       1
If-Modified-Since       Sun, 01 Oct 2017 03:26:11 GMT
If-None-Match       W/"17f-15ed5f847af"
Cache-Control       max-age=0

然后我的index.js：

const express = require('express');
const app = express();
const db = require(__dirname + '/../database');
const bodyParser = require('body-parser');
const port = process.env.PORT || 3000;
const path = require('path');

app.use(express.static(path.resolve(__dirname + '/../client/dist')));
const router = require('./routes');    
app.use('/', router);
app.get('/', (req, res) => {
  res.sendFile(__dirname + '/../client/dist/index.html');
});

app.listen(port, () => console.log('Listening on port ' + port));

我的root（'/'）端點沒有任何get請求處理程序，因為在客戶端，獲取請求會在加載時提交到'/ todos'端點。 我嘗試添加一個'/'處理程序，並獲得對root的請求，結果生成了一個res.sendFile（'index.html'），這反過來又導致了一個“ Forbidden”消息。 任何幫助將非常感激。

Answer 1

我剛發現問題，那就是我的server.js文件位於應用程序存儲庫根目錄中的單獨服務器文件夾中。 當嘗試訪問位於服務器目錄同級文件夾中的客戶端文件時，這尤其成問題，因為遍歷客戶端目錄的唯一方法是通過共享父級，而我沒有訪問權限至。 這些都是從觀察中收集到的，並運行了“ heroku run ls〜”，因為我在他們的文檔中找不到任何內容，也無法在其他地方在線討論。