Question

我遇到了CORS个问题。在我的functions/index.js中，我有：

const cors = require('cors')({
  origin: true
});

我的端点是https://sis-t.redsys.es:25443/sis/realizarPago。我需要使用客户端的适当参数对此URL进行POST，这是在Firebase环境之外。我也有允许外部网络的正确计划，但是向源地址以外的地址发出请求会触发CORS问题：

我读到您只需要修改标题，但这仅在您向自己的服务器发出请求时适用。当您执行http.onRequest()时，可以在函数内部使用中间件，但是在对外部服务器进行POST时会发生什么？

这是执行axios的{{1}}函数：

POST

这些是服务器端功能：

cardPay: function () {
  this.cardProcess = true
    axios({
      method: 'post',
      url: 'https://us-central1-cutre-windrider.cloudfunctions.net/cardPay',
      data: {
        verifiedUserLogged: this.userLogged.uid,
        cart: this.cartItemList,
        finalPrice: this.serverPrice,
        deliveryInfo: this.userLogged.deliveryAdress,
        name: this.userLogged.displayName || false,
        email: this.userLogged.email
      }
    })
    .then(response => {
      this.requestData = response
      this.redsysRedirect(response.data.data)
    })
    .catch(console.log)
    },
redsysRedirect: function (data) {
  axios.post('https://sis-t.redsys.es:25443/sis/realizarPago', {
    'Ds_SignatureVersion': 'HMAC_SHA256_V1',
    'Ds_MerchantParameters': data.merchantParameters,
    'Ds_Signature': data.signature
  }).then(console.log).catch(console.log)

Answer 1

对于将来会遇到此问题（或我未来的自我）的人：

如果您已经使用cors软件包配置了CORS，并且认为自己配置正确，并且在浏览器控制台中仍然出现CORS错误，请查看以下文章：

https://haha.world/firebase-cors/

从本质上讲，这是一种误导性的错误，是从Google Cloud Functions返回的，而实际上该错误在您的代码逻辑中（根本与CORS完全无关）

因此，修复此错误的第一步是检查Google Cloud Functions日志（或Firebase Cloud Functions日志），以查看您的函数是否由于代码中的任何错误而崩溃。然后修复它。

注意：对于没有我上面描述的问题的人，您可以查看其他答案或查看以下资源：

Answer 2

在Firebase Function响应标头中，您可以明确允许所有起源：

exports.handler = ((req, res) => {
    res.set({ 'Access-Control-Allow-Origin': '*' }).sendStatus(200)
})

或者您可以修改它以仅允许特定来源。通常，这是我过去使用Firebase功能解决CORS问题的方式。

Answer 3

签出https://cloud.google.com/functions/docs/writing/http#handling_cors_requests。从该文档中-

  <img v-for="n in subArray" :key="n" :src="/static/images/${n}.png">

如何解决Firebase功能环境中的CORS？

3 个答案: