ocasiom / strapi-on-azure-webapp

Deploy Strapi on Azure Windows WebApp

Strapi On Azure Windows Web App

Get started

This repo is a customoziation of the code generated by the Strapi CLI to make it works on Azure Windows WebApp. To reproduce this repo by your own:

1. npm create-strapi-app my-project --quickstart
2. In the folder my-project add the 2 files:
   • server.js this file is needed because the Windows Web App needs a js file as an entry point.
   • web.config this file is use by iisnode which is the bridge between Windows IIS and Node js.
3. Edit the package.json file replace the start script strapi start by node server.js

server.js file

This file replace the CLI strapi start:

'use strict';
const strapi = require('./node_modules/strapi/lib/index')

strapi().start();

Web.config file

This file is almost the default one generated automaticaly by Azure on a Git deploy. You notice that it refers to the server.jsfile. The difference with the default one is the security section:

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

This section allows to access to the build folder which contains the Admin panel

Deploy on Azure

1. Create a Windows Web App in Azure
2. In Application Settings add the variables (or import the .env file):
   • NODE_ENV=PRODUCTION for starting Strapi with the Production configuration
   • WEBSITE_NODE_DEFAULT_VERSION=10.14.1
   • WEBSITE_RUN_FROM_PACKAGE=0
3. Update the settings in ./config/environments/production/server.json accordingly. Set "port": "${process.env.PORT || 1337}" and change the value of the "host" property under "proxy" to match the public url of the Web App (see: Server Configurations for more info)
4. (Only in the context of this repo) Create a CosmosDB instance with a MongoDB Api
   • In the Preview features, enable Aggregation Pipeline
5. Update the settings in ./config/environments/production/database.json according to your database. You can also use environment variables and set them through Application Settings entries on the Web App, e.g. DATABASE_HOST, DATABASE_USERNAME, etc.
6. In ./config/environments/production/response.json, disable gzip; Azure Web App will already gzip the responses, so we don't need Strapi to do this (otherwise the browser will have issues decoding the content it downloads due to 2x gzip)
7. Set local variable set NODE_ENV=PRODUCTION
8. Build the Admin Panel: yarn build
9. Deploy the app with the Zip Deploy (here from VSCode with the Azure App Service Extension) or through an Azure DevOps Release Pipeline using the Azure Web App Deployment task. Make sure to set the Deployment Method to Zip Deploy.
10. Browse to your App. It could take a while for the first start. Could even end up with an error. Reload the page.

Last point....

Don't run npm i, use yarn instead to be sure to get the right version package