Я в этом деле не опытна, и не знаю как решить данную проблему. У меня есть код, на клиенте:
<input type="file" name="avatar" id="upl">
<button class="submit">send</button>
<img id="img" src="" width="40px"/>
<script>
$(".submit").click(function(){
var file_data = $('#upl').prop('files')[0];
var form_data = new FormData();
form_data.append('file', file_data);
$.ajax({
type: 'POST',
url: 'http://192.168.0.15:3000/data',
dataType: 'json',
cache: false,
contentType: false,
processData: false,
data: form_data,
success: function(data) {}
});
});
</script>
на Сервере :
var fileupload = require("express-fileupload");
app.use(fileupload());
app.post('/data', async(req, res)=>{
let image = req.files.file;
await image.mv('./img/' + image.name); //сохраняет картинку в файле img
});
Если вкратце, то на клиенте есть input
с типом file
в который загружается выбранная пользователем картинка, она отправляется с помощью ajax
на сервер, он принимает запрос и сохраняет отправленную картинку к себе в папку. Только проблема в том, что я не знаю как отправить картинку назад на клиент, взяв её из той же папки где мы ее сохранили - ./img
и отобразить с помощью тега img
. Это нужно сделать с помощью ajax
, так как это приложение Cordova и сервер к которому оно обращается, расположен отдельно.