Search code examples
mongodbangular6mongodb-stitch

MongoDB Stitch and Angular 6 application


I'm creating a service for my MongoDB Stitch connections and I'm having an issue where if I refresh my page I get an error saying:

client for app 'xyxyxyxyxyxy' has not yet been initialized

And when I try to initialize it I get an error saying it has already been initialized.

client for app 'xyxyxyxyxyxy' has already been initialized

Here is my service.

import { Injectable } from '@angular/core';
import { Stitch, RemoteMongoClient, UserApiKeyCredential} from 'mongodb-stitch-browser-sdk';

@Injectable({
  providedIn: 'root'
})
export class AnalyticsService {
  client: any;
  credential: UserApiKeyCredential;
  db: any;

  constructor() {
    console.log(Stitch.hasAppClient('xyxyxyxyxyxy'));
    if (!Stitch.hasAppClient('xyxyxyxyxyxy')) {
      this.client = Stitch.initializeDefaultAppClient('xyxyxyxyxyxy');
    } else {
      console.log('here');
      this.client = Stitch.initializeAppClient('xyxyxyxyxyxy');
      //this.client = Stitch.getAppClient('xyxyxyxyxyxy');
    }

    this.db = this.client.getServiceClient(RemoteMongoClient.factory, 'mongodb-atlas').db('DBNAME');
  }

  login() {
    this.credential = new UserApiKeyCredential('APIKEY');
    this.client.auth.loginWithCredential(this.credential)
      .then(authId => {
        console.log(authId);
      });
  }

  logout() {
    this.client.auth.logout()
      .then(resp => {
        console.log(resp);
      });
  }

  insertData(collectionName: string, data: {}) {
    this.db.collection(collectionName).insertOne(data)
      .then(resp => {
        console.log(resp);
      });
  }

  getData(collectionName: string) {
    this.db.collection(collectionName).find({})
      .asArray().then(resp => {
        console.log(resp);
      });
  }
}

Solution

  • Change the constructor to be like this and it fix the issue.

    constructor() {
        if (!Stitch.hasAppClient('xyxyxyxyxyxy')) {
            this.client = Stitch.initializeDefaultAppClient('xyxyxyxyxyxy');
        } else {
            this.client = Stitch.defaultAppClient;
        }
    
        this.db = this.client.getServiceClient(RemoteMongoClient.factory, 'mongodb-atlas').db('DBNAME');
    }