如何在 TypeScript 到 Azure 中部署 ExpressJS？

Question

我正在嘗試使用此快速生成器為 API 服務創建快速服務器：
生成器表達無壓力打字稿

我可以使用npm run dev在本地運行 Express 服務器。
我可以運行npm run compile以在 dist 文件夾中創建生產版本。
dist 文件夾產品 package 可以使用npm run start而沒有問題。

但是，我未能將應用程序部署到我的 Azure 服務器。 我已按照此 Microsoft 文檔，使用 Visual Studio Code 將 Express.js 部署到 Azure 應用服務。 經過所有步驟，當我瀏覽應用程序時，它顯示You do not have permission to view this directory or page.

我可以參考任何文章或文件嗎？ 謝謝你的幫助。

package.json scripts部分默認由generator-express-no-stress- typescript 創建

  "scripts": {
    "start": "node dist/index.js",
    "compile": "ts-node build.ts && tsc",
    "dev": "nodemon server/index.ts | pino-pretty",
    "dev:debug": "nodemon --exec \"node -r ts-node/register --inspect-brk\" server/index.ts | pino-pretty",
    "lint": "eslint -c .eslintrc.js \"{server, test}/**/*.{js,ts,tsx}\" --quiet",
    "lint:fix": "eslint -c .eslintrc.js \"{server, test}/**/*.{js,ts,tsx}\" --quiet --fix",
    "test": "mocha -r ts-node/register test/**/*.ts --exit",
    "test:debug": "mocha -r ts-node/register --inspect-brk test/**/*.ts --exit"
  },

Answer 1

我終於弄清楚我的 package 和部署出了什么問題。 在這里，我將分享我的發現。

Azure 需要 iisnode/web.config 來執行應用程序

當我再次查看此 Microsoft 教程文檔時，我發現在他們的示例項目中，根文件夾中有一個 web.config 文件

參考這個鏈接： https://github.com/tjanczuk/iisnode/blob/master/src/samples/configuration/web.config

它說“如果 iisnode 用於在后面運行節點進程，則需要此配置文件”

我將相同的文件復制到我的項目中，我的項目是由這個生成器生成的： generator-express-no-stress-typescript
我對我的項目做了什么：

1. 使用生成器生成示例 Express API Server
2. 運行npm run compile將產品構建編譯到dist文件夾
3. 將上述 web.config 復制到根文件夾
4. 修改內容，路徑指向index.js ，改為dist/index.js

    <handlers>
      <!-- Indicates that the server.js file is a node.js site to be handled by the iisnode module -->
      <add name="iisnode" path="dist/index.js" verb="*" modules="iisnode"/>
    </handlers>
    ......
        <rule name="DynamicContent">
          ......
          <action type="Rewrite" url="dist/index.js"/>
        </rule>

畢竟，我再次將應用程序部署到 Azure，現在日志文件錯誤消息已更改。 現在它顯示類似“無效的端口號，應在 0 - 65xxx 范圍內”

修復列表端口邏輯

it seems Azure port number environment is not a number, it is a pipe string: https://www.geekwithopinions.com/2013/12/09/node-js-and-azure-is-it-a-port-or -管道/

但是，生成的 index.ts 邏輯，由於它是 TypeScript，邏輯 parseInt 為端口，並導致錯誤。

// server/index.ts
......
const port = parseInt(process.env.PORT ?? '3000');
export default new Server().router(routes).listen(port);

為了快速測試，我只是想證明 Express Server 如何在 Azure 上工作，所以我不想修復 TypeScript 邏輯。 相反，我直接修改了npm run compile生成的編譯js文件， tsc生成的文件dist/index.js由Azure執行：

// const port = parseInt((_a = process.env.PORT) !== null && _a !== void 0 ? _a : '3000');
const port = (_a = process.env.PORT) !== null && _a !== void 0 ? _a : '3000';
exports.default = new server_1.default().router(routes_1.default).listen(port);

再次部署，它現在可以工作了:)