Use Azure Mobile App Authentication to login using Facebook with a .NET Backend for Cordova with Ripple

Man that is a lot of buzzwords. Here be dragons.

Mostly notes for myself, rough steps:

  1. Create ionic app (in VS project is called ‘Ionic Blank App’)
    Add cordova browser platform: cordova platforms add browser
    Install cordova plugin: cordova plugin cordova-plugin-ms-azure-mobile-apps
    Install bower plugin angular-azure-mobile-service
    Apply my patch to angular-azure-mobile-service (enables ALTERNATE_LOGIN_HOST)
  2. In app.js add an angular dependency to azure-mobile-service.module
  3. Add AzureMobileServiceClient to app.js:

  4. Sample Auth factory

  5. Sample login state:
  6. Sample login view:
  7. Create mobile app (in VS project is called ‘Azure Mobile App’)
  8. Configure facebook authentication
    Make sure https://{yoursite}.azurewebsites.net/.auth/login/facebook/callback is configured as your ‘Valid OAuth redirect URIs’ under ‘Facebook Login’
  9. Go to Configuring your Mobile App .NET server backend project for local debugging and add the settings mentioned into web.config:

  10. Go to How to: Configure your Mobile App Service for External Redirect URLs.
    Add in allowedExternalRedirectUrls for Ripple: ”
  11. Create custom chrome launch shortcut:
    Target: “C:\Program Files (x86)\Google\Chrome\Application\chrome.exe” http://localhost:4400/index.html?enableripple=cordova-3.0.0-NexusGalaxy –allow-file-access-from-files –disable-web-security –no-first-run –disable-first-run-ui –profile-directory “RippleDebug”
    Start In: “C:\Program Files (x86)\Google\Chrome\Application”