3

I've this...myservice.service.ts:

import { HttpClient } from '@angular/common/http';
import { HttpHeaders } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { ReqLogin, ResLogin, ResList} from '../../interfaces/general';
import { GlobalService} from '../global/global.service';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/do';

...

list(): Observable<ResList> {
  const url = this.gs.backendServer + this.gs.backend.endpoints.list;
  const httpOptions = {
    headers: new HttpHeaders({
      'Authorization': this.gs.token
    })
  };
  return this.http.get(url, httpOptions)
    .map(res => <ResList> res)
    .do(dataReceived => console.log(dataReceived));
 }

This works fine, the server receive the reader, I receive the data from server, but I receive also this exception:

ERROR TypeError: Cannot read property 'length' of undefined
at eval (http.js:123)
at Array.forEach (<anonymous>)
at HttpHeaders.lazyInit (http.js:117)
at HttpHeaders.init (http.js:265)
at HttpHeaders.forEach (http.js:368)
at Observable.eval [as _subscribe] (http.js:2172)
at Observable._trySubscribe (Observable.js:172)
at Observable.subscribe (Observable.js:160)
at subscribeToResult (subscribeToResult.js:23)
at MergeMapSubscriber._innerSub (mergeMap.js:138)

if I drop the Http Options, this works perfect.

any clue ?

Marco Jr
  • 6,496
  • 11
  • 47
  • 86
  • There's a bug open for this issue: https://github.com/angular/angular/issues/22837 – Fals Mar 23 '18 at 15:00
  • What is the value of `this.gs.token`? Are you sure it isn't empty? – Jeto Mar 23 '18 at 15:01
  • Are you sure that your `gs.token` is not `undefined`? – Efe Mar 23 '18 at 15:02
  • Yes, guys....gs.token not not undefined. I am pretty sure. – Marco Jr Mar 23 '18 at 15:32
  • Humm..in fact....This is being called twice for some reason..the 1st time there is no token (undefined)...and yes, you are right, fellas...the undefined value is causing this, according with the but pointed by @Fals – Marco Jr Mar 23 '18 at 15:36
  • see this https://stackoverflow.com/questions/45286764/angular-httpclient-doesnt-send-header/45286959#45286959 – Vikas Mar 23 '18 at 15:38

2 Answers2

0

Try this using Headers and RequestOptions from @angular/http library.

ApplicationService.ts

import { Injectable } from '@angular/core';
import { Http, Headers, Response, RequestOptions } from '@angular/http';

@Injectable()
export class ApplicationService {

  constructor(private http: Http) {
  }

  myformPost(id:number, formData : any){

     let header = this.initHeaders();
     let options = new RequestOptions({ headers: header, method: 'post'});
     let body = JSON.stringify(formData);

     return this.http.post(this.myapiUrl, body, options)
                .map(res => {
                    return res.json();
                })
                .catch(this.handleError.bind(this));
  }

  private initHeaders(): Headers {
      var headers = new Headers();
      let token = localstorage.getItem(StorageKey.USER_TOKEN);
      if (token !== null) {
         headers.append('Authorization', token);
      }

      headers.append('Pragma', 'no-cache');
      headers.append('Content-Type', 'application/json');
      headers.append('Access-Control-Allow-Origin', '*');
      return headers;
  }

  private handleError(error: any): Observable<any> {
      return Observable.throw(error.message || error);
  }             
}
Amol Bhor
  • 2,322
  • 1
  • 12
  • 14
0

I have the same issue. I think the key is your HttpHeaders.

this.gs.token maybe is null, so it brings error.

try this: 

const httpOptions = {
headers: new HttpHeaders({
  'Authorization': this.gs.token + ''
})

};

gus
  • 532
  • 4
  • 6