Search code examples
javascriptcordovaazure-web-app-servicerequirejshandlebars.js

How to deploy Cordova platform\browser\www content to Azure app service?

I have created an App in Cordova and I just want to run it in browser instead of Android or iOS. My application is running perfectly in local machine by running the command "cordova serve" in my VS Code editor. I'm trying to publish it on Azure with following steps:

  1. Created an Azure App with following configuration: enter image description here

  2. Drag and drop all files and folders from platforms/browser/www to Kudu enter image description here

  3. getting following error while browsing: enter image description here

my initController.js

var initControllerDependencies = [];
var device = Framework7.prototype.device;
var deviceOS = device.os;
var nativeDep = 'js/util/mockNative';

// check device and plug appropriate native js
if (deviceOS) {
   if (deviceOS.indexOf('ios') !== -1 || deviceOS.indexOf('android') !== -1) {
      nativeDep = 'js/util/nativeFacade';
   }
}
initControllerDependencies.push(nativeDep);
initControllerDependencies.push("js/util/restUrl");
initControllerDependencies.push("ev");
initControllerDependencies.push("js/util/util");
initControllerDependencies.push("js/util/labelManager");
initControllerDependencies.push("hbs!js/init/header-info");
initControllerDependencies.push("hbs!js/init/user-items");


/**
 * This controller is called only once on init.
 */
define(initControllerDependencies, function(Native, RestClient, ev, Util, LabelManager,pageHeaderTemplate,userItems) {
   
    

    /**
     * Runs on the start of the application. 1. Get Language 2. Get labels
     */
    function init() {
        f7.showPreloader();
        //getLanguage();
        Native.getDeviceLocale();       
    }

    // Holds all the elements that needs to be binded while rendering the view
    var bindings = [ {
        element : '#logOut',
        event : 'click.ev',
        handler : logOut          
      },
      {
        element : '#ev-lnkEditProfile',
        event : 'click.ev',
        handler : function(){
            f7.closeModal('.popover-links');
        }         
      }
    ];

      function logOut() {
        f7.closeModal('.popover-links');
        $("#pageHeader").css("display","none");     
        f7.showPreloader(LabelManager.getApplicationData("lbl_Logout"));
  
        var getLogOutXhr = RestClient.makeLogOutXhr();
        getLogOutXhr.done(function() {
       Util.clearStoredUserCredentials();
       f7.mainView.router.loadPage(userLoginPageUrl);
       f7.hidePreloader();
        }).fail(function() {
       f7.hidePreloader();
        });
  
     }

      function bindEvents(bindings) {
        for ( var i in bindings) {
       $(bindings[i].element).on(bindings[i].event, bindings[i].handler);
        }
     };
    
    function setAppInitData(){
        f7.params.modalTitle = LabelManager.getPageTitleByModuleName("lbl_app_title");
        f7.params.modalButtonOk =  LabelManager.getApplicationData('lbl_app_ok');
        f7.params.modalButtonCancel =  everestCache['commonHtml']['lbl_cancel'];
        f7.params.modalPreloaderTitle = LabelManager.getApplicationData('lbl_loading');
        f7.params.smartSelectPopupCloseText =  LabelManager.getApplicationData('lbl_close');
        f7.params.notificationTitle = LabelManager.getApplicationData('lbl_validation_msg');        
    }

    /*
     * Gets the list of supported languages and maps it based on the device language.
     * Defaults to English, language Id 1
     */
    function getLanguage(phoneLocale) {
        var langXhr = RestClient.makeLanguagesRsXhr();
        langXhr.done(function(data) {
            // default locale as of device
            var deviceLanguage = 'en';

            // get device locale            
            var fetchedDeviceLocale = phoneLocale;

            // fetchedDeviceLocale en-IN
            if (fetchedDeviceLocale) {
                deviceLanguage = fetchedDeviceLocale.substring(0, 2);
            }

            // to find if available in the list of available languages
            $.each(data, function(index, language) {
                var langDesc = language['languageValue']; // eg:en

                if (langDesc === deviceLanguage) {
                    // load into app scope for usage across
                    appScopeData['displayLangId'] = language['languageId'];
                    appScopeData['localeForMapLoad'] = langDesc;
                }
            });
        });

        langXhr.always(function() {
            // defaults
            if (!appScopeData['displayLangId']) {
                appScopeData['displayLangId'] = 1;
            }
            if (!appScopeData['localeForMapLoad']) {
                appScopeData['localeForMapLoad'] = 'en';
            }

            // call next operation. To fetch Header and Framework 7 defaults            
            getStaticLabels();  
            initializeHeader();     
        });
    }
        
    function afterPhoneLocaleFetched(phoneLocale){     
       getLanguage(phoneLocale);       
    }

    /*
     * Fetch Labels for page Title.
     */ 
    function getStaticLabels() {
        var commonHtmlXhr = RestClient.makeLabelsRsXhr('commonHtml');
        var pageTitleXhr = RestClient.makeLabelsRsXhr('pageTitle');
        var commonXhr = RestClient.makeLabelsRsXhr('common');

        commonHtmlXhr.done(function(data) {
            everestCache['commonHtml'] = data;
            $('.logo-message-inset').html(data['lbl_Filtration']);
            $('#footer_setup_mon .tabbar-label').html(data['lnk_monitorFooter']);
            $('#footer_tips .tabbar-label').html(data['footer_tips']);
            $('#footer_sites .tabbar-label').html(data['footer_sites']);
            $('#footer_user_profile .tabbar-label').html(data['footer_profile']);
            toolBarBinding();
        });

        pageTitleXhr.done(function(data) {
            everestCache['pageTitle'] = data;
        });

        commonXhr.done(function(data) {
            everestCache['common'] = data;
        });

        var initPromise = [ commonHtmlXhr, pageTitleXhr, commonXhr ];

        $.when(commonHtmlXhr, pageTitleXhr, commonXhr).done(function(data) {
            setAppInitData();           
            if (localStorage['isUserAuthenticated'] === 'true') {               
                var checkForStoresXhr = RestClient.makeStoreCheckXhr();

                checkForStoresXhr.done(function(data) {
                    if (checkForStoresXhr.status !== 204) {
                        loggedInUser['hasStore'] = false;

                        if (!loggedInUser['address']) {
                            var getUserAddressXhr = RestClient.makeGetAddressXhr();

                            getUserAddressXhr.done(function(data) {                             
                                loggedInUser['address'] = data["userAddressAstext"];
                                ev.router.loadModule(selectMonitorTypePage);
                            }).fail(function() {
                               Util.authorisedXhrFailed(getUserAddressXhr);
                            });
                        } else {
                            ev.router.loadModule(selectMonitorTypePage);
                        }
                        f7.hidePreloader(); 
                    } else {
                        loggedInUser['hasStore'] = true;
                        loggedInUser['mapViewInitStores'] = data;   
                        $("#pageHeader").css("display","block");                                            
                        ev.router.loadModule(mapViewPageUrl);
                    }
                    
                        
                    
                }).fail(function() {                   
                    /*f7.hidePreloader();                   
                    if (checkForStoresXhr.status === 403 || checkForStoresXhr.status === 401){
                        Util.loadLoginPage(ev);
                    }else{  //TODO load error page
                        Util.loadLoginPage(ev);
                        //f7.alert(LabelManager.getApplicationData('lbl_FailedMessage'));
                    }
                    */
                    Util.clearStoredUserCredentials();
                    Util.loadLoginPage(ev);
                
                });
            } else {                
                ev.router.loadModule(userLoginPageUrl);
            }

            
        }).fail(function(jqXHR) {
            $.each(initPromise, function(index, xhr) {
                if (xhr != jqXHR) {
                    xhr.abort();
                }
            });         
        var isErrorPageLoaded = mainView.router.loadPage({
                url : errorPageUrl
                //animatePages : false
            });
        
        if(isErrorPageLoaded === false){
           var reloadErrorPageTimeout;         
           if(reloadErrorPageTimeout){
              clearTimeout(reloadErrorPageTimeout);
           }
           reloadErrorPageTimeout = setTimeout(function(){
              f7.mainView.router.loadPage({
                url : errorPageUrl
              });
           },1000)
           
        }
        });
    }
    //Initialize Header
    var initializeHeader = function initializeHeader() {
        var commonXhr = RestClient.makeLabelsRsXhr('common');
        commonXhr.done(function(data) {
            everestCache['common'] = data;
            everestCache['common']['lbl_Filtration'] = everestCache['commonHtml']['lbl_Filtration'];
            everestCache['common']['lnk_homeHeader'] = everestCache['commonHtml']['lnk_homeHeader'];
            everestCache['common']['lnk_contact'] = everestCache['commonHtml']['lnk_contact'];
            everestCache['common']['lnk_editProfile'] = everestCache['commonHtml']['lnk_editProfile'];
            everestCache['common']['lnk_logout'] = everestCache['commonHtml']['lnk_logout'];
            $("#pageHeader").prepend(pageHeaderTemplate(everestCache['common']));           
            if ($('#userActions').length <= 0) {
                $(userItems(everestCache['common'])).insertAfter(".views");
                 }
            bindEvents(bindings);
            $("#pageHeader").css("display","none");
        });
        
    }

    // Done to initialize toolbar actions
    function toolBarBinding() {
        $('.evToolBar .tab-link').on('click.ev', function() {
            var loadPageUrl = $(this).attr('href');
            ev.router.loadModule(loadPageUrl);
            return false;
        })
    }

    return {
        'init' : init,      
        'initializeHeader' : initializeHeader,
        "afterPhoneLocaleFetched" : afterPhoneLocaleFetched
    };
});

Can anyone help me out why this error occurred even the files are located in exact location.

Solution

  • Your azure webapp is on the windows platform. It means that your program is deployed in iis, so you need the web.config file to define the startup command or default document.

    The deployment of any language program on iis requires web.config, php, python, nodejs, etc., all of which are required. Only html files of static resources are not required.