Edit Question - KnowledgeHub

Title Body

I'm trying to set up two-factor authentication with Google Authenticator on my site. I'm able to generate working codes, but when I insert the image URL into the page, I get the following error in Chrome inspector: GET https://www.google.com/chart?chs=200x200&chld=M|0&cht=qr&chl=otpauth://totp/MyLabel?secret=THESECRET 400 (Bad Request) The code to generate the QR code: 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}" Client-side jQuery that inserts the image: img = $("<img>").attr("src", url) $("#qr_box").html("") $("#qr_box").append(img) Which results in the following HTML on the page: <img src="https://www.google.com/chart?chs=200x200&amp;chld=M|0&amp;cht=qr&amp;chl=otpauth://totp/MyLabel?secret=THESECRET"> The image can be opened in a new tab without a problem. The image is only successfully displayed in my page about 1/10 the time; the other times Chrome gives a 400. Am I missing something obvious here?

Tags (comma-separated) Cancel