Angular 7 Universal Firebase 路由

Posted

技术标签:

【中文标题】Angular 7 Universal Firebase 路由【英文标题】:Angular 7 Universal firebase routing 【发布时间】:2019-09-30 08:33:56 【问题描述】:

我遵循了这个教程:https://fireship.io/lessons/angular-universal-firebase/

似乎一切正常。我可以通过我的 firebase 托管网址查看 Angular 应用程序。 但是:只要我直接调用路线,例如http://xxx.firebase.app/home我收到此错误(从 firebase 函数日志中复制)

TypeError: handler is not a function
    at cloudFunction (/srv/node_modules/firebase-functions/lib/providers/https.js:57:9)
    at /worker/worker.js:783:7
    at /worker/worker.js:766:11
    at ZoneDelegate.invokeTask (/srv/dist/server.js:5145:31)
    at Zone.runTask (/srv/dist/server.js:4917:47)
    at ZoneTask.invokeTask (/srv/dist/server.js:5220:34)
    at ZoneTask.invoke (/srv/dist/server.js:5209:48)
    at data.args.(anonymous function) (/srv/dist/server.js:6143:25)
    at _combinedTickCallback (internal/process/next_tick.js:132:7)
    at process._tickDomainCallback (internal/process/next_tick.js:219:9)

如果我打电话只是在没有/home 的情况下调用firebase url,它会将我正确重定向到/home 路由

这是我的路由的样子:

const routes: Routes = [
  
    path: '',
    redirectTo: 'home',
    pathMatch: 'full'
  ,
  
    path: 'home',
    component: HomeComponent
  ,
  
    path: 'privacy',
    component: PrivacyComponent
  
  ,
  
    path: 'imprint',
    component: ImprintComponent
  
];

谁能解释一下,问题出在哪里?

【问题讨论】:

xxx.firebase.app/imprint 很遗憾,没有子路由有效 我可能有类似的 Angular 体验。 xxx.firebase.app/home/ 有效吗? (注意末尾附加的/ 不,这也不起作用.. 我也面临同样的问题。关于如何进行的任何想法? 【参考方案1】:

确保您在 const app 之前已将 export 添加到您的 server.ts 文件中。这就是我的案例的问题。

// Express server
export const app = express();

更新

错误解释如下: - 在文件functions/src/index.ts 中,变量app 需要通过以下代码:

const universal = require(`$process.cwd()/dist/server`).app;
exports.s-s-r = functions.https.onRequest(universal);

但是,根据$process.cwd()/dist/server JS 文件(这是server.ts 的转译版本),变量app 是不公开的,因此可以在functions/src/index.ts 中获取对其的访问权限。

这可以通过变量app的声明方式看出:

// Express server
const app = express();

要解决这个问题,只需将变量 app 导出如下:

// Express server
export const app = express();

【讨论】:

以上是关于Angular 7 Universal Firebase 路由的主要内容,如果未能解决你的问题,请参考以下文章

Angular-universal - 生产问题

如何在 Angular 4 Universal 中发出 http post 请求?

在 Angular 中需要 BrowserAnimationsModule 但在 Universal 中出现错误

Angular Universal:未定义导航器

Angular Universal 不适用于 Angular Google 地图

Angular 2 Universal 中的身份验证,nodejs