區分二維碼 url 和 api url 的參數

Question

我想生成一個帶有多個預填值的二維碼。 但似乎只有第一個值被編碼到生成的二維碼中。 我猜是因為它假設第一個參數之后的參數屬於 api url..

有人能幫我一下嗎？

.src = "https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=" 
+ "https://google.com/?" + "field1=" + var1 + "&" + "field2=" + var2

我在網上看過沒有運氣 - 也許是因為我不知道如何描述這個問題。 （請注意，google.com 只是一個占位符 url，而不是我正在使用的那個）

Answer 1

由於您嘗試傳遞給data的 URL 包含/ , ? 並且&你必須對其進行編碼。 例如，瀏覽器不知道是將field2傳遞給主 URL 還是傳遞給data URL。要對傳遞給data的 URL 進行編碼：

const url = "https://google.com/?" + "field1=" + var1 + "&" + "field2=" + var2
const src = "https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=" + encodeURIComponent(url)

在一個不相關的說明中，考慮使用模板字符串來使您的代碼更具可讀性：

const url = `https://google.com/?field1=${var1}&field2=${var2}`
const src = `https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=${encodeURIComponent(url)}`