Question

我无法让我的一个Angular路线在我的应用程序中工作。基本上我有一个MVC应用程序也使用了几个SPA。

MVC路由如下;

namespace IMR
{
    public class RouteConfig
    {
        public static void RegisterRoutes(RouteCollection routes)
        {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

            // Angular reporting routes...
            routes.MapRoute(
                name: "Reporting",
                url: "Report/{*.}",
                defaults: new { controller = "Report", action = "RptIndex", id = UrlParameter.Optional }
            );

            routes.MapRoute(
                name: "Charts",
                url: "Chart/{*.}",
                defaults: new { controller = "Chart", action = "ChtIndex", id = UrlParameter.Optional }
            );

            // Default home page...
            routes.MapRoute(
                name: "Default",
                url: "{controller}/{action}/{id}",
                defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
            );

            routes.AppendTrailingSlash = true;
        }
    }
}

Angular路线是;

var ImrApp = angular.module('ImrApp', ['ngRoute', 'ui.bootstrap', 'kendo.directives']);

ImrApp.config(
	["$routeProvider", "$locationProvider", "$sceProvider",
	function ($routeProvider, $locationProvider, $sceProvider) {
		$routeProvider
			.when("/Report", { templateUrl: "/App/ReportForm/rfTemplate.html", controller: "rfController" })
			.when("/Chart", { templateUrl: "/App/Charts/chtTemplate.html", controller: "chtController" })
			.otherwise({ redirectTo: "/Report" });

		// Refer to https://docs.angularjs.org/error/$location/nobase for information regarding the "requireBase" parameter.
		// Without this option the error "$location in HTML5 mode requires a <base> tag to be present" is thrown.
		$locationProvider.html5Mode({
			enabled: true,
			requireBase: false
		});
	}]);

共享布局页面使用以下内容显示导航标题;

<div class="navbar-collapse collapse">
    <img class="navbar-right" height="100" src="Images/APLNG_143x143.jpg" />

    <ul class="nav navbar-nav">
        <li>@Html.ActionLink("Home", "Index", "Home")</li>
        <li>@Html.ActionLink("Reporting", "RptIndex", "Report")</li>
        <li>@Html.ActionLink("Charts", "ChtIndex", "Chart")</li>
    </ul>
</div>

如果我在加载页面时将鼠标悬停在“报告”导航项上，则会显示http://localhost:xxxx/Report/，如果我将鼠标悬停在“图表”选项上，则会显示http://localhost:xxxx/Chart/。如果我选择“图表”选项，页面将按预期显示，但如果我选择“报告”选项，则会出现HTTP Error 403.14 - Forbidden错误。

此外，如果我通过输入http://localhost:60739/Report/RptIndex手动导航到“报告”页面，然后刷新页面，地址将更改为http://localhost:60739/Report/，并显示403.14错误。刷新“图表”页面但不会在地址末尾附加最后一个“/”字符并正确显示页面。

为了进一步混淆问题，我将“html5Mode enabled”设置为false，导航仍然失败，但刷新页面现在有效，但显示为http://localhost:60739/Report/RptIndex#/Report作为页面地址。

更令人不安的是，这一切都在一点上工作，然后莫名其妙地“破裂”。将路由代码与早期版本进行比较表明没有变化。

有人能给我一个线索，说明为什么“图表”路由（基本上与“报告”路由相同）有效，但“报告”却没有？

Answer 1

路由问题是由与Views文件夹中的文件夹同名的文件夹引起的。所以即使一个文件夹直接位于项目文件夹下面，另一个文件夹是＆＃34; Views \ Report＆＃34;重命名第一个文件夹后，问题自行解决。

MVC和AngularJS路由 - 403.14 - 禁止

1 个答案: