HTTP Native Plugin (IONIC 3)

Question

I'm trying to make a post request using the HTTP cordova plugin. However, for some reason, the JSON data consumed by the Server side is not being formatted correctly (json brakets). Could anyone help me please?

The import:

import { HTTP } from '@ionic-native/http';

The request implementation:

public sendData(sufix, json) {

    return new Promise((resolve, reject) => {

        this.http.post(URL+sufix, JSON.stringify(json), {'Content-Type': 'application/json'}).then(result => {
            resolve(result.data);
        }).catch(error => {
            reject(error);
        });

    });
}

The json sended:

{name: 'Test'}

The content received by the server:

=%7B%22name%22%3A%22Test%22%7D

The server implementation:

@Path("/register")
public class RegisterEndPoint {

    @POST
    @Consumes(MediaType.APPLICATION_JSON)
    @Produces(MediaType.APPLICATION_JSON)
    public Response registerUser(UserDTO userDTO) {

        // Create DAO for persistence
        FactoryDAO factory = new FactoryDAO();
        UserDAO userDAO = factory.getUserDAO();

        // Create user to be persisted
        if (!userDAO.userExist(userDTO.getEmail())) {

            User user = new User();
            user.setPassword(userDTO.getPassword());
            user.setEmail(userDTO.getEmail());
            user.setName(userDTO.getName());
            userDAO.persist(user);
            userDAO.commit();
            return Response.status(200).build();

        }
        return Response.status(405).entity(new ErrorDTO("User already registered!")).build();

    }


}

Answer 1

The problem seems to be in Native Plugin, so I've changed to the angular http solution, and it works fine. Follow below the solution which I've perform. Thanks everyone who helped me.

The imports required:

import { Http, Headers, RequestOptions, Response } from  '@angular/http';
import { Observable } from 'rxjs/Rx'
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/do';
import 'rxjs/add/operator/timeout';

AuthProvider:

public sendRequest(sufix, json) {

    let headers = new Headers({ 'Content-Type': 'application/json' });
    let options = new RequestOptions({ headers: headers });
    return this.http.post(URL+sufix, json, options)
        .timeout(TIMEOUT_REQUEST*1000)
        .do(this.logResponse)
        .map(this.extractData)
        .catch(this.handleError)

}

private logResponse(res: Response) {
    console.log(res);
}

private extractData(res: Response) {
    return res.json();
}

private handleError(res: Response | any) {
    return Observable.throw(res.json().error || 'Fail to connect to the server');
}

Calling the AuthProvider:

this.authProvider.sendRequest('register', this.signup).subscribe((data) => {
    console.log('Success!');
}, (error) => {
    console.log(error);
});

Providers included in app.module.ts

import { HttpModule, JsonpModule } from '@angular/http';