Azure Web 应用返回 404（未找到）

Posted 2023-03-07

【中文标题】Azure Web 应用返回 404（未找到）

【英文标题】：Azure web app returns 404 (not found)

【发布时间】：2017-11-28 16:46:48

【问题描述】：

我写了一个 Angular 应用程序，然后我添加了一个 node.js 服务器文件以包含一个基本的服务器端。

在我的本地文件夹中，应用程序可以运行 - 服务器返回 index.html 文件并让 angular 从那里接管。

我的问题是尝试部署到 azure：我创建了一个应用服务并使用 git 提交所有文件。当我尝试访问该站点时，我收到一条“未找到”消息。

以下是所有相关细节：

git push 输出：

$ git push azure master
Counting objects: 3, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (3/3), done.
Writing objects: 100% (3/3), 290 bytes | 0 bytes/s, done.
Total 3 (delta 2), reused 0 (delta 0)
remote: Updating branch 'master'.
remote: ........................................
remote: Updating submodules.
remote: Preparing deployment for commit id '078f9ff036'.
remote: Generating deployment script.
remote: Running deployment command...
remote: Handling node.js deployment.
remote: .............................
remote: KuduSync.NET from: 'D:\home\site\repository' to: 'D:\home\site\wwwroot'
remote: Copying file: 'server.js'
remote: Using start-up script server.js from package.json.
remote: Generated web.config.
remote: The package.json file does not specify node.js engine version constraints.
remote: The node.js application will run with the default node.js version 6.9.1.
remote: Selected npm version 3.10.8
remote: ..
remote: Finished successfully.
remote: Running post deployment command(s)...
remote: Deployment successful.
To https://soundofsilence.scm.azurewebsites.net:443/soundOfSilence.git
   9b261b6..078f9ff  master -> master

服务器日志：

错误：ENOENT：没有这样的文件或目录，stat 'D:\home\site\wwwroot\dist\index.html' 在错误（本机）

我的 server.js 代码：

console.log('Server running');

// Get dependencies
const express = require('express');
const path = require('path');
const http = require('http');
const bodyParser = require('body-parser');

// Get our API routes
const api = require('./src/server/routes/api');

const app = express();
var cors = require('cors');
app.use(cors());
//bring in model
let Report = require('./src/server/models/selfReport');

// Parsers for POST data
app.use(bodyParser.json());
app.use(bodyParser.urlencoded( extended: false ));

// Point static path to dist
app.use(express.static(path.join(__dirname, '../dist')));
// app.use(express.static(static_dir));
// Set our api routes
app.use('/api', api);

// Catch all other routes and return the index file
app.get('*', (req, res) => 
    res.sendFile(path.join(__dirname, '../dist/index.html'));
);



app.post('/add', function (req, res) 
    console.log('submmiting report');
    console.log(req.body);
    res.end("Good");
    return;
)

/**
 * Get port from environment and store in Express.
 */
const port = process.env.PORT || '3000';
app.set('port', port);

/**
 * Create HTTP server.
 */
const server = http.createServer(app);

/**
 * Listen on provided port, on all network interfaces.
 */
server.listen(port, () => console.log(`API running on localhost:$port`));

我的 packages.json 文件：

  "name": "sound-of-silence-app",
  "version": "0.0.0",
  "license": "MIT",
  "main": "app.js",
  "scripts": 
    "ng": "ng",
    "start": "node server.js",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  ,
  "private": true,
  "dependencies": 
    "@angular/animations": "^4.1.3",
    "@angular/common": "^4.0.0",
    "@angular/compiler": "^4.0.0",
    "@angular/core": "^4.0.0",
    "@angular/forms": "^4.0.0",
    "@angular/http": "^4.0.0",
    "@angular/material": "^2.0.0-beta.5",
    "@angular/platform-browser": "^4.0.0",
    "@angular/platform-browser-dynamic": "^4.0.0",
    "@angular/router": "^4.0.0",
    "angular-timer": "^1.3.5",
    "angular2-focus": "^1.1.0",
    "body-parser": "^1.17.2",
    "bootstrap": "^3.3.7",
    "core-js": "^2.4.1",
    "cors": "^2.8.3",
    "express": "^4.15.3",
    "font-awesome": "^4.7.0",
    "mongoose": "^4.10.8",
    "ngx-bootstrap": "^1.6.6",
    "rxjs": "^5.1.0",
    "zone.js": "^0.8.4"
  ,
  "devDependencies": 
    "@angular/cli": "1.0.1",
    "@angular/compiler-cli": "^4.0.0",
    "@types/jasmine": "2.5.38",
    "@types/node": "~6.0.60",
    "codelyzer": "~2.0.0",
    "jasmine-core": "~2.5.2",
    "jasmine-spec-reporter": "~3.2.0",
    "karma": "~1.4.1",
    "karma-chrome-launcher": "~2.0.0",
    "karma-cli": "~1.0.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "karma-coverage-istanbul-reporter": "^0.2.0",
    "protractor": "~5.1.0",
    "ts-node": "~2.0.0",
    "tslint": "~4.5.0",
    "typescript": "~2.2.0"
  

和我的文件结构：

如果有任何帮助，我将不胜感激

【问题讨论】：

在这一行：res.sendFile(path.join(__dirname, '../dist/index.html')) 的 server.js 脚本，尝试删除 .. 前导它。它在同一个目录中

@DanielCopley 我仍然遇到同样的错误。我尝试查找 Azure 文件夹结构，但其中没有 dist 文件夹，我认为这可能是问题

好的，所以你之前设置了静态路径，还需要在前面指定/dist吗？可以index吗？

阅读此Documentation。我认为这会有所帮助。

【参考方案1】：

从您上次的捕获来看，您的 dist 文件夹似乎位于项目的根目录中。

请将您的代码 sn-p 修改为：

...
app.use(express.static(path.join(__dirname, './dist')));
...
app.get('*', (req, res) => 
   res.sendFile(path.join(__dirname, './dist/index.html'));
);
...

由于主脚本server.js与dist文件夹在同一路径，../会找到父目录。

另外，请仔细检查dist 文件夹和其中的文件是否已成功部署到 Azure Web Apps。

如果dist文件夹中的文件是编译生成的，还需要通过Custom Deployment Script配置一些额外的步骤。

希望对您有所帮助，如有任何疑问，请随时告诉我。