Cloudinary в React / Redux "заблокирован политикой CORS".Авторизация поля заголовка запроса - PullRequest
0 голосов
/ 19 июня 2019

У меня проблемы с CORS на моем локальном хосте:

Access to XMLHttpRequest at 'https://api.cloudinary.com/v1_1/*******/image/upload' from origin 'https://localhost:3000' has been blocked by CORS policy: Request header field authorization is not allowed by Access-Control-Allow-Headers in preflight response.

Я работаю с реакцией / редукцией. Ниже мое редукционное действие для добавления / изменения профиля. Этот код работал, когда я работал с http://localhost,, но не работает с https . Я написал Cors Middleware в моем server.js. Но это не помогает. Что я могу с этим сделать?

export const addProfile = profile => {
  const formData = new FormData();
  formData.append("image", profile.avatar);
  formData.append("api_key", "********");
  formData.append("upload_preset", "********");
  formData.append("skipAuthorization", true);

  return (dispatch) => {
    axios.post('https://api.cloudinary.com/v1_1/********/image/upload',
      formData,
      { headers: { "X-Requested-With": "XMLHttpRequest" } })
      .then(res => {
        const image = res.data.secure_url;
        profile.avatar = image;
        axios
          .post("/api/profile", profile)
          .then(res => {
            console.log("res", res.data);
          })
          .catch(err =>
            console.log("err", err.response.data);
          );
      })
      .catch(err => console.log("cloundinary err =>", err))
  }
};

1 Ответ

0 голосов
/ 19 июня 2019

Проблема CORS связана с доменом, к которому вы пытаетесь получить доступ: https://api.cloudinary.com

Они / Вам необходимо добавить свой домен в заголовки ответа API - или подстановочный доступ, если вам нужен доступ к нему с localhost,Когда включено, вы должны видеть заголовки CORS в ответе API.

Подробнее см. Здесь: https://en.wikipedia.org/wiki/Cross-origin_resource_sharing

...