Hosting a Laravel Application on Azure Web App

This post was born out of the pain I went through while trying to host a Laravel application on Azure for a client who insisted we host all his web apps there, after reading loads of blog posts and stack overflow suggestions i was able to get it running smoothly so i decided to share this knowing it will help someone out there.

I would like to give credit to Peter Katelaan on this blog post which really helped in finding some good answers to some disturbing points in my deployment.

Now lets get into it starting with some prerequisites. Before you proceed you should have and be comfortable with the following:

  1. An Azure Portal Account
  2. Basic understanding of Laravel
  3. Basic understanding of git and remote repositories

You good? Great! Lets get it on.

Step 1: Create a Laravel Application on your local development machine

Step 2: Set up your project as a git repo

Now commit some code and push to your remote master branch (or any appropriate branch you have setup for the purpose of the deployment)

Step 3: Create an Azure Web App

Enter an appropriate name for your web app (Azure will verify in real-time if the name you have chosen is available) and select the Pricing tier (i am using the free tier for this practise)

When, you’re done filling all the appropriate fields, click “OK” at the bottom of the panel, Azure will begin setting up your web app and you will be notified immediately the process is complete

Step 4: Verify your PHP version and Install Composer

If not, change the PHP version and click the Save button to persist your changes.

Then, you need to install composer which is the dependency manager for laravel. To do this, go to the DEVELOPMENT TOOLS section and click on Extensions. From there you click the Add button at the top left-hand corner.

This opens up a blade section from which you can then select Composer, agree to the Terms and Conditions, then click OK to install it.

Step 5: Configure Environment Variables

  1. Go to Application Settings, scroll down to App settings and enter SCM_REPOSITORY_PATH with the value ..\repository
  2. Also enter SCM_TARGET_PATH with the value ..
  3. On the same page, go down to Virtual applications and directories and change the public directory value from site\wwwroot to site\public

Step 6: Configure Deployment Settings

Then, you select the repo and the branch you have setup as your deployment branch (I am selecting the master branch) and click Ok.

(Almost) Immediately, you will see your first commit being deployed.

Step 7: Add a web.config file

<?xml version=”1.0" encoding=”utf-8"?> 
<configuration>
<system.webServer>
<urlCompression doDynamicCompression=”true” doStaticCompression=”true” dynamicCompressionBeforeCache=”true”/>
<staticContent>
<remove fileExtension=”.svg” />
<mimeMap fileExtension=”.svg” mimeType=”image/svg+xml” />
<mimeMap fileExtension=”.woff” mimeType=”application/font-woff” />
<clientCache httpExpires=”Sun, 29 Mar 2020 00:00:00 GMT” cacheControlMode=”UseExpires” />
</staticContent>
<httpProtocol>
<customHeaders>
<add name=”Strict-Transport-Security” value=”max-age=31536000; includeSubDomains”/>
<add name=”Access-Control-Allow-Origin” value=”*” />
<add name=”Access-Control-Allow-Headers” value=”X-Requested-With,Content-Type” />
<add name=”Access-Control-Allow-Methods” value=”POST,GET,OPTIONS,DELETE,PUT,PATCH” />
</customHeaders>
</httpProtocol>
<rewrite>
<rules>
<rule name=”Laravel5" stopProcessing=”true”>
<match url=”^” ignoreCase=”false” />
<conditions logicalGrouping=”MatchAll”>
<add input=”{REQUEST_FILENAME}” matchType=”IsDirectory” negate=”true” />
<add input=”{REQUEST_FILENAME}” matchType=”IsFile” negate=”true” />
</conditions>
<action type=”Rewrite” url=”index.php” appendQueryString=”true” />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>

Commit and push this change to your remote branch and Azure automatically deploys it.

Step 8 (Final): Add your .env file

Thus you need to add one in your production environment. Now don`t make make the mistake of removing it from one of the ignored files in .gitignore . Azure provides an app management console known as the Kudu Console which provides you loads of awesome tools to manage your web app. Simply navigate to it by going to https://<app-name>.scm.azurewebsites.net , for me that will be https://laravel-azure-app.scm.azurewebsites.net

From the top menu, go to Debug Console >> CMD , there you will see an FTP-like interface for your folder structure and below it is command-line interface (yeah, i know right) which is just awesome.

From the folder structure interface, click on the site folder. Then from the command line, simply create the .env file and copy the contents from .env.example by running the following command:

copy .env.example .env

This then creates your .env file, but wait, we ain’t done yet. Just a lil more edit to go.

Open your .env file by clicking the edit icon beside it

Then from the local version of your .env file, copy your APP_KEY and paste it in your production version. Also, change the APP_URL to that of your azure web app.

Phewww! Now we are done. We can now unveil our app. Simply go to the address of your app (for me that will be: http://laravel-azure-app.azurewebsites.net) and you will see your app Live and Robust. Wonderful!!!

@LinkedIn Author | Technical Writer | Software Developer