CORS Cookie,和nodejs中的具體實現

Jun.lu發表於2013-07-15
CORSCookieNodeJS

CORS(跨來源資源共享協議)，高階瀏覽器(Chrome,firefox, opera, safir, ie10)在 XMLHttpRequest(AJAX) 中已經支援了這個協議。可以實現ajax跨域訪問。（其實IE8也實現了，只不過是另外一個物件）

由於是跨來源的的訪問，標識HTTP狀態的Cookie的使用有一些特別處理。

Server Nodejs 程式碼

res.setHeader('Access-Control-Allow-Origin', req.headers.origin);//注意這裡不能使用 * 
res.setHeader('Access-Control-Allow-Credentials', true);//告訴客戶端可以在HTTP請求中帶上Cookie
res.setHeader('Access-Control-Allow-Methods', 'POST, GET, PUT, DELETE, OPTIONS');

瀏覽器中 JS 程式碼

var xhr = new XMLHttpRequest();
xhr.open("post", "xxx/xxx", true);
xhr.withCredentials = true;//放在 open 方法後面比較靠譜
xhr.onload = function(){}
xhr.send("a=1&b=2");　　

　　

CORS + Cookie 在nodejs + express 中的實現。

做一個/getInfo 的ajax介面。

瀏覽器會先傳送一個 options請求驗證許可權，最後再完成真的業務請求。

//首先做一個 options 的請求返回CORS的頭資訊。
app.options('/getInfo', function(req, res){
	res.setHeader('Access-Control-Allow-Origin', req.headers.origin);
	res.setHeader('Access-Control-Allow-Credentials', true);
	res.setHeader('Access-Control-Allow-Methods', 'POST, GET, PUT, DELETE, OPTIONS');
});

//請求的業務邏輯
app.get('/getInfo', function(req, res){
	res.setHeader('Access-Control-Allow-Origin', req.headers.origin);
	res.setHeader('Access-Control-Allow-Credentials', true);
	res.end("I'm jun");
});

　　

最後歡迎觀看CORS+WebSocket 做的一個線上使用者即時對話工具。http://vchat.co/c/chat-js

Over

　　

相關文章