Data is null or 'Unable to get property of userData of undefined or null reference'


#1

Hello i am getting an error on my Ionic 3 Angular 4 app. It used to work fine but i did an update on my Windows 10 since then my app doesn’t connect to AuthService. I keep getting an irritating message ‘data is null’ or ‘Unable to get property of userData of undefined or null reference’

authservice.ts

import { Injectable } from '@angular/core';
import { Http, Headers } from '@angular/http';
import 'rxjs/add/operator/map';

let apiUrl = "http://localhost/PHP-Slim-Restful2/api/";

@Injectable()
export class AuthService {
  constructor(public http: Http) {
      console.log('Hello  Provider');
  }
  postData(credentials, type) {
      return new Promise((resolve, reject) => {

          let headers = new Headers();
          console.log(headers);
      this.http.post(apiUrl+type, JSON.stringify(credentials), {headers: headers}).
          subscribe(res => {
        resolve(res.json());
          }, (err) => {
        reject(err);
      });
      
    });

  }

}

app.module.ts

import { NgModule, ErrorHandler } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';
import {Camera} from '@ionic-native/camera';
import { SplitPane } from '../providers/split-pane';
import { Common } from '../providers/common';
import { HttpModule } from "@angular/http";
import { Welcome } from '../pages/welcome/welcome';
import { Login } from '../pages/login/login';
import { Signup } from '../pages/signup/signup';
import { AboutPage } from '../pages/about/about';
import { ContactPage } from '../pages/contact/contact';
import { HomePage } from '../pages/home/home';
import { TabsPage } from '../pages/tabs/tabs';
import { UploadPage } from '../pages/upload/upload';
import { SearchPage } from '../pages/search/search';


import { UserPage } from '../pages/userProfile/userProfile';
import { MediaPage } from '../pages/mediaProfile/mediaProfile';

import { SettingsPage } from '../pages/settings/settings';
import { AccountPage } from '../pages/account/account';


import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

import { MomentModule } from 'angular2-moment';
import { LinkyModule } from 'angular-linky';
import { AuthService} from '../providers/auth-service';

@NgModule({
  declarations: [
    MyApp,
    Welcome,
    Login,
    Signup,
    AboutPage,
    ContactPage,
    HomePage,
    TabsPage,
    UploadPage,
      SearchPage,
      SettingsPage,
      AccountPage,
      UserPage,
      MediaPage
  ],
  imports: [
    BrowserModule,HttpModule,MomentModule,LinkyModule,
    IonicModule.forRoot(MyApp), BrowserAnimationsModule
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    Welcome,
    Login,
    Signup,
    AboutPage,
    ContactPage,
    HomePage,
    TabsPage,
    UploadPage,
      SearchPage,
      SettingsPage,
      AccountPage,
      UserPage,
      MediaPage
  ],
  providers: [
    StatusBar,
    SplashScreen,Camera,AuthService,SplitPane,Common,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    AuthService
  ]
})
export class AppModule {}

This is the first page

welcome.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';

import { Login } from '../login/login';
import { Signup } from '../signup/signup';
import { TabsPage } from '../tabs/tabs';
import { AuthService } from "../../providers/auth-service";
/**
 * Generated class for the Welcome page.
 *
 * See http://ionicframework.com/docs/components/#navigation for more info
 * on Ionic pages and navigation.
 */
@IonicPage()
@Component({
  selector: 'page-welcome',
  templateUrl: 'welcome.html',
})
export class Welcome {

    constructor(public navCtrl: NavController, public authService: AuthService, public navParams: NavParams) {
   
   if(localStorage.getItem('userData')){
     this.navCtrl.setRoot(TabsPage);
   }

  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad Welcome');
  }

  login(){
   this.navCtrl.push(Login);
  }

  signup(){
   this.navCtrl.push(Signup, {}, {animate:false});
  }

}

Any help?


#2

PHP-Slim-Restful2\api\config.php

<?php
//ob_start("ob_gzhandler");
error_reporting(0);
session_start();

/* DATABASE CONFIGURATION */
define('DB_SERVER', 'localhost');
define('DB_USERNAME', 'root');
define('DB_PASSWORD', '');
define('DB_DATABASE', 'wallscript1');
define("BASE_URL", "http://localhost/PHP-Slim-Restful2/api/");
define("SITE_KEY", 'yourSecretKey');


function getDB() 
{
	$dbhost=DB_SERVER;
	$dbuser=DB_USERNAME;
	$dbpass=DB_PASSWORD;
	$dbname=DB_DATABASE;
	$dbConnection = new PDO("mysql:host=$dbhost;dbname=$dbname", $dbuser, $dbpass);	
	$dbConnection->exec("set names utf8");
	$dbConnection->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
	return $dbConnection;
}
/* DATABASE CONFIGURATION END */

/* API key encryption */
function apiToken($session_uid)
{
$key=md5(SITE_KEY.$session_uid);
return hash('sha256', $key);
}



?>

.access file

RewriteEngine On

#RewriteBase /api/

Header add Access-Control-Allow-Origin "*"
Header add Access-Control-Allow-Headers "origin, x-requested-with, content-type"
Header add Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"

RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.*)$ index.php [QSA,L]