5
votes

I have created ionic 2 app using visual studio template and trying to develop Offline Data Sync in Azure Mobile Apps functionality. I have installed node "module of azure-mobile-apps-client" and using as import * as WindowsAzure from 'azure-mobile-apps-client'; in app.components.ts and initializing store using Client = new WindowsAzure.MobileServiceClient("url"); but error showing me as "TypeError:Cannot read property 'openDatabase' of undefined".

I have also installed @ionic-native/sqlite node module and cordova-sqlite-storage plugin.

Please see below code:

import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { NavController } from 'ionic-angular';
//declare var WindowsAzure: any;
import * as WindowsAzure from 'azure-mobile-apps-client';

var mobileAppClient, // Connection to the Azure Mobile App backend
    store,  // Sqlite store to use for offline data sync
    syncContext, // Offline data sync context
    tableName
var useOfflineSync: boolean = true;


@Component({
  selector: 'page-about',
  templateUrl: 'about.html'
})
export class AboutPage {

    constructor(public navCtrl: NavController, public platform:Platform) {

        platform.ready().then(() => {
            mobileAppClient = new WindowsAzure.MobileServiceClient("https://myapp.azurewebsites.net");
            // Create the sqlite store
            store = new WindowsAzure.MobileServiceSqliteStore('store.db');

            store.defineTable({
                name: 'todoitem',
                columnDefinitions: {
                    id: 'string',
                    text: 'string',
                    complete: 'boolean',
                    version: 'string'
                }
            });

            // Get the sync context from the client
            syncContext = mobileAppClient.getSyncContext();

            // Initialize the sync context with the store\
            syncContext.initialize(store).then((syc) => {

                // Get the local table reference.
                tableName = mobileAppClient.getSyncTable('todoitem');

                // Sync local store to Azure table when app loads, or when login complete.
                syncContext.push().then((res) => {

                    // Push completed
                    // Pull items from the Azure table after syncing to Azure.
                    syncContext.pull(new WindowsAzure.Query('todoitem')).then((data) => {
                        alert(JSON.stringify(data));
                    }, (err) => {
                        alert(err);
                    });

                });

            }, function (err) {
                alert(err);
            });
        });

  }

}
1
Did you test it from a web browser or a physical device? - Aaron Chen
@AaronChen I have tested on android emulator. - H_H
are you using the js library or the cordova plugin? github.com/Azure/azure-mobile-apps-cordova-client - Suraj Rao
@SurajRao I have added "azure-mobile-apps-client" node module and "cordova-plugin-ms-azure-mobile-apps" cordova plugin. also added depended plugins such as "cordova-sqlite-storage" and "cordova-plugin-inappbrowser". - H_H
Using one should suffise - Suraj Rao

1 Answers

0
votes

This is probably your client database table columns doesn't match your remote database. Note that removing a column via migration doesn't remove the column in SQLite.