Oggetto file (immagine) come valore in un dizionario python
sto costruendo un'applicazione web che invia alcune informazioni a un'API (API Gateway di AWS) e riceve indietro un'immagine e alcune informazioni (stringhe) su quell'immagine. Le stringhe e l'immagine sono generate da una funzione lambda (servizio AWS) scritta in python .
L'idea è di avere una semplice pagina html in cui inserisco informazioni, premo un pulsante e dopo l'elaborazione nel cloud mi viene mostrata un'immagine e alcune informazioni. La gestione del json ricevuto dal gateway API avviene in javascript .
Ho già il codice per la gestione della pagina html, è già testato e funziona, lo mostro per completezza:
function getImageFromLink(){
return fetch("https://cors-anywhere.herokuapp.com/http://media.gta-series.com/images/gta2/maps/downtown.jpg");
}
async function buttonClick2(){
const returned = await getImageFromLink();
console.log(returned);
let immagine = await returned.blob();
outside = URL.createObjectURL(immagine);
document.getElementById("image").src = outside;
Ora, volevo farlo restituendo un json: tutti i kyes hanno stringhe come valori tranne uno che è per l'immagine.
Come lo posso fare? Voglio dire: come posso inserire l'immagine nel json in python (nella funzione lambda)? E come devo gestire questo json in javascript?
Risposte
Opzione 1 (consigliata e facile)
Invia urll'immagine invece di inviare l'intero blob dell'immagine nella tua risposta API. l'url può essere una posizione cloud. Questo è il modo consigliato.
Opzione 2 (per il tuo caso)
Converti la tua immagine in Base64codifica in Python usando base64la libreria e inviala come parte della tua risposta json.
{'image': '<your base64 encoded>'}
E decodifica la stringa base64 sul lato JS:
var image = new Image();
image.src = 'data:image/png;base64,iVBORw0K...';
document.body.appendChild(image);
Opzione 3 (un po' complicata e non preferita)
Qui puoi inviare l'immagine come FormData, come multipart/form-data, che non è un ottimo modo per farlo. Fai riferimento a lui su come ottenerlo -https://julien.danjou.info/handling-multipart-form-data-python/