Over the last few months we've been working through some enhanvements and bugs with one of our clients and during some of the research on the bugs we found some issues with how the environment was setup. Having only worked with Azure Web Apps a few times, and each time was significantly different, I wanted to share the problems and solutions along with best practices to setup your Kentico instance in Azure Web Apps for storing your files in Azure and Blob storage.
As we worked through the different issues and enhancements on the site we kept coming back to similar problems and/or issues which we was unable to figue out why these things were happening. For instance, we'd make javascript changes in code, commit them and see them deployed on the Azure instance via FTP but none of the changes were reflected when we viewed the source of the rendered page even after clearing all the cache. Or the Smart Search indexes would build once but only once. You could never rebuild them or optimize them. Or my personal favorite, caching. Caching is configured on this particular site because of the heavy traffic. Unfortunately this caused a lot more problems than we had really anticipated and believe the following article will help others understand how it all works together.
Environment Setup
Development
- Local dev with shared database
- Bitbucket as source control
- TeamCity is building and deploying to staging instance on a Bitbucket check-in
Azure
- Web farm with up to 3 servers using Azure Web Apps
- Blob storage
- No CDN
Kentico
- Currently on Kentico 8.2.30
- Webfarms configured
- Less than 500 lines of custom C#
- Configured to use Azure Blob Storage for all files
On-going Problems
Over the last few months, we've been working on several JavaScript updates and changes. As we made them locally and deployed them using the above process, we were stunned to find out none of the changes were working.
We recently added a new webpart to the staging server. Using the standard export/import process we were sure we'd experience no problems. Fortunately, the import process worked without an issue. The problem came when we tried utilizing the webpart on a page template, "file could not be found".
Since this Kentico instance has a global presense in 7 different languages, the traffic to the site is pretty intense at times. So caching was configured to compensate for this traffic. Unfortunately, it was causing problems when people would go to edit pages and/or edit objects like page templates. Some peoples work was being overwritten and some work would just never be saved.
Reasearch Performed
Several times we involved Kentico Support and Consultants to provide support and ensure our configuration was correct. We made small changes to some of the configuration and removed a lot of custom code to help with the issues. We performed a lot of load tests, have performance monitoring enabled and also did a lot of manual debugging, all providing good results.
Finally, A Breakthrough
So after months of testing, changes and more testing, we were in the process of reimplementing the thousands of lines of custom JavaScript and we had a breakthrough. The site was configured to store ALL updatable files in Azure Blob storage. When we updated a JavaScript file in Kentico we were able to see it updated on the rendered site but when we pushed the code from Bitbucket it wouldn't update on the site. The short and simple is the code push pushed the file to the Azure Web App but Kentico was configured to get and edit the JavaScript file in blob storage.
Not knowing a lot about how Kentico worked with blob storage, aside from it just worked when we configured it, we ran a few tests locally while connected to blob storage to educate ourselves. The tests were simple:
- Upload a file to the media library
- Upload a javascript file through the JavaScript app
- Edit an image in the CSS Stylesheet>Themes app; which I found was not available when connected to blob storage
- Rebuild a smart search index
- Clear the cache on the site through the Kentico System app
After running the tests it was clear anything in Kentico which needed to write or update files in the root file system of the website was being written to the Azure Blob storage. While this is good for most things, it has been the bane of our existence for the last 6-9 months, maybe longer actually.
The Solution
This last week we were able to create a test instance, run some more tests and get things working properly. The work isn't so much getting it reconigured because Kentico has a lot of this already documented for you but more getting the rest of the setup migrated so there are no issues when you deploy the Kentico solution.
Kentico has
documented here how to configure your Kentico instance to store ONLY media files to Azure Blob storage. In the article you'll essentially copy and paste the code and make a few configuration modifications for your Azure names and keys but the code will configure Kentico to only store those media library files in blob storage the the rest will be written to the local Azure Web App storage.
The work now comes when you need to move files stored in blob storage over to the web app. There are some important folders/files you'll need to ensure are copied from the blob storage back to the web app.
- /app_data - there are a lot fo files stored in here but ultimately not needed. Just be sure to rebuild your smart search indexes after you update your code
- /app_themes - in this directory there COULD be some important .css, font files and other site design related files. Be sure to copy this directory back, with caution not to overwrite newer files
- /cmsfiles - copy this folder and the contents from blob storage to Azure web app
- /cmsformcontrols - if you added any new form controls, be sure to copy this into your Azure web app
- /cmsscripts - in this directory the sub directory /custom will have javascript files which could have been updated in the JavaScript app in Kentico, be sure to merge those changes with your local code files
- /cmswebparts - in this directory there are any custom webparts you may have imported, be sure to merge those with your local code files.
- /<site specific directory> - this is where your media library files will be stored. Leave the files in the /media sub directory in Azure blob storage and copy the rest to the Azure storage.
Summing it all up
There's a lot of information in this post but it's taken quite a few months to troubleshoot all the issues, perform the research, realize they are related to each other, test and finally put a solution in place. Knowing not everyone's client(s) or boss(s) will tolorate this kind of timeframe, we decided it was worth a post to help others save some time.
Although Kentico and Azure have a lot of great features, if you don't configure them correctly, it can have detrimental effects on your website.
Good Luck and Happy Coding!