Загрузка компонента Drag компонента Antd происходит между доменами - PullRequest
0 голосов
/ 19 ноября 2018

Я использую create-реагировать на приложение, чтобы сделать мой фронтэнд, и использую компонент Dragger внутри загрузки antd. Мой бэкэнд это Springboot. Мой интерфейс отправляет данные запроса на сервер, используя fetch, что вызовет междоменные проблемы. Поэтому я добавил «proxy» в файл package.json для create-реагировать-app: «http://localhost:8080" для прокси моего бэкэнда, что решает проблему междоменных, но когда я использую официальный сайт antd, Dragger загрузчика компонент всегда сообщает об ошибке при загрузке.

Это мой код использования Antd's Dragger.

import React, { Component } from 'react';
import { Upload, Icon, message } from 'antd';
import './UpVideo.css';

const Dragger = Upload.Dragger;

экспорт класса по умолчанию UpVideo extends Component {

render(){

    const props = {
        name: 'file',
        multiple: false,
        headers:{
            'Access-Control-Allow-Origin':'*',
            'Access-Control-Allow-Methods':'POST',

        },
        action: 'http://localhost:8080/vidoe/up',
        onChange(info) {
        //   const status = info.file.status;
          console.log(info);
        //   if (status !== 'uploading') {
        //     console.log(info.file, info.fileList);
        //   }
        //   if (status === 'done') {
        //     message.success(`${info.file.name} file uploaded successfully.`);
        //   } else if (status === 'error') {
        //     message.error(`${info.file.name} file upload failed.`);
        //   }
        },
      };

    return(
        <div>

            <Dragger {...props}>
                <p className="ant-upload-drag-icon">
                <Icon type="inbox" />
                </p>
                <p className="ant-upload-text">点击或者拖动视频文件到这里</p>
            </Dragger>,
        </div>
    )
}

}

Это изображение, которое я дал ошибку. enter image description here

Извините, я только что научился использовать StackOverflow. Если мое описание не понятно, пожалуйста, дайте мне знать, этот вопрос долго меня раздражал, спасибо.

1 Ответ

0 голосов
/ 07 мая 2019

Эта ошибка является мерой безопасности Google Chrome. Появляется, когда вы используете 2 разных сервера для внешнего и внутреннего интерфейса. установите эту библиотеку, чтобы исправить это:

npm установить cors https://www.npmjs.com/package/cors

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...