MVC和AngularJS路由 - 403.14 - 禁止 [英] MVC and AngularJS Routing - 403.14 - Forbidden
问题描述
我有让我的角路线之一在我的应用程序工作的问题。基本上我有也使用一对夫妇的SPA的MVC应用程序。
在MVC路由如下：
命名空间IMR
{
公共类RouteConfig
{
公共静态无效的RegisterRoutes（RouteCollection路线）
{
routes.IgnoreRoute（{}资源个.axd / {*} PATHINFO）; //角的报告路线...
routes.MapRoute（
名称：报告，
网址：报告/ {*}，
默认：新{控制器=报告，行动=RptIndex，ID = UrlParameter.Optional}
）; routes.MapRoute（
名称：图表，
网址：{*}图/
默认：新{控制器=图表，行动=ChtIndex，ID = UrlParameter.Optional}
）; //默认主页...
routes.MapRoute（
名称：默认，
网址：{控制器} / {行动} / {ID}
默认：新{控制器=家，行动=索引，ID = UrlParameter.Optional}
）; routes.AppendTrailingSlash = TRUE;
}
}
}
该角航线;
VAR ImrApp = angular.module（'ImrApp'，['ngRoute'，' ui.bootstrap'，'kendo.directives']）;\r
\r
ImrApp.config（\r
[$ routeProvider，$ locationProvider，$ sceProvider，\r
功能（$ routeProvider，$ locationProvider，$ sceProvider）{\r
$ routeProvider\r
。当（/报告，{templateUrl：/App/ReportForm/rfTemplate.html控制器rfController}）\r
。当（/图，{templateUrl：/App/Charts/chtTemplate.html控制器chtController}）\r
不然的话（{redirectTo：/报告}）;\r
\r
//参见https://docs.angularjs.org/error/$location/nobase的关于requireBase参数信息。\r
//如果没有这个选项的错误，在HTML5模式$位置需要一个＆LT;基地＆gt;标记为present被抛出。\r
$ locationProvider.html5Mode（{\r
启用：真实，\r
requireBase：假的\r
}）;\r
}]）; \r
共享的布局页面中使用了以下显示导航标题; </ P>
＆LT; DIV CLASS =Navbar的垮垮＆GT;
＆LT; IMG类=Navbar的权利HEIGHT =100SRC =图像/ APLNG_143x143.jpg/＆GT; ＆LT; UL类=NAV导航栏，导航＆GT;
＆LT;立GT; @ Html.ActionLink（家，索引，家庭）＆LT; /李＆GT;
＆LT;立GT; @ Html.ActionLink（报告，RptIndex，报告）＆LT; /李＆GT;
＆LT;立GT; @ Html.ActionLink（图表，ChtIndex，图表）＆LT; /李＆GT;
＆LT; / UL＆GT;
＆LT; / DIV＆GT;
如果我将鼠标悬停在报告导航项目的鼠标时，页面加载它显示的http：//本地主机：XXXX /报告/ ，如果我将鼠标悬停在图表选项，它会显示的http：//本地主机：XXXX /图/ 。如果我选择图表选项，显示的页面却如预期，如果我选择报告选项，我收到了 HTTP错误403.14 - 禁止错误
此外，如果我定位到报告页中手动输入的http：//本地主机：60739 /报告/ RptIndex 然后刷新页面地址更改为的http：//本地主机：60739 /显示报告/ 和403.14错误。刷新图表页但是不追加对地址的末端最后一个/字符，并正确显示页面。
要进一步迷惑我设置html5Mode启用来假键，导航仍然失败，但刷新页面，现在的工作，但显示 HTTP事项：/ /本地主机：60739 /报告/ RptIndex＃/报告作为页面地址
更令人不安的是这是所有在一个点上工作，然后莫名其妙地爆发。路由code有比较早期版本的表现都没有变化。
任何人可以给我一个线索，为什么图表路由（这基本上等同于报告路由）的作品，但报告却没有？
与路由的问题是由具有相同名称的视图文件夹中的文件夹的文件夹所致。因此，即使一个文件夹是正下方的项目文件夹，另一个是视图\\报告，一旦第一个文件夹改名的问题自行解决。
I am having problems getting one of my Angular routes to work in my application. Basically I have an MVC application that also uses a couple of SPAs.
The MVC routing is as follows;
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;
}
}
}
The Angular routes are;
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
});
}]);
The shared layout page uses the following to display a navigation header;
<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>
If I hover the mouse over the "Reporting" navigation item when the page is loaded it displays http://localhost:xxxx/Report/ and if I hover over the "Charts" option it displays http://localhost:xxxx/Chart/. If I select the "Charts" option the page is displayed as expected however if I select the "Reporting" option I get a HTTP Error 403.14 - Forbidden error.
Additionally if I navigate to the "Reporting" page manually by entering http://localhost:60739/Report/RptIndex then refresh the page the address changes to http://localhost:60739/Report/ and the 403.14 error is displayed. Refreshing the "Charts" page however doesn't append the last "/" character on the end of the address and displays the page correctly.
To further confuse matters I set "html5Mode enabled" to false and the navigation still failed but refreshing the page now worked but displayed http://localhost:60739/Report/RptIndex#/Report as the page address.
Even more disturbing is this was all working at one point and then inexplicably "broke". Comparing the routing code to earlier versions showed there were no changes.
Can anybody give me a clue as to why the "Charts" routing (which is basically identical to the "Reporting" routing) works but "Reporting" doesn't?
The problem with the routing was caused by a folder with the same name as a folder within the Views folder. So even though one folder was directly below the project folder and the other was "Views\Report" once the first folder was renamed the problem resolved itself.
这篇关于MVC和AngularJS路由 - 403.14 - 禁止的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
