Блог

Действительно новичок в firebase и очень младший уровень кода. Я пытаюсь выяснить ошибку, из-за которой пользовательский 404 не отображается, или при изменении перезаписи приложение не работает.

 "rewrites": [
      {
        "source": "**",
        "function": "app"
      }
    ]
  

Это перенаправляет все в приложение, и приложение работает должным образом. Однако 404.html не отображается при попытке использования неверного URL-адреса. Существует общий «Не удается ПОЛУЧИТЬ / asdfasd»

Изменил его на

 "rewrites": [
      {
        "source": "/",
        "function": "app"
      }
    ]
  

Теперь будет отображаться пользовательский 404.html правильно.

Однако при этом функция отвечает 404 с этой конфигурацией, прерывая работу приложения. Из functions/index.js:

 app.post('/sendsmstoconsumer', (request, response) => {
    client.messages
      .create({body: request.body.message, from: ' 15555555555', to: request.body.phone})
    .then(message => {
        response.send("Your message: "   request.body.message   " has been sent!")
    });
})
  

Я пробовал несколько вариантов, как показано ниже, но я просто что-то упускаю.

       {
        "source": "/",
        "function": "app"
      },
      {
        "source": "/sendsmstoconsumer",
        "function": "sms"
      }
    ]
  

изменить functions/index.js:

 exports.sms = functions.httpsOnRequest((request, response) => {
    client.messages
      .create({body: request.body.message, from: ' 15555555555', to: request.body.phone})
    .then(message => {
        response.send("Your message: "   request.body.message   " has been sent!")
    });
})
  

Я был бы признателен за любую помощь в правильном структурировании перезаписи или изменении функции, как пользовательский 404, так и приложение работают должным образом. Кажется, я застрял с получением либо одного, либо другого.

Спасибо.

По запросу редактирование для добавления полных файлов:

firebase.json

 {
  "database": {
    "rules": "database.rules.json"
  },
  "hosting": {
    "public": "public",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "function": "app"
      }
    ]
  },
  "emulators": {
    "functions": {
      "port": 5001
    },
    "database": {
      "port": 9000
    },
    "hosting": {
      "port": 5000
    },
    "ui": {
      "enabled": true
    }
  }
}
  

index.js

 const functions = require('firebase-functions')
const express = require('express')
const app = express()
const accountSid = 'xxx'
const authToken = 'xxx'
const client = require('twilio')(accountSid, authToken)
const cors = require('cors')

// Enable cors for everything
// TODO: Re-enable cors at a later date 
// src: https://www.npmjs.com/package/cors
app.use(cors())

app.post('/sendsmsverificationmessage', (request, response) => {
    client.verify.services('xxx')
        .verifications
        .create({to: request.body.phone, channel: 'sms'})
    .then(verification => {
        response.send("Your verification code has been sent to your phone!" )
    });
})

app.post('/verifyusersphonenumber',  (request, response) => {
    client.verify.services('xxx')
        .verificationChecks
        .create({to: request.body.phone, code: request.body.token})
    .then(verification_check => {
        response.send("Your phone has been verified!")
        
    });
})

app.post('/sendsmstoconsumer', (request, response) => {
    client.messages
      .create({body: request.body.message, from: ' 15555555555', to: request.body.phone})
    .then(message => {
        response.send("Your message: "   request.body.message   " has been sent!")
    });
})

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

По умолчанию перезапись не «проваливается» после сопоставления, поэтому ответ, отправленный облачной функцией, всегда будет возвращаться непосредственно пользователю. На самом деле есть способ обойти это: если тело вашего ответа содержит заголовок X-Cascade: PASS .

В этом случае хостинг Firebase перейдет к поведению 404 по умолчанию (включая пользовательский 404.html ). Вы должны иметь возможность добавить это в свое экспресс-приложение следующим образом:

 // *AFTER* all other endpoints
app.use((req, res) => {
  res.set('X-Cascade', 'PASS');
  res.status(404).send('Not Found');
});
  

Благодаря ответу Майкла Блейга мы нашли решение, но должны были указать 404.html досье.

 app.use((req, res) => {
    res.set('X-Cascade', 'PASS')
    res.status(404).redirect('404.html')

})