Antd Upload上传图片nginx报错405

最新推荐文章于 2024-08-07 11:27:34 发布

doremifo

最新推荐文章于 2024-08-07 11:27:34 发布

阅读量4.3k

点赞数

文章标签： nginx ajax react.js

本文链接：https://blog.csdn.net/weixin_50874568/article/details/123254670

版权

Antd Upload上传图片nginx报错405

本地调试没问题，打包测试，nginx 转发报错 405 not allowed
原因是 nginx禁止用post访问静态资源

解决方法如下：

Upload提供【 customRequest 】通过覆盖默认的上传行为，可以自定义自己的上传实现。
但是由于拿到的图片状态一直是loading ( status: ‘loading’)状态，
所以手动给他改为done状态（status:‘done’）

<Form.Item
	wrapperCol={setObjectByCurrentLang({ span: 21 })}
	labelCol={setObjectByCurrentLang({ span: 3 })}
	name={'multipartFile'}
	label={UseIntl({
	   id: 'table.uploadImg',
	   defaultMessage: '上传图片',
	 })}
	rules={[
	   {
	     required: fileList.length > 0 ? false : true,
	     message: UseIntl({
	       id: 'table.up.uploadImg',
	       defaultMessage: '请上传图片',
	     }),
	   },
	]}
	getValueFromEvent={({ file, fileList }) => {
	   if (fileList.length > 0) {
	     file.status = 'done';
	     return [file];
	   }
	   return undefined;
	 }}
	>
	<Upload
	  {...pictrueProps}
	  onPreview={handlePreview}
	  defaultFileList={fileList.length > 0 ? fileList : null}
	  listType="picture"
	  maxCount={1}
	  customRequest={() => {}}
	>
	  <Button icon={<UploadOutlined />}>
	    {UseIntl({
	      id: 'table.uploadImg',
	      defaultMessage: '上传图片',
	    })}
	  </Button>
	</Upload>
</Form.Item>