Question

我正在尝试在Firebase托管中使用SSR实现Nuxt（使用Firebase函数），但是在触发函数后，我一直收到“ 504超时，等待函数响应”的信息。

我的Firebase功能：

const functions = require("firebase-functions");
const { Nuxt } = require("nuxt");
const express = require("express");
const app = express();

const config = {
    dev: false,
    buidlDir: 'src',
    build: {
        publicPath: '/'
    }
};

const nuxt = new Nuxt(config);

function handleRequest(req, res){
    console.log('handling request');
    //res.set('Cache-Control', 'public, max-age=600, s-maxage=1200')
    nuxt.renderRoute('/')
    .then(result => {
        console.log('result: ' + result.html);
        res.send(result.html);
    })
    .catch(e => {
        res.send(e);
        console.log(e);
    })
}
app.get('*', handleRequest);
exports.ssrApp = functions.https.onRequest(app);

我也尝试过：

function handleRequest(req, res) {
    console.log("log3");
    res.set("Cache-Control", "public, max-age=300, s-maxage=600");
    return new Promise((resolve, reject) => {
      nuxt.render(req, res, promise => {
        promise.then(resolve).catch(reject);
      });
    });
  }

我也将节点vs8作为函数的默认值，因为我读到这可能会带来问题。：

  "engines": {
    "node": "8"
  },

但结果相同。我的功能已被触发，但始终会超时，顺便说一句：我在本地以及尝试部署到Firebase本身时遇到此问题。

让我知道您是否需要更多信息/代码来尝试帮助并查看可能出现的问题。

Answer 1

首先，如果您想找出原因，请use debug option。

第二，如果遇到超时错误，请检查路径是否有效。如果成功构建Nuxt和nuxt.render，则该错误将由Nuxt处理，并且Nuxt显示this error page。换句话说，如果看不到Nuxt错误页面，则原因可能与Nuxt无关。

由于超时错误，我还停留了4个小时，我终于发现原因是publicPath的内容。

请检查这两件事。

buidlDir有效吗？

buildDir的路径有效吗？您应该检查.nuxt文件夹是否已成功部署到您的云功能。

publicPath内容已成功上传？

.nuxt/dist中的构建内容必须上载到Firebase Hosting。您应该手动检查它。键入URL到地址栏，例如https://test.firebaseapp.com/path/to/file.js

最后，我发布了一个网址 my sample project, using Nuxt and Firebase。

我也像你一样坚持下去，这使我的集会累了。如果这个答案可以帮助像我这样的人，我真的很高兴。

PS：在functions文件夹中构建Nuxt时，nuxt start失败。小心。在我的项目中，我在根目录下构建它，并在部署时复制了它。 Nuxt SSR with Firebase Integration

Answer 2

我遇到了同样的问题，因为 Nuxt还没有准备好（promise尚未定义）

因此，您可以尝试在nuxt.ready()之后添加new Nuxt()

示例：

const functions = require('firebase-functions');
const express = require('express');
const { Nuxt } = require('nuxt');
const config = {
  dev: false
  // Your config
};
const nuxt = new Nuxt(config);
const app = express();

nuxt.ready(); // <---------- Add this!

async function handleRequest(req, res) {
  res.set('Cache-Control', 'public, max-age=1, s-maxage=1');
  await nuxt.render(req, res);
}

app.get('*', handleRequest);
app.use(handleRequest);

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

参考：https://github.com/nuxt/nuxt.js#using-nuxtjs-programmatically

Nuxt SSR Firebase函数返回504超时

2 个答案: