Hello i have a Ionic Angular project. I haven't changed any of my files and i am getting an error data is null after ionic serve
That means that i can't connect to my database. I havent made any changes on the database or change any of my files.
Any help?
Any help?
Probably not, based on the almost complete lack of details.
I pretty sure that there is nothing happened with my code so i can post something. I didnt changes anything and it worked fine
Really something happened after upgrading windows 10. I posted here to see anyone has the same issue
Is it "All your code?" That is, did you write it all and host it yourself? I have to ask that since every example I read such as http://plnkr.co/edit/OyGY7VVNSSAjdstr54wG?p=preview finds scripts loading from the web.
So how do you check if those sources didn't change?
No, i dont use any files from the web. I use local files.
The problem is that i can't connect to my database. Its realy frustrating. It happened before and it was because i gave the wrong root to the config file. But i haven't made any changes i was working on another project. I updated my windows 10 and thats it. Always that annoying error 'data is null'
authservice.ts
import { Injectable } from '@angular/core';
import { Http, Headers } from '@angular/http';
import 'rxjs/add/operator/map';
let apiUrl = "http://localhost/PHP-Slim-Restful1/api/";
@Injectable()
export class AuthService {
constructor(public http: Http) {
console.log('Hello AuthService Provider');
}
postData(credentials, type) {
return new Promise((resolve, reject) => {
let headers = new Headers();
this.http.post(apiUrl+type, JSON.stringify(credentials), {headers: headers}).
subscribe(res =>{
resolve(res.json());
}, (err) =>{
reject(err);
});
});
}
}console
MyApp@http://localhost:8100/build/main.js:1563:9 createClass@http://localhost:8100/build/vendor.js:13135:20 createDirectiveInstance@http://localhost:8100/build/vendor.js:12970:37 createViewNodes@http://localhost:8100/build/vendor.js:14428:53 createRootView@http://localhost:8100/build/vendor.js:14317:5 callWithDebugContext@http://localhost:8100/build/vendor.js:15742:39 debugCreateRootView@http://localhost:8100/build/vendor.js:15025:12 ComponentFactory_.prototype.create@http://localhost:8100/build/vendor.js:11922:37 ComponentFactoryBoundToModule.prototype.create@http://localhost:8100/build/vendor.js:4709:16 ViewContainerRef_.prototype.createComponent@http://localhost:8100/build/vendor.js:12119:45 IonicApp.prototype.ngOnInit@http://localhost:8100/build/vendor.js:61552:28 checkAndUpdateDirectiveInline@http://localhost:8100/build/vendor.js:13055:9 checkAndUpdateNodeInline@http://localhost:8100/build/vendor.js:14579:20 checkAndUpdateNode@http://localhost:8100/build/vendor.js:14522:16 debugCheckAndUpdateNode@http://localhost:8100/build/vendor.js:15415:55 debugCheckDirectivesFn@http://localhost:8100/build/vendor.js:15356:13 View_IonicApp_Host_0/<@ng:///IonicModule/IonicApp_Host.ngfactory.js:10:5 debugUpdateDirectives@http://localhost:8100/build/vendor.js:15341:12 checkAndUpdateView@http://localhost:8100/build/vendor.js:14488:5 callWithDebugContext@http://localhost:8100/build/vendor.js:15742:39 debugCheckAndUpdateView@http://localhost:8100/build/vendor.js:15279:12 ViewRef_.prototype.detectChanges@http://localhost:8100/build/vendor.js:12263:13 ApplicationRef.prototype.tick/<@http://localhost:8100/build/vendor.js:6593:58 ApplicationRef.prototype.tick@http://localhost:8100/build/vendor.js:6593:13 ApplicationRef.prototype._loadComponent@http://localhost:8100/build/vendor.js:6659:9 ApplicationRef.prototype.bootstrap@http://localhost:8100/build/vendor.js:6547:9 PlatformRef.prototype._moduleDoBootstrap/<@http://localhost:8100/build/vendor.js:6267:74 PlatformRef.prototype._moduleDoBootstrap@http://localhost:8100/build/vendor.js:6267:13 PlatformRef.prototype.bootstrapModuleFactory/</</<@http://localhost:8100/build/vendor.js:6188:21 F</l</t.prototype.invoke@http://localhost:8100/build/polyfills.js:3:14974 onInvoke@http://localhost:8100/build/vendor.js:5435:24 F</l</t.prototype.invoke@http://localhost:8100/build/polyfills.js:3:14901 F</c</r.prototype.run@http://localhost:8100/build/polyfills.js:3:10124 f/<@http://localhost:8100/build/polyfills.js:3:20240 F</l</t.prototype.invokeTask@http://localhost:8100/build/polyfills.js:3:15649 onInvokeTask@http://localhost:8100/build/vendor.js:5426:24 F</l</t.prototype.invokeTask@http://localhost:8100/build/polyfills.js:3:15562 F</c</r.prototype.runTask@http://localhost:8100/build/polyfills.js:3:10815 o@http://localhost:8100/build/polyfills.js:3:7887Is it because of dublicate entries?
i use 'MyApp' only on my app.compontent.ts file
import { Component, ViewChild } from '@angular/core';
import { Nav, Platform, App, MenuController } from 'ionic-angular';
import { StatusBar, Splashscreen } from 'ionic-native';
import { TabsPage } from '../pages/tabs/tabs';
import { SplitPane } from '../providers/split-pane';
import { AuthService } from "../providers/auth-service";
import { Common } from "../providers/common";
import { SettingsPage } from '../pages/settings/settings';
import { AccountPage } from '../pages/account/account';
@Component({
templateUrl: 'app.html'
})
export class MyApp {
@ViewChild(Nav) nav: Nav;
rootPage = TabsPage;
pages: Array<{ title: string, component: any }>;
public userDetails: any;
public resposeData: any;
public dataSet: any;
public groupSet: any;
public pressSet: any;
userPostData = {
uid: "",
token: "",
username: "",
bio: "",
profile_pic: ""
};
constructor
(
public platform: Platform,
public splitPane: SplitPane,
public authService: AuthService,
public common: Common,
public app: App,
public menu: MenuController
) {
this.initializeApp();
const data = JSON.parse(localStorage.getItem("userData"));
this.userDetails = data.userData;
this.userPostData.uid = this.userDetails.uid;
this.userPostData.token = this.userDetails.token;
this.userPostData.username = this.userDetails.username;
this.userPostData.profile_pic = this.userDetails.profile_pic;
this.userPostData.bio = this.userDetails.bio;
this.userDetail();
this.pressList();
this.groupList();
// used for an example of ngFor and navigation
this.pages = [
{ title: 'Homepage', component: TabsPage },
{ title: 'Settings', component: SettingsPage },
{ title: 'Account', component: AccountPage }
];
}
userDetail() {
this.authService.postData(this.userPostData, "userDetails").then(
result => {
this.resposeData = result;
if (this.resposeData.userDetails) {
this.dataSet = this.resposeData.userDetails;
console.log(this.dataSet);
} else {
console.log("No access");
}
},
err => {
//Connection failed message
}
);
}
SettingsPage() {
// Reset the content nav to have just this page
// we wouldn't want the back button to show in this scenario
this.nav.push(SettingsPage);
}
AccountPage() {
// Reset the content nav to have just this page
// we wouldn't want the back button to show in this scenario
this.nav.push(AccountPage);
}
initializeApp() {
this.platform.ready().then(() => {
// Okay, so the platform is ready and our plugins are available.
// Here you can do any higher level native things you might need.
StatusBar.styleDefault();
Splashscreen.hide();
});
}
pressList() {
this.authService.postData(this.userPostData, "pressList").then(
result => {
this.resposeData = result;
if (this.resposeData.pressList) {
this.pressSet = this.resposeData.pressList;
console.log(this.pressSet);
} else {
console.log("No access");
}
},
err => {
//Connection failed message
}
);
}
groupList() {
this.authService.postData(this.userPostData, "groupsList").then(
result => {
this.resposeData = result;
if (this.resposeData.groupsList) {
this.groupSet = this.resposeData.groupsList;
console.log(this.groupSet);
} else {
console.log("No access");
}
},
err => {
//Connection failed message
}
);
}
backToWelcome() {
const root = this.app.getRootNav();
root.popToRoot();
}
logout() {
//Api Token Logout
localStorage.clear();
this.menu.enable(false);
setTimeout(() => this.backToWelcome(), 1000);
}
}Could it be a .access thing?
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]One of the Windows OS complaints is that updates can reset settings and break installed apps. You've found that you can't connect to your server so that's what you work next. I don't admin your setup so you are the expert at this point with you going over your setup and settings.
But other projects i use on localhost work just fine. Only my Ionic project with authservice doesnt work. WHt should i check first?
That XAMPP, I don't recall that it built in Auth service like https://auth0.com/ I'd ask instead how to test your auth service.
on IE i am getting unable to get property 'userData' of undefined or null reference
Anyone knows what that means?
Where should i start to look to solve this data is null issue?
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.
