SPDY_PROTOCOL error on HTTP API call to PHP backend

Question

I have an Ionic 4 app with a PHP + mysql db backend. I have developed and tested both locally using XAMPP. Recently, I have migrated my backend to a webhost. When testing via POSTMAN, the call finishes correctly. When, however, creating an HTTP call in Ionic, I always get an error. In chrome, it looks like this:

In IE, the exact same error occurs.

My PHP backend has CORS enabled using the following lines:

Header add Access-Control-Allow-Origin "*"
Header add Access-Control-Allow-Headers "origin, x-requested-with, content-type, authorization"
Header add Access-Control-Allow-Methods: "GET,POST,OPTIONS,DELETE,PUT"

The call in Angular looking like this:

let apiUrl = 'https://xxxxxxxx.000webhostapp.com/index.php/';

@Injectable({
  providedIn: 'root'
})
export class ApiService {

  constructor(public http: HttpClient) { }

  postData(data, type) {
    return new Promise((resolve, reject) => {
      const httpOptions = {
        headers: new HttpHeaders({
          'Content-Type': 'application/json'
        })
      };

      this.http.post(apiUrl + type, JSON.stringify(data), httpOptions).subscribe(res => {
        resolve(res);
      }, (e) => {
        reject(e);
      });
    });
  }

  ...

Finally, the Headers of the failed request in Chrome, if useful:

Some google searchings taught me that this is most likely a CORS related error. I find it weird however that, using POSTMAN, the call works perfectly but via the app it does not, even though I use the same headers, URL and body.

Any help is highly appreciated.

Thanks

Answer 1

To anyone encountering this problem, I fixed this by switching hosts. As you can see in the OP, I had everything set up at 000webhost. A paid host with the same configuration as above fixed it for me. They have a different approach when it comes to generating SSL certificates, and I just assume that was the cause.