如何在从 Google api 位置获取照片时隐藏类元素中的 api

Question

用于本机和 Web 应用程序的离子电容器和 React

当我使用下面的代码从 google api 获取照片数据时。它工作得很好，但是当我在网站上检查时，我可以在照片 src 上看到我的 APIKEY 我该如何解决这个问题或者我应该做什么？

const fetchPhoto = async () => {
    if (photoName) {
      try {
        const maxHeightPx = 500;
        const maxWidthPx = 500;

        const url = `https://places.googleapis.com/v1/${photoName}/media?key=${GOOGLE_PLACES_API_KEY}&maxHeightPx=${maxHeightPx}&maxWidthPx=${maxWidthPx}`;
        const response = await CapacitorHttp.post({ url });
        setPhoto(response.url);
        setLoading(false);
      } catch (error) {
        setPhoto(images.thumbnail);
        setLoading(false);
        console.error("Error while fetching photo:", error);
      }
    }
  };

我不知道该怎么办

Answer 1

1. 您不应该像这样在代码中调用 api。
2. 使用 google 提供的 example 设置！