12

当我刷新我的网站时,我得到了404。这是与Angular2,打字稿和firebase。当我刷新我的网站时,我得到了404。这是与Angular2和firebase

我已经部署到firebaseapp与我的Angular2应用程序。

路线似乎改变很好,但是当我刷新浏览器时,它将我重定向到404页面。

当我刷新本地这不会发生。

我是否缺少任何路线设置或Firebase设置?

这是我firebase.json文件:

{ 
    "firebase": "test", 
    "public": "src", 
    "ignore": [ 
    "firebase.json", 
    "**/.*", 
    "**/node_modules/**" 
    ] 
} 
+0

让我知道是否有人需要看到angular2路线 – AngularM

+0

我得到404重定向到firebase 404页 – AngularM

+1

当我通过浏览器刷新时发生[Angular 2:404错误]的可能重复(http://stackoverflow.com/questions/35284988/angular-2-404-error-occurrence-when-i-refresh-through-browser) –

回答

14

对于火力地堡主机上的重定向文件和重写是在这里:https://www.firebase.com/docs/hosting/guide/url-redirects-rewrites.html

从那里:

当你想要显示的使用重写相同的内容多个网址。重写对于模式匹配非常有用,因为您可以接受任何与模式匹配的URL,并让客户端代码决定要显示的内容。

你很可能会寻找一个页面上的第重写示例:

rewrites": [ { 
    "source": "**", 
    "destination": "/index.html" 
} ] 

这是web服务器以服务/index.html任何传入的请求,无论路径是什么样的指令。

+0

谢谢你运作良好 – AngularM

+0

@AngularM或任何懂得如何解决问题的人,他们会提供一个从URL中删除'#'程序的工作示例吗? –

+0

英镑符号(hashtag)可以使用$ locationProvider移除,如此处所示https://scotch.io/tutorials/pretty-urls-in-angularjs-removing-the-hashtag – Felipe

16

我认为你使用Angular2路由的默认模式(即HTML5LocationStrategy)。在这种情况下,您需要在Web服务器上进行一些配置,以便为每个路由对应的每个URL加载index.html(您的入口点文件)。

如果你想切换到HashBang方法,您需要使用此配置:

import {bootstrap} from 'angular2/platform/browser'; 
import {provide} from 'angular2/core'; 
import {ROUTER_PROVIDERS} from 'angular2/router'; 
import {LocationStrategy, Location, HashLocationStrategy } from 'angular2/router'; 

import {MyApp} from './myapp'; 

bootstrap(MyApp, [ 
    ROUTER_PROVIDERS, 
    provide(LocationStrategy, {useClass: HashLocationStrategy} 
]); 

在这种情况下,当你刷新页面,它会再次出现。

希望它可以帮助你, 蒂埃里

+0

我不想哈希方法 – AngularM

+1

所以你需要配置你的服务器端为你定义的每条路由提供'index.html'文件... –

+0

我是如何做到这一点的firebase托管?并以angular2? – AngularM

相关问题