Funkcja Firebase https onCall zablokowana przez cors

Question

Mam funkcję sendMailchmury, której chcę używać do wysyłania e-maili z formularza kontaktowego na mojej stronie. Witryna jest hostowana w Firebase z niestandardową domeną Google. Problem polega na tym, że otrzymuję ten błąd za każdym razem, gdy próbuję wywołać funkcję z hostowanej witryny.

Oto, czego próbowałem do tej pory

1. Próbowałem przetestować tę funkcję lokalnie z przeglądarki i działa dobrze. Brak błędu cors.
2. Testowanie przez wywołanie funkcji z powłoki firebase również działa dobrze, bez żadnego błędu cors.

1. Sprawdziłem moją konsolę Google Cloud i upewniłem się, że wszyscy użytkownicy mogą wywołać tę funkcję.
   

4. Próbowałem również użyć biblioteki cors do opakowania funkcji, ale to też nie zadziałało:

Oto jak nazywam swoją sendMailfunkcję:

handleSubmit = (e) => {
    e.preventDefault();
    const sendMail = firebase.app().functions('us-central1').httpsCallable("sendMail");
    
    sendMail({ details: this.state })
      .then((res) => {
        this.setState({
          loading: true,
        });
        this.notify("success");
      })
      .catch((error) => {
        this.notify(error);
      });
  };

Oto cała sendMailfunkcja:

const functions = require("firebase-functions");
const admin = require("firebase-admin");
const cors = require("cors")({ origin: true });
const nodemailer = require("nodemailer");

admin.initializeApp();

// Use gmail to set up transporter
let transporter = nodemailer.createTransport({
  service: "gmail",
  auth: {
    user: functions.config().mail.user,
    pass: functions.config().mail.pass
  },
});

exports.sendMail = functions
  .region("us-central1")
  .https.onCall((data, context) => {
    const info = data.details;
    const mailOptions = {
      from: `${info.name} <${info.email}>`,
      to: functions.config().mail.dest,
      subject: info.subject,
      html: `<p style="font-size: 16px;">${info.name}, ${info.email}</p>
                    <p
                    style="
                        font-size: 1rem;
                        background: #FFECB3;
                        padding: 10px;
                        border-radius: 10px;">${info.message}</p>
                `, // email content in HTML
    };

    // returning results
    return transporter.sendMail(mailOptions, (err, info) => {
      if (err) {
        console.log("failed", err);
      }
    });
  });

Wiem, że zadawano podobne pytania, ale naprawdę próbowałem prawie wszystkiego. Problem z wersją cors pojawia się TYLKO podczas wywoływania go z mojej witryny hostowanej przez Firebase. Niech ktoś pomoże!

Answer 1

OnCall zachowuje się inaczej niż onRequest w odniesieniu do rdzeni, na przykład musisz upewnić się, że dzwonisz z tego samego regionu. Zobacz ten post

Problem z cors może wystąpić, jeśli twoja funkcja zawiera błędy, warto sprawdzić w emmulatorze i odpowiedzi na wysłaną wiadomość e-mail.