如何JSON數據發佈到web服務REST在AngularJS

如何通過AngularJS 在這裏發表JSON數據網絡服務是代碼片段如何JSON數據發佈到web服務REST在AngularJS

.controller('MessagePostCtrl', function($scope, $http) { 
    $scope.postMessage = function() { 
     var msg = document.getElementById('message').value; 
     var msgdata = { 
       message : msg 
      }; 
     var res = $http.post('http://<domain-name>/messenger/api/posts/savePost',msgdata); 
     res.success(function(data, status, headers, config) { 
      console.log(data); 
     }); 
    } 
})

OPTIONS HTTP：///信使/ API /職位/ savePost
ionic.bundle.js：16185（匿名功能）ionic.bundle.js：16185個 sendReq ionic.bundle.js：15979個serverRequest ionic.bundle.js：15712個 wrappedCallback ionic.bundle.js：19197 wrappedCallback ionic.bundle.js：19197（匿名函數）ionic.bundle.js：19283 範圍。$ eval ionic.bundle.js：20326範圍。$ digest ionic.bundle.js：20138 範圍。$ apply ionic.bundle.js：20430（匿名函數） ionic.bundle.js：43025（匿名函數） ionic.bundle.js：10478 的forEach ionic.bundle.js：7950事件處理ionic.bundle.js：10477個 triggerMouseEvent ionic.bundle.js：2648 tapClick ionic.bundle.js：2637 tapMouseUp ionic.bundle.js：2707

XMLHttpRequest無法加載 http：/// messenger/api/posts/savePost。無效的HTTP 狀態碼404

但當我從$ http.post方法去除MSGDATA，一切工作正常。誰能告訴我在哪裏的問題是要不指導我如何JSON數據發送到網絡服務

感謝您的幫助

**Edited: 
The Issue was with the CORS, Im using codeigniter REST Controller for web-services. 
Modified the headers. If anyone has the same issue add the below header in the construct 

header("Access-Control-Allow-Origin: *"); 
header("Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE"); 
header("Access-Control-Allow-Headers: X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method"); 
if ("OPTIONS" === $_SERVER['REQUEST_METHOD']) { 
die(); 
} 
Thanks to Linial for the break-through, telling me where the issue is.**

來源

2014-11-08 Sathish Ravepati

您的webservice是否期望JSON或表單數據？（例如：「message = test＆x = test2」） – 2014-11-08 15:50:18

webservice只期望JSON格式 – 2014-11-08 15:54:44

好吧，

你混了幾件事情：

首先，我可以看到您的請求已從POST更改爲OPTIONS。

爲什麼？

您正在執行跨站點HTTP請求（CORS），這意味着您的WebApp和您的後端API不在同一個域中。

現場會發生什麼，請求正在預衝。

預檢請求：由Mozilla MDN：

它使用比GET，HEAD或POST的其它方法。另外，如果POST使用來發送具有除 application/x-www-form-urlencoded，multipart/form-data或text/plain之外的內容類型的請求數據，例如。如果POST請求使用 application/xml或text/xml向服務器發送XML有效內容，則會預先顯示該請求。

這意味着，旁邊GET，HEAD或POST將改變OPTIONS 任何請求：如果用來發送其他與Content-Type的數據比application/x-www-form-urlencoded, multipart/form-data, or text/plain

我現在還專搞明白，但該怎麼辦？我必須做POST請求！

由於CORS是在服務器上定義的，因此您沒有多少選項。

但在客戶端上，你可以這樣做（例）：更改編碼類型的角度，像這樣： $http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";

設置你的服務器批准CORS像這樣：

Access-Control-Allow-Headers: Content-Type \\ This will allow you to set content type header in the client. 

Access-Control-Allow-Methods: GET, POST, OPTIONS \\ This will allow you to send GET POST and OPTIONS, which is necessary because of preflighted requests. 

Access-Control-Allow-Origin: * \\ This will allow anyone to perform CORS requests.

祝你好運！

來源

2014-11-08 16:10:53 Linial

感謝Linial，我沒有意識到這是CORS問題。在控制器中添加標題解決了我的問題。 – 2014-11-08 17:44:40

我知道它已經被接受，但我只是想補充一點，設置一個php服務器來獲得訪問控制，你只需要在你的進程頁面頂部添加這行： <？php header（「Access-Control- Allow-Origin：*「）; header（「Access-Control-Allow-Headers：Origin，X-Requested-With，Content-Type，Accept」）; – 2015-02-04 14:03:17

如何JSON數據發佈到web服務REST在AngularJS

回答

相關問題