Sitecore Azure web app Basic Authentication

When it comes to normal websites generally or Sitecore individually, they should be protected from external access while they are being developed or under dev or stage.

There are some approaches to do this such as internal network restriction and whitelist IP limitation. If we hosted our website in IIS then we can configure basic authentication very easily and quickly.

But when you have hosted your website in the azure web app then it is difficult to configure basic authentication in your website. To configure basic authentication, you can follow the below steps in your azure portal app service.

1. Go to your website azure app service.
2. Then go to “Advanced Tools” and click on “Go” so it will open “Kudu”
3. Then open CMD in debug console menu

4. It will open your root folder structure

   
5. Please add the applicationHost.xdt file to this root folder. Please refer above image where we have uploaded the file.

6. For creating this file, please copy the below code and add it to your xdt file and upload to your root folder.

   <?xml version="1.0"?>
   <configuration xmlns:xdt="http://schemas.microsoft.com/XML-Document-Transform"> 
     <location path="%XDT_SITENAME%" xdt:Locator="Match(path)"> 
       <system.webServer> 
         <rewrite xdt:Transform="InsertIfMissing"> 
           <allowedServerVariables xdt:Transform="InsertIfMissing"> 
             <add name="RESPONSE_WWW_AUTHENTICATE" xdt:Locator="Match(name)" xdt:Transform="InsertIfMissing" /> 
           </allowedServerVariables> 
           <rules xdt:Transform="InsertIfMissing"> 
             <rule name="BasicAuthentication" stopProcessing="true" xdt:Transform="InsertIfMissing" xdt:Locator="Match(name)"> 
               <match url=".*" /> 
               <conditions> 
                 <add input="{HTTP_AUTHORIZATION}" pattern="^Basic d2lsbGtpZTp3aWxsa2llX3NwIW54ZGlnaXRAbEAyMDIy" ignoreCase="false" negate="true" /> 
               </conditions> 
               <action type="CustomResponse" statusCode="401" statusReason="Unauthorized" statusDescription="Unauthorized" /> 
               <serverVariables> 
                 <set name="RESPONSE_WWW_AUTHENTICATE" value="Basic realm=Project" /> 
               </serverVariables> >
             </rule> 
           </rules> 
         </rewrite>>
       </system.webServer> 
     </location> 
   </configuration> 
                                   

7. If you want to change the user and password for the authentication popup as per your requirement, you can update this pattern section. After the Basic keyword you can replace your base64string value. It’s a combination of username and password.

8. For creating base64string please use google chrome developer tools.

   You can encode your credentials yourself by opening Developer Tools in your browser (F12 on Windows/Linux). In the console, t ype in the following and click enter: encodedData = "Basic " + window.btoa('YOUR_USERNAME:YOUR_PASSWORD')

   You’ll need to replace your own user credentials for YOUR_USERNAME and YOUR_PASSWORD, like this:

   

   Copy this value (without quotation marks and update your xdt file and upload it to the root folder of azure web service.

   Now, you are done with all the changes. Restart your azure web app and check your website URL you will get an authentication popup in your browser.