設定標題內容型別多部分/表單資料時，請求被CORS-policyNo'Access-Control-Allow-Origin'阻止-有解無憂

我是 react 和 nodeJS 的新手，當我使用 multer 請求更新并插入帶有影像上傳的資料時遇到問題，我將資料作為 formData 發送。

但是，我在使用動態請求代碼設定標頭內容型別 multipart/form-data 時收到錯誤請求被 CORS 阻止，我已經在郵遞員中嘗試過并且它作業正常，并且在其他專案中也可以完美運行。

錯誤：

從源“http://localhost:3001”訪問“http://localhost:3000/v1/data/insert”的 XMLHttpRequest 已被 CORS 策略阻止：不存在“Access-Control-Allow-Origin”標頭在請求的資源上。

這是代碼

export async function put(url, data, config = {}) {
  return axiosApi
    .put(url, { ...data }, { ...config })
    .then(response => response.data)
}

export const updateProduct = data =>
  put(url.UPDATE_PRODUCT, data, {
    headers: {
      "content-type": "multipart/form-data",
    },
  })

應用程式介面

app.use((req, res, next) => {
    res.setHeader('Access-Control-Allow-Origin', '*');
    res.setHeader('Access-Control-Allow-Method', 'GET, POST, PUT, PATCH, DELETE, OPTIONS');
    res.setHeader('Access-Control-Allow-Headers', 'Content-Type, Authorization');
    next();
})

在另一個頁面上，我嘗試插入和更新資料，但沒有上傳檔案或沒有發送內容型別的標題，有人可以幫我嗎？

uj5u.com熱心網友回復：

您可以使用 express 提供的中間件

var express = require('express')
var cors = require('cors')
var app = express()

app.use(cors())

app.get('/products/:id', function (req, res, next) {
  res.json({msg: 'This is CORS-enabled for all origins!'})
})

app.listen(80, function () {
  console.log('CORS-enabled web server listening on port 80')
})

cors 的檔案https://expressjs.com/en/resources/middleware/cors.html

uj5u.com熱心網友回復：

你使用的是什么網路服務器？也許 Nginx 等？為此，您還需要配置 Web 服務器。您需要將此行添加到 Nginx 中的服務器塊。檔案

{
    location ~* \.(eot|ttf|woff|woff2)$ {
    add_header Access-Control-Allow-Origin *;
}

如果您使用下面的其他網路服務器評論

轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/363255.html

標籤：节点.js 反应表达多路

上一篇：如何將webhook指向前端

下一篇：MVC模型中使用Express和Node的搜索欄