So I know there are a lot of CORS posts out there and I'm just adding them but I can't find any answers that can help me. So I'm building an Angular 4 application that relies on my php api. It works fine locally, when I throw it on the domain with the app at app.example.com and the api at api.example.com I can't Because of my login I get the following error:

XMLHttpRequest cannot load http://api.example.com/Account/Login. Response to preflight request failed access control check: No 'Access-Control-Allow-Origin' header present in request resource. So source "http://app.example.com" is not allowed access.

My php code looks like this:

$http_origin = $_SERVER['HTTP_ORIGIN'];

$allowed_domains = array(
    'http://example.com',
    'https://example.com',
    'http://app.example.com',
    'https://app.example.com',
    'http://www.example.com',
    'https://www.example.com'
);

if (in_array(strtolower($http_origin), $allowed_domains))
{  
    // header("Access-Control-Allow-Origin: *");
    header("Access-Control-Allow-Origin: $http_origin");
    header('Access-Control-Allow-Credentials: true');
    header('Access-Control-Max-Age: 86400');
}

// Access-Control headers are received during OPTIONS requests
if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
        header("Access-Control-Allow-Methods: GET, POST, OPTIONS");
        header("Access-Control-Allow-Headers: Authorization, Content-Type,Accept, Origin");
    exit(0);
}

My Angular post looks like this:

public login(login: Login): Observable<LoginResponse> {
    let headers = new Headers();
    headers.append('Content-Type', 'application/x-www-form-urlencoded');
    headers.append('Authorization', 'Basic ' + btoa(login.Username + ':' + login.Password));
    return  this.http.post(this.apiBaseUrl + '/Account/Login', "grant_type=client_credentials", { headers: headers })
        .map(response => {
            // code
        });
}

If I run the request through Postman (this does not affect CORS) I get:

{ "error": "invalid_client", "error_description": "Client credentials were not found in the headers or body" }

I tried setting the origin to '*' just to test and see if this was the core of the problem, but it still failed the same way.

edit Just updating with the information below. Changing the case in the header has no effect, and pulling the code out of the if statement has no effect either.

I debugged the php by telling my live application to go to the local api and the php is working as expected. It sets the header and puts it into every if statement.

Edit Shot 2 I really need some help and if anyone has any ideas I would really appreciate it.

Edit Shot 3 If I set all the header stuff in .htaccess instead of php it lets me pass. However, now I'm stuck with the error listed above, which is the error I always get when using Postman, but now when using the actual website.

{"error":"invalid_client","error_description":"Client credentials not found in header or body"}

My response headers are like this

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:authorization, content-type, accept, origin
Access-Control-Allow-Methods:GET, POST, OPTIONS
Access-Control-Allow-Origin:*

Once it's working I'll change it from * to just my domain. But now I leave it as *.

As requested my header.