Ionic call RESTful api with a param base64 string

Ionic Framework ionic-v3
1

Hi, i have a base64 string image and i have to call a api with other params

My api is:

register(data,userImg) {
let opt: RequestOptions;
opt = new RequestOptions({
})
return new Promise((resolve, reject) => {
  this.http.get(apiUrl+'register/0/register?email='+data.email+'&password='+data.password+'&name='+data.name+'&userImg='+userImg, opt)
    .map(res => res.json())
    .subscribe(data => {
      this.data = data;
      resolve(this.data);
    },(err) => {
      reject(err);
    });
});  
}

the userImg is the base64 string image but when i call it, it directly go to err, anyone know how to make it works? thanks~

2

There are a lot of things wrong with this code, but the most urgent is that you are brutally abusing REST with GET modifying state as it should not, and having little bobby tables injection issues. Immediately fire your backend developer and get somebody competent, then stop needlessly instantiating Promises.

3

I had an error maybe it can be the same error here, When i take photo the base64 size was too big to send with http service.I suggest to decrease the quality of picture to use http service

4

hi gnncrdm, may I ask you what is the value you set for the quality?

5

options: CameraOptions = {
quality: 20,
destinationType: this.camera.DestinationType.DATA_URL,
encodingType: this.camera.EncodingType.JPEG,
mediaType: this.camera.MediaType.PICTURE,
correctOrientation: true
}
my options, hope it works

6

Hi rapropos, I am beginner of using ionic, can you point me the correct way?

7

The ionic-related bits of the problem are relatively minor. Stop dealing with whoever wrote the backend server, and if that is you, then hire somebody competent to completely reimplement it properly. Once that’s done, then we can revisit this conversation, which will hopefully be involving POST methods and JSON.

8

How much data is in userImg? GET requests are quite limited in what they can accept as data. You will probably have to switch to a POST request.

Can you be more specific on what error you get?
Are all your variables present and with correct values?

9

hi Sujan12, thanks for the advise

now I have change it to POST with the following code:

register(data,userImg) {
  let headers = new Headers;
  headers.append("Content-Type", 'application/json');
  let options = new RequestOptions({ headers: headers });

  let body = {
    email: "aa@pl.com",
    password: "testing",
    name: "ww",
    userImg: userImg
  }; 

  this.http.post(apiUrl+'register', body, options)
    .subscribe((data) => {
      console.log("NULRA CHECKING : ", data.json());
    });
}

but I have receive the following error:

27 PM
Screen Shot 2017-08-11 at 11.31.27 PM.png846Ă—68 8.27 KB

Do you know how to solve it? thank you very much~!

10

Http 500 error is an internal server error. Isnt it?

I think you have a problem in your server skript.

11

Yes, I also think it is the server need some setting, when I put the options in a post api, it return no such method error to me, said no xxxxxController.options() this function, do you experienced before? Because I use postman to test the api it is normal and can return the correct Json. Thanks a lot.

12

What are you using on server side? Php?

13

Yes, when the server application didn’t implement the OPTIONS method.

Do you also send a OPTIONS request like the browser does?

You have two options:

  1. Google and learn what “CORS” and “preflight headers” are and fix you backend
  2. GitHub - ionic-team/ionic-cli: The Ionic command-line interface
1 Like
14

hi sujan12, yes, i have send a exactly options request.

15

HI Jacktoolsnet , I am using Java

16

Sorry. I know nothing about server side java.

17

Then something else is different about the request.

18

Sujan12, I have fixed the server to accpet POST now, but when I call the api again, it is not return a json result i wanted. It return : Response {_body: “”, status: 200, ok: true, statusText: “OK”, headers: Headers, …} . Do you know how to deal with it? Thanks a lot =)

19

How did you fix the problem?

Please open a new topic for this new problem and post a link to the new topic here. This gets to confusing here.

20

Sure, i have create new topic:

1 Like