Nativescript-angular: Http error with final release of angular2

[eleddie]

I'm trying to make an http request (post or get) but as soon as the functions is called the app closes and shows the error:

JS ERROR Error: Error in login/login.component.html:9:51 caused by: null is not an object (evaluating '_angular_platformBrowser.__platform_browser_private__.getDOM().getCookie')

I am injecting the http object in the constructor, I'm importing it in the NgModule, I don't know what could it be..
I have done this before in Angular2 rc4 but I'm not being able to do it now.

EDIT: I made a little improvement, I changed the HttpModule in the NgModule for NativeScriptHttpModule and now it doesn't crash but enters in the function when an error occurs and shows: Response with status: 200 for URL: null

[bnussey]

We had the exact same problem, you actually need to use this:

import { NativeScriptHttpModule } from "nativescript-angular/http";

Add that to your app.module.ts and into your imports

[eleddie]

Thank you for your response. I found the main reason of the problem. iOS emulator doesn't work with local server. I was using mamp but it gives the URL: null error. I tried with a https demo api and it worked... So i have to upload my api to a https server!

[gergderkson]

By default iOS doesn't allow requests over non https, but you can enable it.
You can add the following to your Info.plist under app_resources/iOS.

Note changing this file means you need to re build your app with tns build ios --emulator

See this issue https://github.com/NativeScript/NativeScript/issues/1881

[productank]

I'm still have this problem on android.. any help?

[eleddie]

Hi @productank, do you get any log?
Share it so I can help you.

[productank]

thanks for the fast response, it works on ionic serve doesn't work on android

import {Component,NgZone,Injectable} from '@angular/core'; import {Platform, NavController, NavParams, ViewController,AlertController} from 'ionic-angular'; import {Http, Headers, RequestOptions,Response} from '@angular/http'; //import { FormsModule, ReactiveFormsModule } from '@angular/forms'; //import {Observable} from 'rxjs/Observable'; import 'rxjs/Rx'; import { Observable } from 'rxjs/Observable'; import { ErrorObservable } from 'rxjs/observable/ErrorObservable'; import 'rxjs/add/operator/map';

let link = 'https://gamerholic.com/server/v2/app_get_start.php'; let data_post = JSON.stringify({user_id:this.user_id,device:this.device_id}); let options = new RequestOptions({ headers: this.headers }); return this.http.post(link,data_post,options) .map(response => response.json()) .subscribe( data => this.get_start_data = data, err => this.logError(err), () => console.log('get actual visits complete') );

logError(error){ console.log(error) }

e _body: XMLHttpRequestProgressEvent headers: t ok: false status: 0 statusText: "" type: 3 url: null __proto__: n

is all I get

[eleddie]

Try this:

Instead of:
let data_post = JSON.stringify({user_id:this.user_id,device:this.device_id});

Do this:
let data_post = {user_id:this.user_id,device:this.device_id};

[productank]

same error result

I'm using these headers

this.headers = new Headers(); this.headers.append('Accept', 'application/json'); this.headers.append('Cache-Control','no-cache'); this.headers.append('Content-Type','application/json');

[eleddie]

Can you try it without the headers and without the stringify, just to see if shows any errors. I'll check something meanwhile

[productank]

works without stringify and headers... big thanks

[eleddie]

Niicee!! You are welcome!

[productank]

will say though, this new way doesn't work on ionic serve which is slowing down development DRASTICALLY since live reload rarely works on android...

[genesis06]

Hi, I have this same issue. I'm trying to get some information using a service and when I run the iOS emulator for testing the service, and I get this message: Response with status : 200 for URL: null. Now I'm using the 2.4.2 Nativescript current and latest version.

And also I changed the Info.plist file. Here is my service code:

getRecords(stringUrl:string){`
//Asign Headers
let headers = new Headers();
headers.append("Content-Type", "application/json");
headers.append("Authorization", "Bearer: "+ this.config.loginToken);
// Returns observable with API answer
return this.http.get(
this.config.qqcURL +"/records?from_date=2016-11-22T00:00:00&to_date=2016-12 22T23:59:59&tags=Testing&durop=>=&startduration=00:00:00",
{headers : headers}
)
.map(response => response.json())
.map(data => {
let searchList = [];
data.Result.forEach((item) => {
if(item.session_status==1){
searchList.push(new Record(item.startdate,
item.duration, item.inbound,item.outbound,
item.common_id, item.score_avg, item.my_score,
item.id,item.tags));
}
});
return searchList;
},
err => console.log(err))
}

And my Info.plist file here:

Please, If you could help I would be so gratefull.