Question

我正在尝试使用本教程“ https://www.youtube.com/watch?v=LOeioOKUKI8&t=437s”在firebase上部署nodeJS应用程序，我完全按照提示进行操作，并且该应用程序使用“ firebase serve”在本地按预期方式工作，但是当我部署它时，POST和GET请求停止工作，即客户端代码无法到达服务器端。例如，在加载“ appURL / temp” 时，我收到“内容安全政策：该页面的设置阻止了资源的加载” 错误。

我实际上正在尝试做的事情：将JSON数据从客户端发送到服务器，处理数据并返回一些结果作为响应
当前应用程序的操作：接受输入，单击后将其发送到服务器，然后将其返回以响应POST请求

在客户端（public / index.html）

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script defer src="/__/firebase/7.14.6/firebase-app.js"></script>
    <script defer src="/__/firebase/init.js"></script>
  </head>

  <body>

    <h1>Home</h1>
    <input type="text" id="ip">
    <button onclick="send()">send</button>
    <div id="text"></div>

    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
    <script>
      let textDiv = document.getElementById("text")
      function send(){
        let ip = document.getElementById("ip").value;

        axios.post('/home',ip)
        .then( resp => {
          textDiv.innerHTML = JSON.stringify(resp.data);
        })
      }


    </script>
  </body>

在服务器端（functions / index.js

const func = require('./add'); //this is just to wrap the string with brackets
const functions = require('firebase-functions');
const express = require('express');
const multer  = require('multer'); 
const upload = multer();
const app = express();

app.get('/temp', (req, resp) => {
    resp.send("GET Works");
    console.log("GET");
})


app.post('/home', upload.single("data"), (req, res) => {
    console.log(func.add(JSON.stringify(req.body)))
    res.send(func.add(JSON.stringify(req.body)))
});

exports.app = functions.https.onRequest(app);

firebase.json

{
  "hosting": {
    "public": "public",
    "rewrites":[{
      "source": "**",
      "function": "app"
    }],
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  }
}

目录结构

版本
节点：13.6.0
表达：6.13.4
mutler ：6.13.4

NodeJS应用程序在本地工作，但在Firebase上部署时无法

0 个答案: