typescript - 如何用其他内容替换Azure Function App中的主页？

Question

使用应用程序设置 "AzureWebJobsDisableHomepage": true Azure Function App 的默认主页已禁用，但如何将此页面替换为其他页面？

例如，有一个返回 HTML 页面的函数:

import { AzureFunction, Context, HttpRequest } from "@azure/functions"
import { promises as fs } from "fs"
import { resolve } from "path"

const httpTrigger: AzureFunction = async function (context: Context, req: HttpRequest): Promise<void> {
    const htmlPage = await fs.readFile(resolve(__dirname, "../../index.html"), "utf-8")

    context.res = {
        headers: {
            "content-type": "text/html"
        },
        body: htmlPage
    }
};

export default httpTrigger;

在 host.json 中设置 "routePrefix": "" 我应该能够从任何路由提供此功能:

"extensions": {
  "http": {
    "routePrefix": ""
  }
}

但我无法从 / 提供它，它总是返回一个空页面。有什么办法可以覆盖这种行为吗？

Answer 1

以下是我使用 HTML 页面替换 Azure Functions(typeScript Stack - Http Trigger)的默认主页的解决方法。

• 首先，使用 VS Code 通过 Http 触发器在 typeScript 中创建 Azure Functions。

• 在 Http 触发器目录下使用一些代码创建了 HTML 文件:

• 这是文件夹结构:

  

• 在local.settings.json中，定义了设置AzureWebJobsDisableHomepage，这意味着设置为“true”以禁用默认登陆显示 Azure Functions 站点根目录的页面。

引用: Configuration settings Information for Azure Functions Site.

{
"IsEncrypted": false,
"Values": {
"AzureWebJobsStorage": "",
"FUNCTIONS_WORKER_RUNTIME": "node",
"AzureWebJobsDisableHomepage": "true"
}
}

Index.ts 代码:

import { AzureFunction, Context, HttpRequest } from  "@azure/functions"
import { promises  as  fs } from  "fs"
import { resolve } from  "path"

const  httpTrigger: AzureFunction = async  function (context: Context, req: HttpRequest): Promise<void> {
context.log('HTTP trigger function processed a request.');

var  __dirname = "HttpTrigger1";
const  htmlPage = await  fs.readFile(resolve("./" + __dirname + "/index.html"), 'utf-8');

context.res = {
headers: {
"content-type":  "text/html"
},
body:  htmlPage
}
};

export  default  httpTrigger;

本地运行函数:

已成功部署到 Azure 并在云端运行: