Javascript Angular 6项目刷新后显示404错误_Javascript_Html_Angular_Angular6

Javascript Angular 6项目刷新后显示404错误

javascript html angular angular6

Javascript Angular 6项目刷新后显示404错误,javascript,html,angular,angular6,Javascript,Html,Angular,Angular6,刷新angular页面时会出现404服务器错误，如果手动导航到搜索栏中的目录，也会出现同样的错误。我通过IIS服务器托管只有在使用ngbuild--prod构建angular项目并将其上载到web服务器时，才会出现此问题。很多人说应该使用hash方法，但我不想在我的url中显示hash，这是一种非常古老的方法。有些人还说我应该在我的中更改我的标记，但这没有起作用这是我index.html中的标记，如果有用的话 <head>  <

刷新angular页面时会出现404服务器错误，如果手动导航到搜索栏中的目录，也会出现同样的错误。我通过IIS服务器托管

只有在使用

ngbuild--prod

构建angular项目并将其上载到web服务器时，才会出现此问题。很多人说应该使用hash方法，但我不想在我的url中显示hash，这是一种非常古老的方法。有些人还说我应该在我的

中更改我的

标记，但这没有起作用

这是我index.html中的

标记，如果有用的话

<head>
<!-- META DATA -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- APP -->
<title>SebastianElstadt</title>
<base href="/">
<link rel="icon" type="image/x-icon" href="assets/images/app-icon.png">

<!-- STYLES -->
<link rel="stylesheet" href="[fontawesome cdn]">
</head>


塞巴斯蒂安内斯塔特

我还使用了一个组件，如果输入的URL与我定义的任何路径都不匹配，就会显示该组件。但是它没有被显示出来

总之，每当我刷新页面或手动在angular站点的搜索栏中导航时，它都会显示404服务器错误页面。我不想使用哈希方法。

我不知道您使用的是哪台服务器，但如果您不想使用哈希方法，则必须将每个请求重定向到运行angular应用程序的index.html

如果服务器找不到路由/your/sub/route并显示“404未找到”。

您应该检查Angular应用程序的部署。它需要基于http服务器的特定配置。例如，对于Apache，在项目根目录中需要以下.htaccess文件

重新编写引擎打开
#如果请求了现有资产或目录，请按原样转到该资产或目录
RewriteCond%{DOCUMENT_ROOT}%{REQUEST_URI}-f[或]
重写cond%{DOCUMENT\u ROOT}%{REQUEST\u URI}-d
重写规则^-[L]
#如果请求的资源不存在，请使用index.html
重写规则^/index.html

您可以通过创建web.config文件来解决此问题：

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
    <defaultDocument>
        <files>
            <clear />
            <add value="index.html" />
        </files>
    </defaultDocument>
    <rewrite>
      <rules>
        <rule name="AngularJS Routes" stopProcessing="true">
          <match url=".*" />
          <conditions logicalGrouping="MatchAll">
            <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
            <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />   
          </conditions>
          <action type="Rewrite" url="/" logRewrittenUrl="true" />
        </rule>
      </rules>
    </rewrite>
 <security>
        <requestFiltering allowDoubleEscaping="true">
            <fileExtensions>
                <add fileExtension=".json" allowed="true" />
            </fileExtensions>
        </requestFiltering>
</security>
    <directoryBrowse enabled="true" />
<staticContent>
<remove fileExtension=".woff" />
<remove fileExtension=".woff2" />
<mimeMap fileExtension=".woff" mimeType="application/font-woff" />
<mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
</staticContent>
</system.webServer>
</configuration>


这将解决您的问题，将.htaccess文件添加到项目的根目录中
然后把这个内容
<IfModule mod_rewrite.c>
<IfModule mod_negotiation.c>
    Options -MultiViews -Indexes
</IfModule>

RewriteEngine On

# Handle Authorization Header
RewriteCond %{HTTP:Authorization} .
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]

# Redirect Trailing Slashes If Not A Folder...
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} (.+)/$
RewriteRule ^ %1 [L,R=301]

# Handle Front Controller...
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [L]
</IfModule>


选项-多视图-索引
重新启动发动机
#句柄授权头
RewriteCond%{HTTP:Authorization}。
重写规则。*-[E=HTTP\U授权：%{HTTP:AUTHORIZATION}]
#如果不是文件夹，则重定向尾部斜杠。。。
重写cond%{REQUEST_FILENAME}-D
重写cond%{REQUEST_URI}（+）/$
重写规则^1[L，R=301]
#处理前控制器。。。
重写cond%{REQUEST_FILENAME}-D
重写cond%{REQUEST_FILENAME}-F
重写规则^index.html[L]
“旧”并不意味着“坏”。作为一个初学者，我宁愿在我的URL中看到一个散列，也不愿重新配置我的服务器。但要回答您，这是一个HTTP服务器问题，而不是角度问题。您应该使用正确的标记来标识您的服务器，否则您将无法获得适当的答案。您需要使用我按照步骤为IIS服务器设置web.config文件，但现在每当我导航到我的网站时，它只会显示500-Internal serverError@Sebastian那么您的web.config文件中可能有错误。我不知道您的配置是什么，也不知道您是如何构建您的服务器环境的，所以很难说，除非您分享更多关于这方面的信息。我只是想确定，我是要在代码中到处更改还是直接复制？您可以按原样使用它。还可以使用IIS自动生成此文件。我添加了web配置文件的标题，以便您可以直接使用。谢谢，但无论何时添加web.config文件并添加此代码，都会加载500-内部服务器错误。值得注意的是，此解决方案需要在IIS上安装“重写模块”。你可以用谷歌搜索或者使用“web平台安装程序”工具。