Question

我使用azure web app部署了我的angular + nodejs app但是在尝试访问我的节点api时我得到405方法不允许错误

server.js静态资产代码

/*API routes*/
const api = require("./server/routes/route");

/*Enable cors origin*/
var corsOptions = {
  "origin": "*",
  "methods": "GET,HEAD,PUT,PATCH,POST,DELETE",
  "preflightContinue": false,
  "optionsSuccessStatus": 204
}
app.use(cors(corsOptions));

app.use(express.static(path.join(__dirname, "/dist")));

app.use("/api", api);

app.get("/", function(req, res) {
  res.sendfile(path.join(__dirname, "/dist/index.html"));
});

因为我正在使用iis我在dist文件夹的根目录中添加了一个web.config作为这个要点

https://gist.github.com/iammelvin/62e2582796cbc3fa8b5fc9e242915788

<?xml version="1.0" encoding="utf-8"?>

<configuration>
  <system.webServer>

    <webSocket enabled="false" />

    <handlers>
      <add name="iisnode" path="server.js" verb="*" modules="iisnode"/>
    </handlers>

    <rewrite>
      <rules>
        <rule name="NodeInspector" patternSyntax="ECMAScript" stopProcessing="true">
          <match url="^server.js\/debug[\/]?" />
        </rule>

        <rule name="StaticContent">
          <action type="Rewrite" url="public{REQUEST_URI}"/>
        </rule>

        <rule name="DynamicContent">
          <conditions>
            <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="True"/>
          </conditions>
          <action type="Rewrite" url="server.js"/>
        </rule>
      </rules>
    </rewrite>

    <security>
      <requestFiltering>
        <hiddenSegments>
          <remove segment="bin"/>
        </hiddenSegments>
      </requestFiltering>
    </security>

    <httpErrors existingResponse="PassThrough" />

  </system.webServer>
</configuration>

我使用构建脚本构建项目

 "scripts": {
    "ng": "ng",
    "start": "node server.js",
    "build": "npm run clean && ng build --prod",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "dev": "concurrently  \"nodemon --inspect-brk=3000 server.js --watch server\" \"ng serve --proxy-config proxy.config.json\""
  },

我的角度cli json看起来像这样

"apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": ["assets", "favicon.ico"],
      "index": "index.html",
      "main": "main.ts",
      "polyfills": "polyfills.ts",
      "test": "test.ts",
      "tsconfig": "tsconfig.app.json",
      "testTsconfig": "tsconfig.spec.json",
      "prefix": "app"...}]

最后我的索引库href为<base href="/">

Answer 1

您需要确保web.config文件放在应用的根目录中（D:\home\site\wwwroot）。

根据您的web.config，您的文件夹结构应如下所示：

D:\home\site\wwwroot
├── node_modules 
│   └── ...
├── public
│   └── ...
├── server.js
├── package.json
└── web.config

实际上，您不再需要在server.js文件中使用这些行：

// remove these lines of the code as well
app.use(express.static(path.join(__dirname, "/dist")));

app.get("/", function(req, res) {
  res.sendfile(path.join(__dirname, "/dist/index.html"));
});

现在，您可以使用此终端访问您的快速路线：

的https：// {yourWebAppName} .azurewebsites.net / API / {routeName}

使用此端点检索静态文件：

的https：// {yourWebAppName} .azurewebsites.net / {theFileInPublic}

405使用azure web app部署的express angular 5 app上不允许使用方法

1 个答案: