角度/イオン$ httpのポストエラー

Question

APIリクエストをAPIに送信しようとしていますが、$ http.postが動作していないか、未定義エラーの 'data'プロパティを読み取れません。

このやり方や回避策の提案はありますか？どのように問題を適切にデバッグするか？

コード：

var data = { 
    from: "xxxx@gmail.com", 
    to: "yyyyy@gmail.com", 
    content_type: "text/plain", 
    body: "Temp Message", 
    date: "2017-09-12T03:48:29.285Z", 
}; 

var config = { 
    headers : { 
     'Content-Type' : 'application/x-www-form-urlencoded; charset=utf-8', 
     'Authorization': 'Basic ' + "u/xx/yyy:zzz", 
    } 
} 

return $http.post('https://xxx/send', data, config) 
.success(function (data, status, header, config) { 
    console.log("SUCCESS"); 
}) 
.error(function (data, status, header, config) { 
    console.log("FAILED"); 
}); 

角/イオンエラー

0  330020 error TypeError: Cannot read property 'data' of undefined 
    at http://xxx.xxx.x.xxx:8101/lib/ionic/js/ionic.bundle.js:24536:24 
    at processQueue (http://xxx.xxx.x.xxx:8101/lib/ionic/js/ionic.bundle.js:29132:28) 
    at http://xxx.xxx.x.xxx:8101/lib/ionic/js/ionic.bundle.js:29148:27 
    at Scope.$eval (http://xxx.xxx.x.xxx:8101/lib/ionic/js/ionic.bundle.js:30400:28) 
    at Scope.$digest (http://xxx.xxx.x.xxx:8101/lib/ionic/js/ionic.bundle.js:30216:31) 
    at Scope.$apply (http://xxx.xxx.x.xxx:8101/lib/ionic/js/ionic.bundle.js:30508:24) 
    at done (http://xxx.xxx.x.xxx:8101/lib/ionic/js/ionic.bundle.js:24829:47) 
    at completeRequest (http://xxx.xxx.x.xxx:8101/lib/ionic/js/ionic.bundle.js:25027:7) 
    at XMLHttpRequest.requestError (http://xxx.xxx.x.xxx:8101/lib/ionic/js/ionic.bundle.js:24978:9) 

Answer 1

あなたのHTTPのPOSTリクエストのContent-Typeがapplication/x-www-form-urlencodedです。したがって、dataは、たとえば、$.param()を使用して、パラメータ形式としてシリアル化する必要があります。あなたのコードの場合

、それは次のようになります。

... 
data = $.param(data); // using jQuery to serialze JSON as parameters. 
return $http.post('https://xxx/send', data, config) 
    .success(function (data, status, header, config) { 
     console.log("SUCCESS"); 
    }) 
    .error(function (data, status, header, config) { 
     console.log("FAILED"); 
    }); 

あるいは、サーバーが実際にJSON形式を受け入れた場合、Content-Typeはapplication/jsonに変更する必要があります。

... 
var config = { 
    headers : { 
    'Content-Type' : 'application/json', 
    'Authorization': 'Basic ' + "u/xx/yyy:zzz", 
    } 
} 
... 
return $http.post('https://xxx/send', JSON.stringify(data), config) 
    ...