Я хочу создать компонент в ReactJS, чтобы иметь возможность загружать изображения в imgur, используя их API.
Для достижения этой цели я использую компонент Upload AntDesign, устанавливая в качестве действия функцию, при которой axios делает запрос к API imgur:
<Upload
action={file => {
const data = new FormData();
data.append('image', file);
const config = {
headers: {
'Content-type': 'application/x-www-form-urlencoded',
'Authorization': 'Client-ID xxxxxxxx'
}
}
return axios.post('https://api.imgur.com/3/upload', config, data)
}}
listType="picture-card"
fileList={fileList}
onPreview={this.handlePreview}
onChange={this.handleChange}
>
{fileList.length >= 1 ? null : uploadButton}
</Upload>
Но при попытке загрузить любой файл это единственное, что я получаю:
Access to XMLHttpRequest at 'https://api.imgur.com/3/upload' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
И очевидное необдуманное обещание из-за блока запроса:
Uncaught (in promise) Error: Network Error
at createError (createError.js:17)
at XMLHttpRequest.handleError (xhr.js:87)
Возможно, у меня что-то не так с моим кодом, так как выполнение того же запроса на почтальоне приводит к успешному результату, но я не могу найти проблему.
Редактировать: Вы правы, почтальон не ограничен CORS.