5
Sto tentando di impostare l'autenticazione a due fattori con Google Authenticator sul mio sito. Sono in grado di generare codici di lavoro, ma quando inserisco l'URL dell'immagine nella pagina, ottengo il seguente errore in Chrome ispettore:400 Richiesta errata quando si tenta di inserire l'immagine del codice QR per Google Authenticator
GET https://www.google.com/chart?chs=200x200&chld=M|0&cht=qr&chl=otpauth://totp/MyLabel?secret=THESECRET 400 (Bad Request)
Il codice per generare il codice QR:
try
key = crypto.randomBytes(10).toString('hex')
catch error
console.log "error generating code: #{error}"
encoded = base32.encode(key)
label = encodeURIComponent "MyLabel"
uri = "otpauth://totp/#{label}?secret=#{encoded}"
url = "https://www.google.com/chart?chs=200x200&chld=M|0&cht=qr&chl=#{uri}"
jQuery lato client che inserisce l'immagine:
img = $("<img>").attr("src", url)
$("#qr_box").html("")
$("#qr_box").append(img)
che si traduce nella seguente codice HTML della pagina:
<img src="https://www.google.com/chart?chs=200x200&chld=M|0&cht=qr&chl=otpauth://totp/MyLabel?secret=THESECRET">
L'immagine può essere aperta in una nuova scheda senza problemi. L'immagine viene visualizzata correttamente nella mia pagina solo per circa 1/10 del tempo; le altre volte Chrome dà un 400. Mi manca qualcosa di ovvio qui?
Sembra che la richiesta fatta a Google dal browser sia stata restituita con tipo text/html anziché image/png. Ho impostato un semplice endpoint per richiedere l'url, catturare la risposta e impostare il tipo su image/png prima di tornare al front-end. Se qualcuno conosce un modo più elegante per farlo mi piacerebbe sentire. – kshen