默认文档不在Azure托管的节点Web应用程序上提供

本文介绍了默认文档不在Azure托管的节点Web应用程序上提供的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我已经在本地计算机上设置了angular4/node应用程序，并且可以 ng服务和 npm start 正常运行了.我已经在azure上创建了一个网络应用，并使用了 John Papa的将其部署到天蓝色的指南.然而;当我访问带有chrome的网站时，index.html未被提供，并且得到404.我什至取消了 Application Settings->下的所有文档.默认文档仅列出 index.html ，而没有其他内容.

I've set up an angular4/node app on my local machine and I can ng serve and npm start the app just fine. I've created a web app on azure and used John Papa's guide to deploy it to azure. However; when I visit the site with chrome my index.html is not served up and I get a 404. I've even eliminated all my documents under Application Settings -> Default Documents to only list index.html and nothing else.

但是；当我访问 myapp.azurewebsites/index.html 时，将呈现该网站.当我访问 myapp.azurewebsites 时，该网站不是.

However; when I visit myapp.azurewebsites/index.html the site is rendered. When I visit myapp.azurewebsites the site is not.

我想念什么?

const express = require('express'); const path = require('path'); const root = './dist'; const app = express(); app.use(express.static(root)); console.log(`server ${root}`); app.get('*', (req, res) => { res.sendFile(`index.html`); }); const port = process.env.PORT || '3000'; app.listen(port, () => console.log(`API running on localhost:${port}`));

client/app/app.module.ts

import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { HttpModule } from '@angular/http'; import { RouterModule } from '@angular/router'; import { AppComponent } from './appponent'; import { routes } from './app.routing'; @NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, HttpModule, RouterModule.forRoot(routes) ], providers: [], bootstrap: [AppComponent] }) export class AppModule { }

client/app/app.routing.ts

import { Route } from '@angular/router'; import { AppComponent } from './appponent'; export const routes: Route[] = [ { path: '', component: AppComponent } ];

web.config

<?xml version="1.0" encoding="utf-8"?> <!-- This configuration file is required if iisnode is used to run node processes behind IIS or IIS Express. For more information, visit: github/tjanczuk/iisnode/blob/master/src/samples/configuration/web.config --> <configuration> <system.webServer> <!-- Visit blogs.msdn/b/windowsazure/archive/2013/11/14/introduction-to-websockets-on-windows-azure-web-sites.aspx for more information on WebSocket support --> <webSocket enabled="false" /> <handlers> <!-- Indicates that the server.js file is a node.js site to be handled by the iisnode module --> <add name="iisnode" path="index.js" verb="*" modules="iisnode"/> </handlers> <rewrite> <rules> <!-- Do not interfere with requests for node-inspector debugging --> <rule name="NodeInspector" patternSyntax="ECMAScript" stopProcessing="true"> <match url="^index.js\/debug[\/]?" /> </rule> <!-- First we consider whether the incoming URL matches a physical file in the /public folder --> <rule name="StaticContent"> <action type="Rewrite" url="public{REQUEST_URI}"/> </rule> <!-- All other URLs are mapped to the node.js site entry point --> <rule name="DynamicContent"> <conditions> <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="True"/> </conditions> <action type="Rewrite" url="index.js"/> </rule> </rules> </rewrite> <!-- 'bin' directory has no special meaning in node.js and apps can be placed in it --> <security> <requestFiltering> <hiddenSegments> <remove segment="bin"/> </hiddenSegments> </requestFiltering> </security> <!-- Make sure error responses are left untouched --> <httpErrors existingResponse="PassThrough" /> <!-- You can control how Node is hosted within IIS using the following options: * watchedFiles: semi-colon separated list of files that will be watched for changes to restart the server * node_env: will be propagated to node as NODE_ENV environment variable * debuggingEnabled - controls whether the built-in debugger is enabled See github/tjanczuk/iisnode/blob/master/src/samples/configuration/web.config for a full list of options --> <!--<iisnode watchedFiles="web.config;*.js"/>--> </system.webServer> </configuration>

推荐答案

2020年5月-您无需在任何地方添加任何javascript文件或配置文件.让我解释一下.

MAY 2020 - You don't have to add any javascript files or config files anywhere. Let me explain.

我正面临着同样的问题，浪费了6个小时来尝试所有问题，包括对该问题最流行的答案，但都没有用.

I was facing this exact same issue and wasted 6 hours trying everything including the most popular answer to this question which didn't work either.

您看到，仅部署Azure Web App(或也称为App Service)时，会发生两件事:

You see, when you just deploy an Azure Web App (or App Service as it is also called), two things happen:

默认情况下，Web应用程序指向opt/startup/hostingstart.html

The web app by default points to opt/startup/hostingstart.html

它还将hosthoststart.html放入home/site/wwwroot

It also puts a hostingstart.html in home/site/wwwroot

在部署代码时，它将替换home/site/wwwroot中的hostingstart.html，但该应用程序仍指向opt/startup/hostingstart.html.如果您想验证这一点，请尝试删除opt/startup/hostingstart.html文件，然后您的网络应用会抛出"CANNOT GET/"错误.

When you deploy your code, it replaces hostingstart.html in home/site/wwwroot but the app is still pointing to opt/startup/hostingstart.html. If you want to verify this, try deleting opt/startup/hostingstart.html file and your web app will throw a "CANNOT GET/" error.

那么如何更改默认指针?它比看起来简单:

So how to change the default pointer? It's simpler than it looks:

转到Web应用程序上的配置"标签，然后将以下代码添加到启动脚本中:

Go to Configuration tab on your web app and add the following code to startup script:

pm2 serve /home/site/wwwroot --no-daemon

这将告诉Web应用程序提供wwwroot文件夹.就是这样.

This will tell the web app to serve wwwroot folder. And that's it.

如果此Web应用程序是客户端单页应用程序，并且您在路由方面遇到问题，则将--spa添加到上述命令中，如下所示:

If this web app is a client-side single-page-app and you're having issues with routing, then add --spa to the above command as follows:

pm2 serve /home/site/wwwroot --no-daemon --spa

图片供参考:屏幕截图说明

PS:如果仅设置启动脚本而不部署代码，它仍将显示hostingstart.html，因为默认情况下该文件位于wwwroot文件夹中.

PS: If you only set the startup script without deploying your code, it will still show the hostingstart.html because by default that file lies in the wwwroot folder.