我使用的是Angular 2.0.0-alpha.30版本.当重定向到不同的路由,然后刷新浏览器,它显示无法GET /路由.
你能帮我弄清楚这个错误发生的原因吗？
当我刷新我的网站时,我得到了404.这是使用Angular2,typescript和firebase.
我已经使用我的Angular2应用程序部署到firebaseapp.
路线似乎改变得很好,但是当我刷新浏览器时,它会将我重定向到404页面.
当我在本地刷新时,这不会发生.
我错过了任何路线设置或Firebase设置吗？
这是我的firebase.json文件:
{
"firebase": "test",
"public": "src",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
]
}
firebase typescript firebase-security firebase-hosting angular
我有一个Angular应用程序.我运行命令ng build --prod --aot来生成dist文件夹.在dist文件夹中,我创建了一个名为Staticfile的文件,然后使用以下命令将dist文件夹上传到pivotal.io:
该应用运行良好.我有一个导航栏,所以当我用导航栏改变路径时一切正常.但是当我手动操作时(我自己输入网址)我有这个错误404 Not Found nginx.这是我的app.component.ts:
const appRoutes: Routes = [
{ path: 'time-picker', component: TimePickerComponent },
{ path: 'material-picker', component: MaterialPickerComponent },
{ path: 'about', component: AboutComponent },
{ path: 'login', component: LoginComponent },
{ path: 'registration', component: RegistrationComponent },
{
path: '',
redirectTo: '/time-picker',
pathMatch: 'full'
}
];
@NgModule({
declarations: [
AppComponent,
TimePickerComponent,
MaterialPickerComponent,
DurationCardComponent,
AboutComponent,
LoginComponent, …nginx cloud-foundry angular-routing pivotal-cloud-foundry angular
我正在尝试将服务工作者添加到我们现有的angular(5.2,CLI 1.7.1)应用程序中.我做了我想做的一切:
ng set apps.0.serviceWorker=true命令,所以我"serviceWorker": true,在angular-cli.json中."@angular/service-worker": "5.2.9"我添加到app.module.ts:
import { ServiceWorkerModule } from '@angular/service-worker';
imports: [
...
ServiceWorkerModule.register('/ngsw-worker.js',
{ enabled: environment.production }),
]
我甚至试图将这段代码(我在某处找到解决方案)添加到main.ts中
platformBrowserDynamic().bootstrapModule(AppModule).then(() => {
if ('serviceWorker' in navigator && environment.production) {
navigator.serviceWorker.register('/ngsw-worker.js');
}
}).catch(err => console.log(err));
但我得到了这个错误:
未捕获(在promise中)DOMException:无法注册ServiceWorker:脚本具有不受支持的MIME类型('text/html').
错误:未捕获(在承诺中):SecurityError:无法注册ServiceWorker:脚本具有不受支持的MIME类型('text/html').at resolvePromise(polyfills.3e9ea997ddae46e16c09.bundle.js:1)
在我自己的个人小应用程序中,我做了同样的工作,没有任何错误.我们遇到此错误的应用程序非常庞大.有很多第三方库.我读过它们可能有问题.
你能帮我吗？
此外,我正在检查我自己的应用程序以找到可能的差异,我没有,但我查看了devtools中的网络选项卡,我注意到应该由服务工作者缓存的文件总是被加载.请问这是正确的行为吗？
现在,我的网站的网址看起来像这样,因为我正在使用此处描述的方法
是否可以删除网址中的哈希值而不会出现404错误？
编辑:路由器模块添加
const appRoutes: Routes = [
{ path: '', component: HomeComponent },
{ path: 'cadastro', component: CadastroNoivosComponent },
{ path: '**', component: HomeComponent }
];
export const routing = RouterModule.forRoot(appRoutes);
我的Angular 2应用程序使用默认的HTML 5 history.pushState 位置策略.如何使用history.pushState浏览器刷新配置服务器并且浏览器URL不生成404s？
例如,Tour of Heroes应用程序有一些不同的应用程序路径,例如:
http://localhost:8080/dashboard
http://localhost:8080/heroes
http://localhost:8080/detail/13
如果你打刷新在这些航线上的一个,或键入一个URL,你会得到404,因为/detail/13是一个应用程序的路线,而不是服务器资源.我已将位置策略配置head在我的顶部index.html:
<!doctype html>
<html>
<head>
<base href="/">
<meta charset="utf-8">
<title>Tour of Heroes</title>
但是如何配置服务器以便将所有URL发送到我的应用程序而不是生成404？
注意:这个问题是问题的补充当我通过浏览器刷新Angular 2:404错误时,Angular 2.0路由器无法重新加载浏览器,询问如何解决此问题.对于Firebase,有这样的:当我刷新我的网站时,我得到一个404.这是使用Angular2和firebase,对于Apache,这就是:Angular路由的htaccess重定向.
我在使用Nginx的远程服务器上部署了Angular 4应用程序，并可以通过以下地址进行访问：http://xx.xx.xx.xx/app。该应用程序运行良好，可以在我的网站中导航，但是例如刷新一页时http://xx.xx.xx.xx/app/page1，它将显示nginx的index.html页面。
Nginx的页面位于中/usr/share/nginx/html，而我的应用程序的页面位于中/var/www/app。
nginx.conf
server {
listen 80 default_server;
listen [::]:80 default_server;
server_name _;
root /usr/share/nginx/html;
include /etc/nginx/default.d/*.conf; */
location /app {
root /var/www;
try_files $uri $uri/ /index.html;
}
}
似乎root /var/www在刷新期间未考虑该行。
我听到了有关try_files错误的消息，似乎我需要在某个地方添加重写。感谢帮助。
我正在尝试使用 ng build 来使用“http-server”在生产中部署我的应用程序。
所以我运行了 ng build，然后使用 http-server 为应用程序提供服务。登录后一切正常，我可以访问每个页面。但是，当我刷新页面或单击浏览器的 URL 栏并按 Enter 键时，我收到“404 Not Found”。
使用“npm start”（ng serve）为我的应用程序提供服务时，我没有遇到此问题。
我遇到了错误404，并且在本地存储中丢失了变量，发生了问题，然后我的应用程序上传到了本地主机的服务器中，我没有任何问题
当我重新加载有角度的子组件时，页面变白并且出现错误
拒绝应用来自[URL]的样式，因为它的MIME类型（'text / html'）不是受支持的样式表MIME类型，并且启用了严格的MIME检查。
因此，只要我通过单击更改routerLink所有内容的按钮来浏览页面即可。
我仅production mode遇到此错误，因此在使用时ng serve可以重新加载页面，并且没有收到任何错误，并且在中Developer Tools我还可以看到中的所有文件Source tab，而当我在其中检查页面时却不是这种情况。production mode
我已经
变了
<link rel="stylesheet" href="styles.9eca5df2f679ed98933c.css">
至
<link rel="stylesheet" type="text/css" href="styles.9eca5df2f679ed98933c.css">
建立我的项目跟vendorChunk=true在我angular.json
评论了每个相关的HTML和CSS
删除了我的样式表中的所有评论
设置encapsulation: ViewEncapsulation.None在父母和孩子身上
签<base href="/">入我index.html <head> tag并将其更改为<base href="./">，否则将无法正常工作
我想这里没有样式表，[URL]但我不知道为什么以及如何指定相关样式表的URL，因为styleUrls: ['./dashboard.component.css']在@Component-Decorator中，当我在production mode（--prod）中构建项目时，显然不起作用。
顺便说一下，我不使用任何外部样式表，因为这可能是我搜索此问题时发现错误的原因。
仅在具有以下路由的子组件上会发生此错误：
/<parent>/:id/<child>
导航至
this.router.navigate(['../server/' + guild.id + "/dashboard"], { relativeTo: this.route });
在每个浏览器中
我将不胜感激
angular ×8
angular7 ×2
nginx ×2
angular-cli ×1
angular2-cli ×1
css ×1
firebase ×1
html5 ×1
mime-types ×1
styling ×1
typescript ×1