自承载开发人员门户的替代方法Alternative approaches to self-host developer portal

自承载开发人员门户时,有几种替代方法可以进行探索:There are several alternative approaches you can explore when you self-host a developer portal:

  • 使用设计器和发布服务器的生产版本。Use production builds of the designer and the publisher.

  • 使用 Azure 函数应用发布门户。Use an Azure Function App to publish your portal.

  • 使用内容分发网络 (CDN) 将门户的文件置于前面,以减少页面加载时间。Front the files of your portal with a Content Delivery Network (CDN) to reduce page loading times.

本文提供了有关上述每种方法的信息。This article provides information on each of these approaches.

如果尚未这样做,请为最新版本的开发人员门户设置本地环境If you have not already done so, set up a local environment for the latest release of the developer portal.

用于生产的版本Build for production

如果要联机承载门户的开发环境以实现协作,请使用设计器和发布服务器的生产版本。If you want to host the development environment of the portal online for collaboration purposes, use production builds of the designer and the publisher. 生产版本会捆绑文件、排除源映射等。Production builds bundle the files, exclude source maps, etc.

通过运行以下命令在 ./dist/designer 目录中创建捆绑包:Create a bundle in the ./dist/designer directory by running the command:

npm run build-designer

结果是获得一个单页面应用程序,因此仍可将它部署到静态 Web 主机,例如 Azure Blob 存储静态网站。The result is a single page application, so you can still deploy it to a static web host, such as the Azure Blob Storage Static Website.

同样,将经过编译和优化的发布服务器置于 ./dist/publisher 文件夹中:Similarly, place a compiled and optimized publisher in the ./dist/publisher folder:

npm run build-publisher

使用函数应用发布门户Use Function App to publish the portal

在云中运行发布步骤,以作为在本地执行的替代方法。Run the publishing step in the cloud as an alternative to executing it locally.

若要使用 Azure 函数应用实现发布,需要满足以下先决条件:To implement publishing with an Azure Function App, you need the following prerequisites:

  • 创建 Azure 函数Create an Azure Function. 该函数需要是 JavaScript 语言函数。The Function needs to be a JavaScript language Function.
  • 安装 Azure Functions Core Tools:Install Azure Functions Core Tools:
    npm install -g azure-function-core-tools
    

步骤 1:配置输出存储Step 1: Configure output storage

将内容直接上传到承载网站(输出存储的“$web”容器),而不是本地文件夹。Uploading the content directly to the hosting website ("$web" container of output storage), instead of a local folder. ./src/config.publish.json 文件中配置此更改:Configure this change in the ./src/config.publish.json file:

{
   ...
   "outputBlobStorageContainer": "$web",
   "outputBlobStorageConnectionString": "DefaultEndpointsProtocol=...",
   ...
}

步骤 2:生成并部署函数应用Step 2: Build and deploy the Function App

./examples 文件夹中有一个示例 HTTP 触发器函数。There is a sample HTTP Trigger Function in the ./examples folder. 若要生成它并置于 ./dist/function 中,请运行以下命令:To build it and place it in ./dist/function, run the following command:

npm run build-function

然后,登录 Azure CLI 并部署它:Then, sign in to the Azure CLI and deploy it:

az login
cd ./dist/function
func azure functionapp publish <function app name>

部署后,可以使用 HTTP 调用来调用它:Once it is deployed, you can invoke it with an HTTP call:

curl -X POST https://<function app name>.chinacloudsites.cn/api/publish

承载和 CDNHosting and CDN

自承载开发人员门户中,建议使用 Azure 存储帐户来承载网站。In self-host a developer portal we suggested using an Azure storage account to host your website. 但是,可以通过任何解决方案发布文件(包括承载提供程序的服务)。However, you can publish the files through any solution, including services of hosting providers.

还可以使用内容分发网络 (CDN) 将文件置于前面,以减少页面加载时间。You can also front the files with a Content Delivery Network (CDN) to reduce page loading times. 建议使用 Azure CDNWe recommend using Azure CDN.

后续步骤Next steps

详细了解开发人员门户:Learn more about the developer portal: