從 firebase 項目中的 API/網站返回 JSON

Question

我正在 Firebase 上的一個小網站上工作，該網站旨在用作 API，返回 JSON 數據，用於其他一些客戶站點。

因為這是我第一次構建這樣的東西，所以我在途中遇到了一些問題。

該網站是 Firebase 項目的第二個網站。 第一個站點是一個更標准的網站，並且已經按預期運行。

這是我的index.js文件：

import {initializeApp} from 'https://www.gstatic.com/firebasejs/9.15.0/firebase-app.js'
import {getDatabase,ref,onValue} from 'https://www.gstatic.com/firebasejs/9.15.0/firebase-database.js'

const firebaseConfig = {
    apiKey: ".....",
    authDomain: ".....",
    databaseURL: ".....",
    projectId: ".....",
    storageBucket: ".....",
    messagingSenderId: ".....",
    appId: ".....",
    measurementId: "....."
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);


function showIfExist(element,name) {
  if (typeof element != 'undefined') console.log(name+':'+element)
}


const db = getDatabase();
const dbRef = ref(db, 'TopCollection/NiceArea');
onValue(dbRef, (snapshot) => {
  const data = snapshot.val();
  console.log(data)

  data.map((item) => {
    showIfExist(item.mainField,'mainField')
    showIfExist(item.secondField,'secondField')
    showIfExist(item.comment,'comment')
    showIfExist(item.extraComment,'extraComment')
    showIfExist(item.price,'price')
  })
});

如果這可能有用，這里是index.html文件：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <title>API</title>
    <script type="module" src="index.js"></script>
  </head>
  <body>
    <h1>API-PAGE</h1>
  </body>
</html>

這是該站點的firebase.json文件中的托管記錄：

{
  "target": "myapi",
  "public": "myapi/public",
  "headers": [{
    "source": "**",
    "headers": [{
      "key": "Access-Control-Allow-Origin",
      "value": "*"
    }, {
      "key": "Access-Control-Allow-Headers",
      "value": "Access-Control-Allow-Origin"
    }]
  }]
}

最后這是我的問題，我需要一些幫助：

盡管上面的代碼在功能上正常工作並在我的瀏覽器的 Web 開發人員工具控制台中顯示，但這是我所期望的。 我希望結果是 JSON 數據出現在瀏覽器中。

我怎樣才能做到這一點？

Answer 1

在 Firebase 項目中，您可以使用 Cloud Functions 創建一個返回 JSON 數據的 API 端點。 首先，您需要設置一個 Cloud Function 來偵聽 HTTP 請求並返回 JSON 數據。 您可以使用 response.json() 方法返回 JSON 數據作為 HTTP 響應。 部署雲 Function 后，您可以使用 HTTP 客戶端（例如 JavaScript 中的 fetch()）調用端點以檢索 JSON 數據。

從 firebase 項目中的 API/網站返回 JSON

問題描述

1 個解決方案

解決方案1
1 2023-01-21 09:23:40

從 firebase 項目中的 API/網站返回 JSON

問題描述

1 個解決方案

解決方案1 1 2023-01-21 09:23:40

解決方案1
1 2023-01-21 09:23:40