2017-07-27 102 views
-1

我是AngularJS的新手。我正在使用AngularJS 1.3.15版本。当我尝试使用PUT方法调用api时,它会生成OPTIONS请求。我不知道我在做什么错误。我尝试了很多在Stockoverflow中建议的方法,但我仍然没有收到任何东西。请帮我解决这个问题。以下是我的Controller,Models,html文件和Chrome开发人员工具网络活动截图。

控制器文件users.js

'use strict'; 
mmlApp_users.config(['$routeProvider', function($routeProvider){ 
    $routeProvider 
    .when('/users/update/:userId', { 
     templateUrl: 'views/users/update.html', 
     controller: 'update', 
     resolve: { 
     user: function(users, $route){ 
      var userId = $route.current.params.userId 
      return users.getUser(userId); 
     } 
     } 
    }) 
    .otherwise({ 
     redirectTo: '/users/index' 
    }); 
}]); 

模型文件 - users.js

'use strict'; 
mmlApp_users.factory('users', ['$http', '$location', '$route', function($http, $location, $route){ 
    var obj = {}; 

    obj.getUser = function(userId){ 
    return $http.get(serviceBase + 'users/view/'+userId); 
    }; 

    obj.updateUser = function(user){ 
    var config = { 
      headers: { 
      'Content-Type': 'application/json' 
      } 
     }; 
    var userParams = { 
     first_name: user.first_name, 
     last_name: user.last_name, 
     email: user.email, 
     password: user.password, 
     address: user.address, 
     state: user.state, 
     city: user.city, 
     zip_code: user.zip_code 
     }; 
    $http.put(serviceBase + 'users/update/'+user.id+'?access-token=8e0bb9b3-b35f-4d30-943d-6028c0b85c13', userParams, config) 
      .then(successHandler).catch(errorHandler); 

    function successHandler(){ 
     $location.path('/users/index'); 
    } 
    function errorHandler(){ 
     alert('Oops! Somthing went wrong.'); 
     //$location.path('/users/create'); 
    } 
    }; 

    return obj; 
}]); 

视图 - update.html

<div> 
    <h1>{{title}}</h1> 
    <p>{{ message}}</p> 
    <form role="form" name="myForm"> 
    <div class="row"> 
     <div class= "form-group col-md-6" ng-class="{error: myForm.first_name.$invalid}"> 
     <label> First Name: </label> 
     <div> 
      <input name="first_name" ng-model="user.first_name" type= "text" class= "form-control" placeholder="First Name" required/> 
      <span ng-show="myForm.first_name.$dirty && myForm.first_name.$invalid" class="help-inline">First Name Required</span> 
     </div> 
     </div> 
     <div class= "form-group col-md-6" ng-class="{error: myForm.last_name.$invalid}"> 
     <label> Last Name: </label> 
     <div> 
      <input name="last_name" ng-model="user.last_name" type= "text" class= "form-control" placeholder="Last Name" required/> 
      <span ng-show="myForm.last_name.$dirty && myForm.last_name.$invalid" class="help-inline">Last Name Required</span> 
     </div> 
     </div> 
    </div> 
    .... 
    .... 
    .... 

    <a href="#/users/index" class="btn btn-default">Cancel</a> 
    <button ng-click="updateUser(user);" ng-disabled="myForm.$invalid" type="submit" class="btn btn-default">Submit</button> 
    </form> 
</div> 

Chrome开发工具网络活动截图 - enter image description here

+0

这只是发送CORS请求的一部分。修复服务器,使其正确处理。 –

+0

我可以知道为什么这个问题被拒绝投票吗?如果有什么不对,请告诉我我下次尝试纠正它。 –

+0

缺乏研究。您的问题中没有任何内容似乎表明您甚至知道CORS是什么。 –

回答

-1

尝试在你的工厂:

(function() { 
'use strict'; 
mmlApp_users.factory('users', ['$http', '$location', '$route','$httpParamSerializer', 
function ($http, $location, $route, $httpParamSerializer) { 

    var obj = {}; 

    obj.getUser = function (userId) { 
     return $http.get(serviceBase + 'users/view/' + userId); 
    }; 

    obj.updateUser = function (user) { 

     var userParams = { 
      first_name: user.first_name, 
      last_name: user.last_name, 
      email: user.email, 
      password: user.password, 
      address: user.address, 
      state: user.state, 
      city: user.city, 
      zip_code: user.zip_code 
     }; 

     var req = { 
      method: 'PUT', 
      url: serviceBase + 'users/update/' + user.id + '?access-token=8e0bb9b3-b35f-4d30-943d-6028c0b85c13', 
      headers: { 
       'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' 
      }, 
      data: $httpParamSerializer(userParams) 
     }; 

     $http(req) 
      .then(successHandler) 
      .catch(errorHandler); 

     function successHandler() { 
      $location.path('/users/index'); 
     } 

     function errorHandler() { 
      alert('Oops! Somthing went wrong.'); 
      //$location.path('/users/create'); 
     } 
    }; 

    return obj; 

}]); 

})(); 

而且goog锁定:)