首頁 > web前端 > js教程 > 主體

透過二維碼獲得付款

王林
發布: 2024-07-26 16:58:44
原創
798 人瀏覽過

Get paid in QR

不,不是像素,而是歐元。

不可以,不能用信用卡。

是的,用電話。

動機

如果您銷售產品或服務,獲得報酬是一個明顯的要求。

如今信用卡為王,反正網路上也很好。

您擁有大量的支付網關,可以為您處理信用卡、Google或蘋果付款。

當然是要收費的。

在實體店,你會得到一個信用卡終端機。

有些銀行可以向您出售更便宜的 Android 應用程序,將您的手機變成 CC 終端。

這是值得考慮的,特別是如果您每天只處理幾筆付款。

這些選項幾乎涵蓋了典型消費場景中的所有情況。

一個人上網或進入實體店購買一堆產品或理髮。

但是,還有更多。

  1. 如果您是非營利組織或公民組織,需要處理小額付款怎麼辦。
  2. 如果您是 B2B 公司並且您的客戶希望透過直接轉帳付款怎麼辦。
  3. 或如果您只是不想支付約 2-3% 的信用卡付款費用怎麼辦。

在所有這些情況下,歐盟的答案是 SEPA。

更具體地說,SEPA 信用轉帳。

或者它更年輕,但速度更快的兄弟 SEPA 即時信用轉帳。

SEPA 信用轉帳

如果您不熟悉這個名字,別擔心,它還是老樣子的電匯。

例如。您告訴銀行從您的帳戶中提取資金並存入其他人的帳戶。

過去需要填寫紙本表格,現在只需在手機銀行應用程式中點擊幾下即可。

但是,我們現在擁有標準化的國際銀行帳號 - IBAN。

讓在歐盟甚至世界各地匯款變得超級簡單。

透過 SEPA Instant,您的錢幾秒鐘內就到帳。

但是,但是IBAN太長了,簡直可怕。

眾所周知,人們不擅長輸入東西,所以如果你得到正確的數量,你會很高興,忘記額外的註釋。

所有這些問題都可以透過二維碼輕鬆解決。

您的客戶可以用手機掃描它們,檢查金額並在銀行應用程式中點擊付款。

隨著加入 SEPA 即時信用轉帳計畫的銀行名單不斷增加,您的錢眨眼間就到達的機會很高。

在以後的部落格中,我們將介紹如何監視您的銀行帳戶上的收款。

例如,自動產生和發送發票。

讓我向您展示如何產生斯洛伐克和捷克共和國的二維碼。

我想讓這個清單更長,所以如果您知道在您的國家如何製作二維碼,請告訴我。

QR 斯洛伐克

斯洛伐克銀行已就名為 Pay by Square 的通用標準達成協議。

甚至還有一個可以在線上場景中使用的 url schema。

例如。用戶點擊鏈接,他們的銀行應用程式將啟動,並填寫所有付款資訊。

遺憾的是,這些無法互通(2024 年)。

讓我向您展示如何在 NodeJS 中產生二維碼。

app.get("/api/paybysquare", mustAuth, async (req, res, next) => {
    try {
        const body = req.query.content as string;
        const model = JSON.parse(body);
        const content = await generate(model);
        const qrStream = new PassThrough();
        const result = await toFileStream(qrStream, content,
            {
                type: 'png',
                width: 200,
                errorCorrectionLevel: 'H'
            }
        );

        qrStream.pipe(res);
    } catch (ex) {
        next(ex);
    }
});
登入後複製

generate 方法來自 bysquare 函式庫。

你可以像往常一樣使用 npm 安裝它 npm i bysquare

要取得可以在瀏覽器或發票文件中使用的 PNG 映像,我們呼叫以下方法。

interface IBySquareModel {
    IBAN: string;
    Amount: number;
    CurrencyCode: string; // must be "EUR",
    VariableSymbol: string;
    Payments: number; // must be 1,
    PaymentOptions: number; // must be 1,
    BankAccounts: number; // must be 1,
    PaymentNote?: string; // optional note
}

const BySquareQR = (payModel: IBySquareModel) => {
    return <img style={{ width: "120px", height: "120px" }} src={"/api/paybysquare?content=" + encodeURIComponent(JSON.stringify(payModel))} />
}

登入後複製

在付款中添加描述性訊息通常非常有幫助。

這是一些簡單的程式碼,可以規範客戶端名稱。

這將刪除變音符號,將 Ján Kováč 轉換為 Jan Kovac

應該仍然完全可讀,並確保銀行系統不會搞砸。

    const paymentMessage = customerName?.normalize("NFKD").replace(/[\u0300-\u036f]/g, "").substring(0, 100) || "";
登入後複製

QR 捷克共和國

儘管捷克共和國或捷克共和國迄今(2024年)抵制歐元,但他們也有二維碼計劃。

他們甚至還有我們可以使用的免版稅代碼產生器。
現在,出於安全原因,您可能仍然想自己生成它。

const czQrLink = "https://api.paylibo.com/paylibo/generator/image?iban=" + iban + "&amount=" + 
czkPrice + "&currency=CZK&vs=" + vsym + 
"&message=" + message;

const CzQrImage = (czQrLink: string) => {
    return <img style={{ width: "120px", height: "120px" }} src={czQrLink} />
}
登入後複製

國際的

遺憾的是,目前還沒有國際或歐洲的二維碼標準。

因此,您必須根據使用者所在的國家/地區顯示正確的二維碼。

如果您希望從捷克共和國付款,請記住捷克二維碼僅適用於捷克克朗(捷克貨幣 CZK)。

或者,如果您位於捷克共和國,並且希望從斯洛伐克付款,則二維碼僅適用於歐元。

The code below can help you calculate the right currency amount.

First we get the current reference exchange rate from the central bank.

Then we calculate the euro and czk prices, depending on the product price and currency.

const getExchangeRate = async () => {
    const now = new Date();
    const dt = new Date(now.getFullYear(), now.getMonth(), now.getDate() - 1).toISOString().substring(0, 10);

    const url = "https://nbs.sk/export/sk/exchange-rate/" + dt + "/xml";
    const dat  = { url: url }
    const opts = {
        headers: {
            'Content-Type': 'application/json'
        },
        method: "POST",
        body: JSON.stringify(dat)
    }

    const resp = await fetch("/api/httpfetch", opts);
    const xml = await resp.text();

    const parser = new DOMParser();
    const xmlDoc = parser.parseFromString(xml, "text/xml");
    const node = xmlDoc.querySelector("Cube [currency='CZK']");
    if (node) {
        const attr = node.getAttribute("rate");
        if (attr) {
            const num = attr.replace(/\s/, "").replace(",", ".");
            return +num;
        }
    }
    return undefined;
}

    // basePrice is the amount to be paid, for the products or services
    // currencyCode is the currency the products or services are sold in.
    const czkRate = await getExchangeRate();

    const eurPrice = currencyCode === "EUR" ? basePrice : (Math.ceil(basePrice / czkRate * 100) / 100).toFixed(2);
    const czkPrice = currencyCode === "CZK" ? basePrice : (Math.ceil(basePrice * czkRate * 100) / 100).toFixed(2);
登入後複製

Get Paid

Trying to read badly printed IBANs from invoices or even typing in the horribly long IBANs is super annoying.

That you have to be very careful and check three times, because it is money, makes it even more so.

We make software to make our lives easier, and QR codes for payments fit this goal nicely.

I hope you found the information useful, and if you have some pointers about your national QR code schemes, please shoot them my way.

Happy hacking!

以上是透過二維碼獲得付款的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:dev.to
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板