1. 程式人生 > >構建前端開發環境之----使用express處理POST跨域請求

構建前端開發環境之----使用express處理POST跨域請求

回顧

  • 在上次的 文章中,實現了 開發環境的簡單的jsonp 處理,但是隻能處理 GET 請求,不支援 POST 請求。為了讓 模擬的效果更好一點,還要能處理 POST 跨域請求。

使用 CORS 處理跨域

  • 在 express 中實現 CORS 的方法如下:
app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"
); next(); });
  • 在 express 中處理 POST 請求需要一箇中間件,程式碼如下:
var bodyParser = require('body-parser');
app.use(bodyParser.json()); // support json encoded bodies
app.use(bodyParser.urlencoded({ extended: true })); // support encoded bodies

舉個完整的栗子

var express = require('express');

var app = express();

var
bodyParser = require('body-parser'); app.use(bodyParser.json()); // support json encoded bodies app.use(bodyParser.urlencoded({ extended: true })); // support encoded bodies app.use(function(req, res, next) { res.header("Access-Control-Allow-Origin", "*"); res.header("Access-Control-Allow-Headers"
, "Origin, X-Requested-With, Content-Type, Accept"); next(); }); app.post('/login.json', function(req, res, next) { // 使用 req.body 可以拿到 post 請求中的資料 console.log(req.body.name); // 預設返回的json 物件 var obj = { "success": false, "error_code":"NOT_LOGIN" } res.json(obj); }); app.listen(4100);