[SOLVED] 405 Method Not Allowed using Angular 4's HttpClient

I’m using slim3 as my web API and ionic framework for my mobile app. I’m trying to implement log-in functionality and I’m sending my post request as follows:
return this.http.post(http://xxxxx.com/api/public/v1/login, credentials).subscribe( data => {
alert(JSON.stringify(data));
}, err => {
alert(JSON.stringify(err));
});
My slim routes are set up as follows:
$app->options(’/{routes:.+}’, function (Request $request, Response $response, array $args) {
return $response;
});

$app->add(function (Request $req, Response $res, $next) {
    $response = $next($req, $res);
    return $response
            ->withHeader('Access-Control-Allow-Origin', '*')
            ->withHeader('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type, Accept, Origin, Authorization')
            ->withHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
});
//Login
$app->post('/v1/login', function(Request $req, Response $res, array $args){
    $data = $req->getParsedBody();
    $email = $data['login'];
    $password = md5($data['password']);
    //Query db for user
    return $this->response->withJson(true);
});

But when I run the app, I get a 405 Method Not Allowed error with the message: Method not allowed. Must be one of : OPTIONS.

Could anyone please point out what I might be doing wrong?

shouldn’t it be

$app->post(‘api/public/v1/login’,

As @tstadler points out, it is probably the URL that is wrong. The message is misleading though.

You are using the simple CORS setup. In the first route a route is set up that matches all URLs, but only OPTION methods:

When you call a URL that Slim cannot match, you get an error message that the first route ($app->options) matches the URL, but not the method.

You can fix this be either using the middleware solution described in the documentation on CORS, or add a catch all route for the default methods that ensures you get a 404 if none of the non-option routes match.

// catch all route for unhandled routes
// NOTE: make sure this is the last defined route
$app->map(['GET', 'POST', 'PUT', 'DELETE', 'PATCH'], '/{routes:.+}', function($req, $res) {
        $handler = $this->notFoundHandler; // handle using the default Slim 404 handler
        return $handler($req, $res);
});

I get what you’re saying @llvdl. But as you can see from my code above, I’m sending a POST request to /v1/login and aptly the route exists in my routes.php file as below:

//Login
$app->post('/v1/login', function(Request $req, Response $res, array $args){
    $data = $req->getParsedBody();
    $email = $data['login'];
    $password = md5($data['password']);
    //Query db for user
    return $this->response->withJson(true);
});

Why it’s not being consumed/recognized is what is puzzling me.

Thanks @tstadler. But the route is OK. I can send POST data via Postman and hit the endpoint just fine.

Hey @tstadler and @llvdl. Thanks for your input. Turns out it was a phone related issue. Tried a different phone and it worked like a a charm.