为什么Google Places API自动完成功能可在localhost上运行，而在Firebase部署后却无法使用？

Question

我一直在尝试向HTML表单添加自动完成功能，当我在localhost尝试正常运行时，但是在部署到Firebase之后，自动完成功能未显示任何选项。

我们的Google Cloud API不受应用程序限制，并且API受以下条件限制： Places API Maps JavaScript API 地理位置API 地理编码API

这就是我将aPI包含在index.html中的方法：

   <script async defer src="https://maps.googleapis.com/maps/api/js?key=API-KEY&libraries=places" type="text/javascript"></script>

这里是其他react组件的实现：

  // @ts-ignore
  const google = window.google;

  if (google) {
    google.maps.event.addDomListener(window, 'load', cityInput);
  }

cont input = document.getElementById('city') as HTMLInputElement;
const types = { types: ['(cities)'], componentRestrictions: { country: 'es' } }
const autocomplete = new google.maps.places.Autocomplete(input, types);

 <input
          readOnly={this.props.readonly}
          id={this.props.id} // city
          className="input"
          onBlur={this.handleChange}
          onKeyUp={this.handleChange}
          placeholder={this.props.placeholder}
          defaultValue={this.props.value}
        />

有什么想法可以测试或更改吗？

谢谢大家。