Ionic PWA to FIrebase calling Google Maps API

Hi all I am having some trouble deploying my app to firebase and calling out to googles api’s getting an odd parsing issue where the index.html file is being parsed back, I assume the proxy is resolving in some odd manner, this does work in dev just not in prod.

Here are the steps I have followed:

Proxy set to the following in ionic.config.json

"proxies": [{
    "path": "/api",
    "proxyUrl": ""

calls done from providers as follows:


Have also tried setting headers to

httpOptions = {
    headers: new HttpHeaders({
      'Content-Type':  'application/json'

import { HttpClient } from '@angular/common/http';

readonly PLACES_PREFIX = "/api/maps/api/place/nearbysearch/";

public getPlaces(lat: number, lng: number, radius: number, unitType: string, searchType: string) {
    let search = this.PLACES_PREFIX + "json?location=" + lat + ","+ lng + "&type=" + searchType + "&radius=" + radius + "&units=" + unitType + "&key=" + this.API_KEY;
    return this.http.get(search);

this.nearbyLocationsProvider.getPlaces(, this.lng, this.selectedTravelType.distance, "metric", this.selectedSearchType.googleSearchTerm).subscribe((res: any) => {

This works in dev when posting to firebase I get:

SyntaxError: Unexpected token < in JSON at position 0
    at JSON.parse (<anonymous>)

with the error text being:

"<!DOCTYPE html>
<html lang="en" dir="ltr">
  <script data-ionic="inject">
    (function(w){var i=w.Ionic=w.Ionic||{};i.version='3.9.2';i.angular='5.0.3';i.staticDir='build/';})(window);

This is the contents of my index.html. I have tried a lot of alternatives to get this working and I feel it has to do with redirection to index.html not allowing the query to leave however a bit lost from here.

This works with the auto complete library and AGM however not when utilising http.get only in prod.

Thanks for any help in advance

I got around this by utilising the js libraries provided by google