【发布时间】:2017-07-06 03:59:35
【问题描述】:
在 AngularJS 中,我正在尝试设置一个主页,其中列出了我的 app/data/event 文件夹中的事件(json 文件)。控制器 EventListController 如下所示:
'use strict';
eventsApp.controller('EventListController',
function EventListController($scope, $location, eventData) {
$scope.events = eventData.getAllEvents();
})
EventData 服务如下所示:
eventsApp.factory('eventData', function ($resource) {
var resource = $resource('/app/data/event/:id', { id: '@id' }, { "getAll": { method: "GET", isArray: true, params: { something: "foo" } } });
return {
getEvent: function (eventId) {
return resource.get({
id: eventId
});
},
typeOf: function (obj) {
return {}.toString.call(obj).split(' ')[1].slice(0, -1).toLowerCase();
},
getAllEvents: function () {
return resource.query();
},
save: function (event) {
return resource.save(event);
}
};
EventList.html 如下所示:
<div>
<h1>Events</h1>
<hr/>
<hr/>
<ul class="thumbnails">
<li ng-repeat="event in events|orderBy:sortorder" class="span5">
<event-thumbnail/>
</li>
</ul>
</div>
我的路线如下所示:
'use strict';
var eventsApp = angular.module('eventsApp', ['ngResource', 'ngRoute'])
.config(function ($routeProvider) {
$routeProvider.when('/newEvent',
{
templateUrl: '/app/templates/NewEvent.html',
controller: 'EditEventController'
});
$routeProvider.when('/eventDetails/:eventId',
{
templateUrl: '/app/templates/EventDetails.html',
controller: 'EventController'
});
$routeProvider.when('/profile',
{
templateUrl: '/app/templates/EditProfile.html',
controller: 'EditProfileController'
});
$routeProvider.when('/events',
{
templateUrl: '/app/templates/EventList.html',
controller: 'EventListController'
});
$routeProvider.otherwise({ redirectTo: '/events' });
});
WebAPI 控制器(在单独的 WebAPI 项目中)EventController.cs 如下所示:
public class EventController : ApiController
{
public JToken Get(string id = null)
{
if (id==null)
{
return GetAllJsonEventsAsArray();
}
return GetSingleJsonFile(id);
}
private JArray GetAllJsonEventsAsArray()
{
var path = System.Web.Hosting.HostingEnvironment.MapPath("/");
var contents = "";
foreach (var file in System.IO.Directory.GetFiles(path + "..app/data/event/"))
{
contents += System.IO.File.ReadAllText(file) + ",";
}
return JArray.Parse("[" + contents.Substring(0, contents.Length - 1) + "]");
}
最后,WebApiConfig.cs 看起来像这样:
public static class WebApiConfig
{
public static void Register(HttpConfiguration config)
{
// Web API configuration and services
// Configure Web API to use only bearer token authentication.
config.SuppressDefaultHostAuthentication();
config.Filters.Add(new HostAuthenticationFilter(OAuthDefaults.AuthenticationType));
// Web API routes
config.MapHttpAttributeRoutes();
config.Routes.MapHttpRoute(
name: "DefaultApi",
routeTemplate: "{controller}/{id}",
defaults: new { id = RouteParameter.Optional }
);
}
}
当我尝试访问 http://localhost:49403/app/#/events 时出现错误:GET http://localhost:49403/app/data/event/ 403 (Forbidden)
有人可以帮忙吗?任何帮助都感激不尽。
【问题讨论】:
-
您的控制器路由与您的角度路由冲突。这里有大量帖子处理 Angular 和 .Net 路由之间的冲突。
-
403 错误几乎总是由您尝试访问您无权访问的内容的问题引起的。当您从 Angular 进行 API 调用时,您是否能够调试 API?如果是,您是否看到任何代码行都引发了异常?
-
艾米,你能发布一个讨论路由问题的链接吗?我的搜索没有提供任何有用的信息。
标签: c# angularjs asp.net-web-api