将文件上传到快递服务器时出现跨源错误

Question

所以我使用 React 将文件上传到我的快速服务器，在本地执行此操作但是当我将代码推送到我的 nginx 快速服务器时，我不断收到 Cors 错误。我如何才能解决这个问题，我目前使用 cors 包？

app.use(cors({
  "origin": "*",
  "methods": "GET,HEAD,PUT,PATCH,POST,DELETE,OPTIONS",
  "preflightContinue": false,
  "optionsSuccessStatus": 204
}))



var multer  = require('multer')

var storage = multer.diskStorage({
    destination: function (req, file, cb) {
        cb(null, databasepath + 'pdf-folder/')
    },
    filename: function (req, file, cb) {
        cb(null, file.originalname)
    }
})

var upload = multer({ storage: storage })

router.post('/uploadfolder',[authJWT.authenticateJWT,authJWT.isAdmin,upload.single('file')], adminController.uploadfolder);




exports.uploadfolder = function (req,res,next){
    
    let dates = JSON.parse(req.body.Dates)
    const newFolder = new Folder_PDF(
        {
            name: req.file.originalname,
            validFrom: dates.validFrom,
            validTill: dates.validTill
        }
    );
    
    newFolder.save((err,folder) => {

        if(err){
            return res.status(500).send({message: err});

        }

        return res.status(200)
    })
}

我的前端只是一个简单的数据形式，但是由于这是一个 cors 错误，我敢打赌这是一个服务器错误：

 uploadFile = () =>{


        let data = new FormData();
        data.append( 'file', this.state.file, 'a file title' )
       

        const options = {
            onUploadProgress: (progressEvent) => {
                const {loaded, total} = progressEvent;
                let percent = Math.floor( (loaded * 100) / total )

                if( percent <= 100 ){
                    this.setState({ uploadPercentage: percent })
                }

                if(loaded === total){
                   // window.window.location.reload()
                }
            }
        }
        axios.post(apiLink+'admin/uploadfolder', data, options).then(res => {
        }).catch(err => console.log(err))
    }

Answer 1

const cors = require('cors');
const app = express();
const whitelist = ['yor-domain-name']
const corsOptionsDelegate = function (req, callback) {
  let corsOptions;
  if (whitelist.indexOf(req.header('Origin')) !== -1) {
    corsOptions = { origin: true } // reflect (enable) the requested origin in the CORS response
  } else {
    corsOptions = { origin: false } // disable CORS for this request
  }
  callback(null, corsOptions) // callback expects two parameters: error and options
}

Answer 2

问题不是真正的 cors，而是 413 错误。文件太大，你必须在你的 nginx 配置文件中设置它：client_max_body_size 2M;

将文件上传到快递服务器时出现跨源错误

Cross origin error when uploading a file to express server

javascript

reactjs

express

http-status-code-413