ASP MVC Angular JS $ http找不到

时间:2016-01-04 21:41:50

标签: angularjs asp.net-mvc http http-status-code-404

从我的角度代码调用http get WebApi控制器时遇到问题。我正在使用ASP MVC来提供起始页面和起始页面网址看起来像:http://localhost:23845/StudentsEditor/StudentsView现在从角度我是callinh http请求:

angular.element(document).ready(function () {
        $http({
            method: "GET",
            url: "api/Groups/GetGroups",
            dataType: "json",
        }).then(function successCallback(response) {
            $scope.groups = response.data;
        }, function errorCallback(response) {
            alert("trouble...");
        });

我收到404因为网址不正确。它汇合了路径,它像: 获取http://localhost:23845/StudentsEditor/api/Groups/GetGroups 而不是http://localhost:23845/api/Groups/GetGroups

请给我一些建议来解决它。当然我已经定义了RouteConfig:         public static void RegisterRoutes(RouteCollection routes)         {             routes.IgnoreRoute(" {资源}个.axd / {*} PATHINFO&#34);

        routes.MapRoute(
        name: "Default",
        url: "{controller}/{action}/{id}",
        defaults: new { controller = "StudentsEditor", action = "StudentsView", id = UrlParameter.Optional }
    );

和webApi配置:

        config.MapHttpAttributeRoutes();

        config.Routes.MapHttpRoute(
            name: "DefaultApi",
            routeTemplate: "{url}/api/{controller}/{id}",
            defaults: new { id = RouteParameter.Optional }
        );

        var json = config.Formatters.JsonFormatter;
        json.SerializerSettings.PreserveReferencesHandling = Newtonsoft.Json.PreserveReferencesHandling.Objects;
        config.Formatters.Remove(config.Formatters.XmlFormatter);

2 个答案:

答案 0 :(得分:0)

你不应该硬编码网址。您可以在剃刀视图中使用Url.ContentUrl.RouteUrl辅助方法生成应用程序库/ root的相对URL。无论您当前的页面/路径如何,它都会正确构建网址。获得此值后,您可以使用angular的value提供程序将此数据从剃刀视图传递到角度控制器/角度数据服务。

因此,在您的剃刀视图(特定页面/布局文件)中,您可以添加此内容。

<script>
    var myApp = myApp || {};
    myApp.Urls = myApp.Urls || {};
    myApp.Urls.baseUrl = '@Url.Content("~")';       
</script>
<script src="~/Scripts/AngularControllerForPage.js"></script>
<script>
    var a = angular.module("app").value("appSettings", myApp);
</script>

并且在角度控制器中,appSettings将被注入,您可以使用它并为您的其他Web api端点构建正确的URL。

var app = angular.module("app", []);
var ctrl = function (appSettings,$http) {

    var vm = this;

    vm.baseUrl = appSettings.Urls.baseUrl;
    //build other urls using the base url now
    var getUGroupsUrl = vm.baseUrl + "api/Groups/GetGroups";
    // you can use getUGroupsUrl  now for your http calls.
    console.log(getUGroupsUrl);

   $http.get(getUGroupsUrl).then(function(response) {

       console.log(response.data);
   }

};
ctrl.inject=['$http'];
app.controller("ctrl", ctrl)

您也可以考虑将您的网络API呼叫从角度控制器移至a data service,以保持清洁和安全。保持关注。

答案 1 :(得分:0)

我找到了轻松实现我想要的方法:

01-05 05:46:12.933    3029-3029/rides.even.odd.oddorevenrides E/dalvikvm﹕ Could not find class 'rides.even.odd.oddorevenrides.volleyclasses.VolleySingleton$1', referenced from method rides.even.odd.oddorevenrides.volleyclasses.VolleySingleton.<init>
01-05 05:46:12.933    3029-3029/rides.even.odd.oddorevenrides W/dalvikvm﹕ VFY: unable to resolve new-instance 9625 (Lrides/even/odd/oddorevenrides/volleyclasses/VolleySingleton$1;) in Lrides/even/odd/oddorevenrides/volleyclasses/VolleySingleton;
01-05 05:46:12.933    3029-3029/rides.even.odd.oddorevenrides D/dalvikvm﹕ VFY: replacing opcode 0x22 at 0x001d
01-05 05:46:12.949    3029-3029/rides.even.odd.oddorevenrides D/dalvikvm﹕ DexOpt: unable to opt direct call 0xfd9f at 0x1f in Lrides/even/odd/oddorevenrides/volleyclasses/VolleySingleton;.<init>
01-05 05:46:13.343    3029-3029/rides.even.odd.oddorevenrides D/AndroidRuntime﹕ Shutting down VM
01-05 05:46:13.343    3029-3029/rides.even.odd.oddorevenrides W/dalvikvm﹕ threadid=1: thread exiting with uncaught exception (group=0x40d2a300)
01-05 05:46:14.070    3029-3029/rides.even.odd.oddorevenrides E/AndroidRuntime﹕ FATAL EXCEPTION: main

,键是window.location.origin,返回protocol + host + port