在使用Firebase服务Angular Universal时如何解决“所有页面的视图源返回404屏幕的html”的问题

时间:2019-08-07 08:35:20

标签: angular firebase google-cloud-functions angular-universal server-side-rendering

我已按照本课程(https://fireship.io/lessons/angular-universal-firebase/)介绍了如何将Angular Universal应用程序部署到Firebase Cloud功能。

现在,当我使用npm run build:ssr && cd functions && npm run build && firebase serve之类的Angular应用程序时,一切似乎运行正常,没有错误。

=== Serving from '/Users/jopmiddelkamp/Projects/Test/firebase-test-app'...

⚠  Your requested "node" version "8" doesn't match your global version "12"
i  hosting: Serving hosting files from: dist/browser
✔  hosting: Local server: http://localhost:5000
✔  functions: Emulator started at http://localhost:5001
i  functions: Watching "/Users/jopmiddelkamp/Projects/Test/firebase-test-app/functions" for Cloud Functions...
✔  functions[ssr]: http function initialized (http://localhost:5001/firebase-test-app/us-central1/ssr).

但是,当我查看页面源代码时,它们都被解析为404页面源代码。

因此,localhost:5000/about显示了关于页面。

但是,view-source:localhost:5000/about显示404页面的来源。

现在,我认为localhost:500/about页面也有问题。最初它像404那样被渲染,但是随后Angular客户端被引导并正确显示about页面。

我只是不明白,为什么第一个请求向我显示404页。.我可以想象它与路由器中找不到的功能URL有关。但是我只是没有足够的Angular和Firebase经验,所以不明白为什么。

与Google一起,我也找不到解决方案。。由于缺乏经验,我本可以一直在搜索工作关键字。

希望这里有人可以帮助我解决这个问题?非常感谢!

此外,我已经能够通过一个非常基础的新Angular Universal项目来重现它。

https://github.com/jopmiddelkamp/firebase-test-app

0 个答案:

没有答案