Загрузка файлов через API на сторонний сервис
У меня есть SPA на Express.JS + React Клиентская часть:
const [filename, setFilename] = useState('');
const [attachmentUrl, setAttachmentUrl] = useState('');
const inputFileRef = useRef(null);
const handleChangeFile = async (event) => {
try {
const formData = new FormData();
const file = event.target.files[0];
formData.append('file', file);
const { data } = await axios.post('/upload', formData);
setAttachmentUrl(data.url);
setFilename(data.name);
} catch (err) {
console.warn(err);
alert('Не удалось загрузить файл');
}
};
Серверная часть:
app.post('/upload', checkAuth, upload.single('file'), async (req, res) => {
try {
const file = req.file; // Получаем файл из запроса
const formData = new FormData();
formData.append('filename', file);
formData.append('access', 'false');
const { data } = await axios.post('http://hdde.ru/api/upload.php', formData, {
headers: {
...formData.getHeaders(),
},
});
// Передаем нужные данные клиенту
res.json({
name: data.name,
url: data.link,
});
} catch (error) {
console.error(error);
res.status(500).json({ error: 'Ошибка при загрузке файла на сервер' });
}
});
По документации сервиса сказано, что в поле filename (сам не знаю, почему так решили назвать ?♂️) нужно передать сам файл. Для примера и проверки, работает ли вообще сервис, сделал запрос через Insomnia согласно документации и получил такой вот объект в ответ:
{
"data": {
"id": 84,
"url": "https://hdde.ru/file84",
"link": "https://hdde.ru/files/hdde.ru_2192_1703156797.txt",
"name": "Kods.txt",
"opis": "",
"type": "txt",
"author": "User1352",
"time": 1703156797
},
"success": true,
"status": 200
}
Получаю такую ошибку в консоле при попытке загрузки файла:
[Warning] Jk (main.e50295b6.js, line 2)
code: "ERR_BAD_RESPONSE"
config: {transitional: {silentJSONParsing: true, forcedJSONParsing: true, clarifyTimeoutError: false}, adapter: ["xhr", "http"], transformRequest: Array, transformResponse: Array, timeout: 0, …}
message: "Request failed with status code 500"
name: "AxiosError"
request: XMLHttpRequest
listeners: {loadend: Array, abort: Array, error: Array, timeout: Array}
onabort: function()
onerror: function()
onload: null
onloadend: function()
onloadstart: null
onprogress: null
onreadystatechange: null
ontimeout: function()
readyState: 4
response: "{\"error\":\"Ошибка при загрузке файла на сервер\"}"
responseText: "{\"error\":\"Ошибка при загрузке файла на сервер\"}"
responseType: ""
responseURL: "http://test1.ru/upload"
responseXML: null
status: 500
statusText: "Internal Server Error"
timeout: 0
upload: XMLHttpRequestUpload {onloadstart: null, onprogress: null, onabort: null, onerror: null, onload: null, …}
withCredentials: false
XMLHttpRequest (прототип)
response: Object
config: {transitional: {silentJSONParsing: true, forcedJSONParsing: true, clarifyTimeoutError: false}, adapter: ["xhr", "http"], transformRequest: Array, transformResponse: Array, timeout: 0, …}
data: {error: "Ошибка при загрузке файла на сервер"}
headers: Rw {access-control-allow-origin: "*", connection: "keep-alive", content-length: "77", content-type: "application/json; charset=utf-8", date: "Thu, 21 Dec 2023 14:45:40 GMT", …}
request: XMLHttpRequest
listeners: {loadend: Array, abort: Array, error: Array, timeout: Array}
onabort: function()
onerror: function()
onload: null
onloadend: function()
onloadstart: null
onprogress: null
onreadystatechange: null
ontimeout: function()
readyState: 4
response: "{\"error\":\"Ошибка при загрузке файла на сервер\"}"
responseText: "{\"error\":\"Ошибка при загрузке файла на сервер\"}"
responseType: ""
responseURL: "http://test1.ru/upload"
responseXML: null
status: 500
statusText: "Internal Server Error"
timeout: 0
upload: XMLHttpRequestUpload {onloadstart: null, onprogress: null, onabort: null, onerror: null, onload: null, …}
withCredentials: false
XMLHttpRequest (прототип)
status: 500
statusText: "Internal Server Error"
Object (прототип)
stack: "Jk@http://test1.ru/static/js/main.e50295b6.js:2:1208522↵@http://test1.ru/static/js/main.e50295b6.js:2:122268…"
Jk (прототип)
Помогите дурному новичку, пожалуйста ? Уже все перепробовал, не могу понять, в чем проблема..