Ошибка CORS даже при установленном пакете cors nom

Я использую React Filepond, и часть загрузки работает нормально. Но когда я перехожу к существующей записи и пытаюсь отобразить изображение, я получаю ошибку CORS:

Доступ к XMLHttpRequest в 'http://localhost:8000/img/myImg.jpg' из origin 'http://localhost:3000' заблокирован политикой CORS: No 'Access-Control-Allow-Origin 'присутствует в запрошенном ресурсе.

в app.js на моем сервере узла у меня есть следующее, но я все еще получаю ошибку cors, используя пакет cors < / а>

const cors = require("cors");
app.use(cors());
app.options("*", cors());

В React у меня есть следующее:

  state = {
    data: {
      title: "",
      bgImg: ""
    },
    errors: {},
    files: [
      {
        source: "myImg.jpg",

        options: {
          type: "local"
        }
      }
    ]
  };

    <FilePond
      ref={ref => (this.pond = ref)}
      files={this.state.files}
      allowMultiple={false}
      maxFiles={1}
      name="bgImg"
      server={{
        process: "http://localhost:8000/api/uploads/",
        load: "http://localhost:8000/img/"
      }}
      oninit={() => this.handleInit()}
      onupdatefiles={fileItems => {
        this.setState({
          files: fileItems.map(fileItem => fileItem.file)
        });
      }}
    />

В package.json я также добавил прокси:

"proxy": "http://localhost:8000/img",

Вкладка «Сеть» -> отображается вкладка «Заголовки»

Request URL: http://localhost:8000/img/myImg.jpg
Referrer Policy: no-referrer-when-downgrade

Provisional headers are shown
Referer: http://localhost:3000/home-banner

reactjs node.js filepond
person user8463989    schedule 05.08.2019    source источник
comment
Проверьте, действительно ли в ответе на вкладке сети инструментов разработчика отображаются требуемые заголовки CORS.   -  person Rik    schedule 06.08.2019
comment
@Rik, не уверен, что ищу в нужном месте, но я обновил свой исходный вопрос тем, что появляется.   -  person user8463989    schedule 06.08.2019
comment
ibb.co/LnZ6pf9 - это то, что вам нужно.   -  person Rik    schedule 06.08.2019
comment
Пакет CORS на сервере node.js не обслуживает это или мне нужно также установить его в проекте React?   -  person user8463989    schedule 06.08.2019
comment
Я не знаю, у меня нет большого опыта работы с NodeJS, я знаю, что это то, что настраивается на сервере, а не на клиенте.   -  person Rik    schedule 06.08.2019
comment
Я разверну это, чтобы увидеть, есть ли у меня та же проблема на реальном сервере, что и на локальном хосте в данный момент, и дам вам знать ...   -  person user8463989    schedule 06.08.2019
comment
@Rik, я не уверен, что это подходящее решение, но мне пришлось использовать cors где угодно, чтобы заставить его работать, это единственное, что действительно работает для меня. cors-anywhere.herokuapp.com   -  person user8463989    schedule 06.08.2019

Ответы (1)


arrow_upward
0
arrow_downward

Попробуйте установить плагин cors в своем браузере и получить доступ к api. Надеюсь это поможет..

const cors = require('cors')

const corsOptions = {
  origin: 'http://localhost:8000'
}

app.get('/img', cors(corsOptions), (req, res, next) => {
  //...
})
person Sankhavaram Saitulasiram    schedule 05.08.2019