node.js(express) 、angular.js　クロスドメインの　$http　POSTにはまった

これまでにクロスドメインの対応をしたことはあったが、node.jsでは未経験でした。 PHPでは経験がり、サーバー側のレスポンスヘッダーへ以下を追加すればすぐにできるだろと思っていましたが、あまかった。苦戦したのでメモ。

Access-Control-Allow-Origin: *

クライスト側はangular.jsを利用しています。

■クライアント側

$http({
	method: 'POST',
	url : http://localhost:3000/hoge,
	headers: { 'Content-Type': 'application/json' },
	data: {"name" : "hoge", "text" : "hogehoge"},
}).success(function(data, status, headers, config) {
	console.log(JSON.stringify(data));
}).error(function(data, status, headers, config) {
	console.log("err");
});

■サーバー側

router.post('/hoge',function(request,response){
   	response.setHeader("Access-Control-Allow-Origin", "*");
	response.json(request.body);
    return;
});

angular.jsもあまり経験がなかったのでクライアント側の問題だと思い、

何度もangularの$httpを修正して調査した。
はじめは、「Request Method:OPTIONS」になっているこが問題だとPOSTになるよう修正していた。

angularをあきらめ、jQueryの$.ajaxを使っても解消されなかった。

そもそもそれが間違い

POSTするときのリクエストメッドは「Request Method:OPTIONS」でないといけなかった。
今までクロスドメインはGETしかしたことがなかった。POSTの経験はなかったことを今更気づく。

以下のサイトにGET以外は2往復するとのことです。
http://garafu.blogspot.jp/2013/07/blog-post.html

1.クライアントからサーバーへのリクエスト：Request Method:OPTIONS
2.サーバーからレスポンスが返ってきて許可がでる
3.クライアントからサーバーへのリクエスト：Request Method:POST
4.POSTの処理が完了してサーバーからレスポンス返ってくる

クライアンは問題がない。ではサーバーでOPTIONSをちゃんと受け付けて、許可するよういろいろ修正したが、解消されない
なんども検索してると以下のサイトで「npm install cors」して使えばOKとのことです。
http://itbose.hatenablog.com/entry/2015/01/21/134056

npm install cors
でインストールし以下を実装。

var express = require('express');
var cors = require('cors');
var app = express();
app.use(cors());

※最初に実装した「response.setHeader(“Access-Control-Allow-Origin”, “*”);」は削除しておく

やっとこれでできた。3日はまった。

・参考サイト
http://itbose.hatenablog.com/entry/2015/01/21/134056
http://garafu.blogspot.jp/2013/07/blog-post.html