Shared Code for Azure App Service (Mobile App)

Question

So, the Parse shutdown has me scrambling to find a suitable backup plan for an app that is gearing up toward release.

I have been looking into Microsoft Azure as a replacement, and began testing with an Azure Mobile Service. That is actually going really well, but I kept noticing a lot of messages like this one:

NOTE: This is an Azure Mobile Services topic. Microsoft Azure recommends Azure App Service Mobile Apps for all new mobile backend deployments. To get started with Azure App Service Mobile Apps, see the App Service Mobile Apps documentation center.

Ok, so I have been looking into App Services. I've read a lot of the documentation, which can be confusing at times, since some links don't seem to point to the right "version". Sometimes, an "App Services" link ends up at a "Mobile Services" article. Their names are close enough that it can be confusing and frustrating. But the promise is the following:

Mobile Apps is a new app type in App Service, which integrates all of the functionality of Mobile Services and more. Mobile Apps is in public preview.

Anyway, one thing that was moderately difficult to find for Mobile Services and has (so far) proven impossible to find for App Services relates to shared code. One big reason is that there appears to be no mechanism for really even seeing your shared code in the Azure portal (old or new), much less using their online editor with it. I cannot see how or where that kind of code is supposed to be incorporated in my custom App Services API.

For instance, here's a comparison of the project structures when checked out through Git using WebStorm:

Mobile Services Project Structure

App Service Project Structure

Now, when I look at the app.js file in the App Services project, I see the following lines of code:

// Import the files from the tables directory to configure the /tables endpoint
mobile.tables.import('./tables');

// Import the files from the api directory to configure the /api endpoint
mobile.api.import('./api');

Well, that's promising, because I would guess I could just add a "shared" directory and then call something like this:

mobile.api.import('./shared');

I would guess that would then import all of the code files in that directory, but then how would I access them from my other code files?

These appear to be normal Node.js/Express apps, so if I have the code files already imported in app.js, would the following work (assume a code file named customcode.js)?

In `app.js`:

mobile.api.import('./shared');

In `code.js` (in ./api):

var custom = require('customcode');
custom.doSomething();

In `customcode.js` (in ./shared):

exports.doSomething = function () {

};

If that doesn't work, is there a way to do what I'm trying to do? It seems to work fine on Azure Mobile Services, but they're trying to push me to Azure App Services.

Did you already try your code on Mobile Apps? As Mobile Apps is more flexible then Mobile Services you should definetely use Mobile Apps. Azure Mobile Apps works like traditional web hosting for your node app so require for custom modules should work just fine. — Malte Lantin

Adrian Hall Adrian Hall · Accepted Answer · 2016-02-12T21:20:55

You can see (and edit) all the code associated with your site in Visual Studio Online. The best way of getting there is to go to your site, click on Tools (along the top), select Visual Studio Online and then click on Go. In terms of your specific example, let's say you have an 'api' directory and a 'shared' directory. In the api/customapi.js file, you could do this:

var customcode = require('../shared/customcode');

// Later on
customcode.doSomething();

Then in your shared/customcode.js, you can do:

module.exports = {
    doSomething: function () {
        // Your custom code here
    }
};

Shared Code for Azure App Service (Mobile App)

Mobile Services Project Structure

App Service Project Structure

In app.js:

In code.js (in ./api):

In customcode.js (in ./shared):

2 Answers

In `app.js`:

In `code.js` (in ./api):

In `customcode.js` (in ./shared):