如何使用抓取來發布與內容類型的應用程序/ JSON

Question

我有一個反應的應用程序，並取回調用的API如下：然而

postForm(state) { 
    var formData = state.formData; 
    return fetch('http://localhost:3000/api/V0.1/formSubmit', {method: 'POST', headers: {"Content-Type": "application/json"}, body: JSON.stringify(formData)}) 
    .then((response) => response.json()) 
    .then((responseJson) => { 
     console.log(responseJson); 
     return null; 
    }) 
    .catch((error) => { 
     console.error(error); 
    }); 
    } 

，它就會阻止CORS作爲規範指出application/json是非標準的內容類型。

但是，我不確定我如何修改我的fetch調用以執行所需的預執行請求以使其允許應用程序/ json。

API調用是：

app.post("/api/v0.1/formSubmit", function(req, res) { 
    res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8080'); 
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE'); 
    res.setHeader('Access-Control-Allow-Headers', '*'); 
    var formData=req.body; 
    console.log(formData); 
    res.status(200).json(formData); 
}); 

Answer 1

之前定義你的路由。聲明

app.use(function(req, res, next) { 
     var oneof = false; 
     if(req.headers.origin) { 
      res.header('Access-Control-Allow-Origin', req.headers.origin); 
      oneof = true; 
     } 
     if(req.headers['access-control-request-method']) { 
      res.header('Access-Control-Allow-Methods', req.headers['access-control-request-method']); 
      oneof = true; 
     } 
     if(req.headers['access-control-request-headers']) { 
      res.header('Access-Control-Allow-Headers', req.headers['access-control-request-headers']); 
      oneof = true; 
     } 
     if(oneof) { 
      res.header('Access-Control-Max-Age', 60 * 60 * 24 * 365); 
     } 

     // intercept OPTIONS method 
     if (oneof && req.method == 'OPTIONS') { 
      res.send(200); 
     } 
     else { 
      next(); 
     } 
    }); 

在CORS中，將檢查服務器上可用方法的請求。即在選項請求。當您獲得成功的回覆時，您將能夠發送請求。

您還可以爲特定頁面啓用CORS。在這裏學習https://github.com/expressjs/cors