Angularjs $ http.post（）調用api在飛行前投擲405錯誤選項電話

我試圖做一個POST到api，但我得到一個'NetworkError 405 - 方法不允許'什麼我來學習的是一個預先選擇的OPTIONS呼叫服務。研究這個問題的答案不是我想要的。我曾與CORS的首要問題，而我添加了以下到我的web服務（網頁API）：

<system.webServer> 
<httpProtocol> 
    <customHeaders> 
    <add name="Access-Control-Allow-Origin" value="*" /> 
    <add name="Access-Control-Allow-Headers" value="Content-Type" /> 
    <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" /> 
    </customHeaders> 
</httpProtocol>

我有我的客戶端HTML /角碼安排如下：

HTML：

<div class="row"> 
       <div class="col-lg-6 col-xs-12"> 
        <div class="form-group"> 
         <label>First Name*</label> 
         <input type="text" id="txtFirstName" ng-model="firstName" class="form-control" required/> 
        </div> 
       </div> 
       <div class="col-lg-6 col-xs-12"> 
        <div class="form-group"> 
         <label>Last Name*</label> 
         <input type="text" id="txtLastName" ng-model="lastName" class="form-control" required/> 
        </div> 
       </div> 
      </div> 
      <div class="row"> 
       <div class="col-lg-6 col-xs-12"> 
        <div class="form-group"> 
         <label>Company Name*</label> 
         <input type="text" id="txtCompanyName" ng-model="companyName" class="form-control" 
           required/> 
        </div> 
       </div> 
       <div class="col-lg-6 col-xs-12"> 
        <div class="form-group"> 
         <label>Your Work Email*</label> 
         <input type="email" id="txtEmail" ng-model="email" class="form-control" required/> 
        </div> 
       </div> 
      </div> 
      <div class="row"> 
       <div class="col-lg-6 col-lg-offset-3 col-xs-12"> 
        <div class="form-group"> 
         <label>Office Phone Number*</label> 
         <input type="text" id="txtPhone" ng-model="phone" class="form-control" required/> 
        </div> 
       </div> 
      </div> 
      <div class="row"> 
       <div class="col-lg-6 col-lg-offset-3 col-xs-12"> 
        <div class="form-group"> 
         <input type="submit" id="btnDemoSubmit" class="btn btn-default form-control" style="background-color: #053A54; color: #ffffff;" value="Submit For Trial" ng-click="demoInquiry()"/> 
        </div> 
       </div> 
      </div>

控制：

(function() { 
var app = angular.module("app", []) 

app.controller('MainController', function($scope, $http) { 
    var onUpdatesComplete = function (response) { 
     $scope.updates = response.data; 
    }; 
    $http.get("http://localhost:XXXXX/XXX/XXXXXX/XXXXXXXXXX") 
     .then(onUpdatesComplete); 

$scope.demoInquiry = function(){ 
     var data = { 
       firstName : $scope.firstName, 
       lastName : $scope.lastName, 
       companyName : $scope.companyName, 
       email : $scope.email, 
       phone : $scope.phone 
     }; 
     console.log(data); 
     $http.post("http://localhost:XXXXX/XXX/XXXXXX/XXXXXXXXXX", data).success(function() { 
      $scope.postSuccess = true 
     }).error(function(){ 
      $scope.postError = true; 
     }); 
    }; 
}); 
}());

我已驗證服務與工作正常小提琴手，所以我不知道如何解決這個問題。任何幫助，將不勝感激。

來源

2014-09-30 Rex_C

這個回答對你有幫助嗎？ http://stackoverflow.com/questions/17498691/enabling-cors-with-webapi-put-post-requests/17506774#17506774 – Badri 2014-10-01 02:05:14

這聽起來像你的服務器可能期待「application/x-www-form-urlencoded」數據，而你實際上正在發送一個JSON字符串在POST正文中。你可能會需要做的（假設你不想只是有你的API處理JSON）是兩件事情：

添加的ContentType的頭，通過「應用程序/ x-WWW的形式，進行了urlencoded」。
將您的POST數據轉換爲序列化的「key1 = val1 & key2 = val2」字符串。

問題在於，$ http服務實際上並不像您期望的那樣可以使用AJAX調用。如果你搜索「angularjs $ http form post」的變體，你可以找到更多關於這個的信息。

最後，here是一個有趣的問題解決方案，或者還有其他一些庫使這些事情更容易一些，如Restangular。

來源

2014-09-30 23:35:20 Bobby

我選擇了這個答案，因爲你給我正確的問題來搜索，導致這個頁面這解決了我的問題：http://scotch.io/tutorials/javascript/submitting-ajax-forms-the-angularjs-way – 2014-10-01 17:30:55

老兄，你節省了我很多的時間。如果任何人有興趣，在Angular 2（typescript）中，你需要這樣做： let headers = new Headers（{'Content-Type'：'application/x-www-form-urlencoded'}）; – peterb 2017-03-06 00:15:49

-1

使用$ http.jsonp（url）進行api查詢。

來源

2014-10-16 02:41:59 alfegupe

Angularjs $ http.post（）調用api在飛行前投擲405錯誤選項電話

回答

相關問題