问在AngularJS中调用MVC？
EN

Stack Overflow用户

提问于 2014-05-05 16:19:02

回答 1查看 286关注 0票数 0

更新:这是我在行console.log =data之前执行$scope.Host时所遇到的错误；

XMLHttpRequest cannot load http://..... No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:52029' is therefore not allowed access.

我试图调用一个返回JSON数据的API，我是AngularJS的初学者，我想要做的是调用一个API并非常简单地显示数据。

我的HTML文件：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>My AngularJS App</title>
    <script src="../scripts/angular.js"></script>
</head>
<body>
    <div data-ng-app="MyModule">

        <table class="table" data-ng-controller="MyModuleCtrl">
            <tr>
                <th>
                    FirstName
                </th>
                <th>
                    MiddleName
                </th>
                <th>
                    LastName
                </th>
                <th>
                    Email
                </th>
                <th>
                    Active
                </th>
            </tr>

            <tr>
                <td>
                    {{Host.FirstName}}
                </td>
                <td>
                    {{Host.MiddleName}}
                </td>
                <td>
                    {{Host.LastName}}
                </td>
                <td>
                    {{Host.Email}}
                </td>
                <td>
                    {{Host.Active}}
                </td>
            </tr>
        </table>
    </div>
    <script src="../scripts/MyApp/App.js"></script>
</body>
</html>

App.js文件：

var MyModule = angular.module("MyModule", []);

MyModule.factory('MyHttpService',
    ['$http', function ($http) {

    return {
        getAll: function () {
            return $http.get('http://api.host.com/host'); //it returns json data
        }
 };
}]);

MyModule.controller('MyModuleCtrl', ['$scope', '$http', '$window', 'MyHttpService', 
    function ($scope, $http, $window, MyHttpService) {

        load();

        function load() {
            MyHttpService.getAll().success(function (data) {
               $scope.Host = data;
            }
        );
    }
}]);

angularjs

asp.net-web-api2

angular-services

回答 1

Stack Overflow用户

回答已采纳

发布于 2014-05-07 05:16:07

为了给出一个答案：

$http.get('http://api.host.com/host');是您获得CORS/xhr异常的原因。因为该域与您的角应用程序不同，所以您的浏览器将其视为CORS请求。您有两个选择-处理服务器上的CORS请求，或设置相同的域并删除CORS问题。如果选择选项1，请参见设置允许您的请求的CORS响应头。如果您选择选项2(向localhost:发出请求)，您所拥有的代码应该正确工作。

我回答了this question，我详细介绍了CORS的工作原理/浏览器如何处理CORS请求。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/23483999

复制

在AngularJS应用中实现认证授权

angularjs ajax 安全 api

在AngularJS应用中实现认证授权在每一个严肃的应用中，认证和授权都是非常重要的一个部分。单页应用也不例外。应用并不会将所有的数据和功能都暴露给所有的用户。用户需要通过认证和授权来查看应用的某个特定部分，或者在应用中进行特定的行为。为了在应用中对用户进行识别，我们需要让用户进行登录。在用户管理方面，传统的服务器端应用和单页应用的实现方式有所不同，单页应用能够和服务器通信的方式只有AJAX。对于登录和退出来说也是如此。负责识别用户的服务器端需要暴露出一个认证断电。单页应用将会把用户输入的信息发

庞小明

2018/03/07

2.1K0