How to pass parameter in Angular4 to codeigniter API

Question

localhost/ci-abc/api/get_userid?username=yousuf

This is the API that works in postman and returns the userid

However I am a beginner developer so I am confused how do I pass a parameter in angular http service method to codeigniter's API. APIs with no parameter required works fine but I am not able to find a way to pass the parameter of username in order to get its id.

Ive searched a bit and was able to find URLSearchParams() as a solution but it didn't work, here is what i did.

 getUserid()
  {
    let myParams = new URLSearchParams(); 
    myParams.append('username', 'yousuf');
    console.log(myParams);
    return this.http.get('http://localhost/ci-abc/api/get_userid', {params : myParams})
    .map(res=>res.json());
  }

and the API in codeigniter is

function get_userid_get()
    {
        $username = $this->get('username');

        if (!$username) {
            $this->response("No username specified", 400);
            exit;
        }
        $result = $this->user_model->get_userid($username);
        if ($result) {
            $this->response($result, 200);
            exit;
        } else {
            $this->response("Invalid username", 404);
            exit;
        }}

it has been few hours im trying different ways but no luck so ill appreciate the help

Mozilla Firefox comes up with this error in the console.

ERROR {…} _body: "\"No username specified\"" headers: Object { _headers: Map, _normalizedNames: Map } ok: false status: 400 statusText: "Bad Request" type: 2 url: "http://localhost/ci-abc/api/get_userid" proto: Object { constructor: Response(), toString: Response.prototype.toString() }

adeltahir · Accepted Answer · 2017-12-18T08:05:26.887

0

HTTP GET request doesn't have params but query strings.

http.get('http://localhost/ci-abc/api/get_userid?' + myParams.toString())

If you are trying to do authentication, POST method is recommended.

In your angular.js side,

let myParams = { username: "username"};

http.post('http://localhost/ci-abc/api/get_userid', myParams)

In your API side,

$username = $this->input->post('username');

edited Dec 18 '17 at 08:05

answered Dec 18 '17 at 07:51

adeltahir

1,087
2
15
31

I was also thinking about this solution but i wasnt sure if this is the right way to do it since it looks like im hardcoding the query parameter. – Yousuf Khan Dec 18 '17 at 07:53
is this the only and right way to pass query parameters? – Yousuf Khan Dec 18 '17 at 07:54
@YousufKhan try `http.post()` instead of `http.get()`. – adeltahir Dec 18 '17 at 07:55
yeah its actually an authentication the method should look for the username in the database if its there then it returns the id of it. so should I use post instead of get? – Yousuf Khan Dec 18 '17 at 07:56
http.post doesnt work and the browser now shows Cross Origin policy error – Yousuf Khan Dec 18 '17 at 07:59
It's a different issue. If you are integrating the web service api deployed on different server or port no, you can only call `GET` method unless you set allow cross origin policy to `*`. There are many answers for this. for e.g. https://stackoverflow.com/questions/25702991/enabling-cors-in-codeigniter-restserver-by-chriskacerguis – adeltahir Dec 18 '17 at 08:01
`http.get('http://localhost/ci-abc/api/get_userid?username=' + username)` worked but im curious is this the right and ethical way and there is no other way to pass query string in angular 4? – Yousuf Khan Dec 18 '17 at 08:02
Like this? `http.get('http://localhost/ci-abc/api/get_userid?' + myParams.toString())` – adeltahir Dec 18 '17 at 08:04
I did this `let username = 'yousuf';` `return this.http.get('http://localhost/ci-abc/api/get_userid?username='+username) .map(res=>res.json());` – Yousuf Khan Dec 18 '17 at 08:05
`myParams.toString()` would be more preferable way. It won't look like hard coding. – adeltahir Dec 18 '17 at 08:07

How to pass parameter in Angular4 to codeigniter API

1 Answers1