Http post not works with new version

Ionic Framework ionic-v3
1

Hello,

I am pretty desperate, I don’t understand why the http post does not work after updated to newer version.
I test both on IOS device.

Works: The code below is with version @angular/http 4.4.3

  public login(username: string, passwd: string): Observable<string> {
    let headers = new Headers({'Content-Type': 'application/x-www-form-urlencoded'});
    let options = new RequestOptions({headers: headers, withCredentials: true });
    let params: URLSearchParams = new URLSearchParams();
    params.set('target', 'https://xxx');
    params.set('username', username);
    params.set('password', passwd);
    return this.http.post('https://xxx', params, options)
      .map(this.returnData)
      .catch(this.handleError);
  }

  private returnData(res: Response) {
    if (JSON.stringify(res.text()).indexOf('error') === -1) {
      return res || {};
    } else {
      throw {message: 'Error occured'};
    }
  }

  private handleError (error: any) {
    return Observable.throw(error.message);
  }

Not works: The code below is with newer version @angular/http 5.1.0

  public login(username: string, passwd: string): Observable<string> {
    const headers = new HttpHeaders();
    headers.append('Content-Type,', 'application/x-www-form-urlencoded');
    const options = {headers: headers, withCredentials: true};
    const body = {
      target: 'https://xxx',
      username: username,
      password: passwd
    };
    return this.http.post('https://xxx', body, options)
      .map(this.returnData)
      .catch(this.handleError);
  }

  private returnData(res: HttpResponse<Response>) {
    if (res.ok) {
      return res || {};
    } else {
      throw {message: 'Error occured'};
    }
  }

  private handleError(error: HttpErrorResponse) {
    return Observable.throw(error.message);
  }
2

Newest supported Angular for Ionic is 4.4.6:

3

ok many thanks on web browser it seems to work, I wil try it on the device got the error

Error: Metadata version mismatch for module XXXnode_modules/@ionic-native/core/decorators.d.ts, found version 4, expected 3
    at StaticSymbolResolver.getModuleMetadata (XXXnode_modules/@angular/compiler/bundles/compiler.umd.js:25616:34)
    at StaticSymbolResolver._createSymbolsOf (XXXnode_modules/@angular/compiler/bundles/compiler.umd.js:25404:46)
    at StaticSymbolResolver.getSymbolsOf (XXXnode_modules/@angular/compiler/bundles/compiler.umd.js:25385:14)
    at XXXnode_modules/@angular/compiler/bundles/compiler.umd.js:24241:30
    at Array.forEach (native)
    at extractProgramSymbols (XXXnode_modules/@angular/compiler/bundles/compiler.umd.js:24240:79)
    at AotCompiler.analyzeModulesAsync (XXXnode_modules/@angular/compiler/bundles/compiler.umd.js:23796:47)
    at CodeGenerator.codegen (XXXnode_modules/@angular/compiler-cli/src/codegen.js:32:14)
    at Function.NgTools_InternalApi_NG_2.codeGen (XXXnode_modules/@angular/compiler-cli/src/ngtools_api.js:73:30)
    at XXXnode_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:182:73

when I build for ios device.

I think there is still a failure in my package.json

 "scripts": {
        "clean": "ionic-app-scripts clean",
        "build": "ionic-app-scripts build",
        "lint": "ionic-app-scripts lint",
        "ionic:build": "ionic-app-scripts build",
        "ionic:serve": "ionic-app-scripts serve"
    },
    "dependencies": {
        "@angular/common": "4.4.6",
        "@angular/compiler": "4.4.6",
        "@angular/compiler-cli": "4.4.6",
        "@angular/core": "4.4.6",
        "@angular/forms": "4.4.6",
        "@angular/http": "4.4.6",
        "@angular/platform-browser": "4.4.6",
        "@angular/platform-browser-dynamic": "4.4.6",
        "@ionic-native/core": "4.4.0",
        "@ionic-native/splash-screen": "4.4.0",
        "@ionic-native/status-bar": "4.4.0",
        "@ionic/storage": "^2.1.3",
         "ng2-translate": "5.0.0",
        "angular2-cookie": "^1.2.6",
        "cordova-browser": "^4.1.0",
        "ionic-angular": "3.9.2",
        "ionic-logging-service": "^4.0.0",
        "ionic-plugin-keyboard": "^2.2.1",
        "ionicons": "3.0.0",
        "rxjs": "^5.5.2",
        "sw-toolbox": "3.6.0",
        "zone.js": "0.8.18"
    },
4

Hi,
why is it 4.4.6 ?

I saw in 3.9.0 changelog that we should use

“@angular/common”: “5.0.0”,
“@angular/compiler”: “5.0.0”,
“@angular/compiler-cli”: “5.0.0”,
“@angular/core”: “5.0.0”,
“@angular/forms”: “5.0.0”,
“@angular/http”: “5.0.0”,
“@angular/platform-browser”: “5.0.0”,
“@angular/platform-browser-dynamic”: “5.0.0”,

what is better to use then ?

5

No idea, the file was reverted from 5.0.0 Angular back to 4.4.6 a day before release:

As all newly created plugins get 4.4.6, I would use that as it is probably better tested.