CORS(跨來源資源共享協議),高級瀏覽器(Chrome,firefox, opera, safir, ie10)在 XMLHttpRequest(AJAX) 中已經支持了這個協議。能夠實現ajax跨域訪問。(其實IE8也實現了,只不過是另一個對象)javascript
因爲是跨來源的的訪問,標識HTTP狀態的Cookie的使用有一些特別處理。java
Server Nodejs 代碼node
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 代碼ajax
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 中的實現。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-jsapp
Over工具