462 文字
2 分
QRコードを簡単に生成する
ライブラリを利用する
https://www.npmjs.com/package/qrcode
import QRCode from "qrcode";
await QRCode.toDataURL("example");他にも同様のライブラリは多く存在する。
URL 経由で生成する
廃止された Google Chart API
以前は Google Chart API を利用して QR コードを生成することができたが、2024 年 3 月頃に廃止された。
次のような記述で QR コードを生成することができた。
https://chart.googleapis.com/chart?chs=480x480&cht=qr&chl=exampleQR Code API
QR Code API は、Google Chart API を利用した方法のように、URL 経由で QR コードを生成することが出来る。
https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=exampleただし、Google Chart API に比べて動作は若干遅く、Google Chart API と同様に廃止される可能性もあるため注意が必要。 長期的な利用が必要な場合は、ライブラリを利用することを推奨する。
Github Actions の実行結果に QR コードを表示する
Deploy Preview を PR に表示したいケースなどでは、長期に渡り見られるようにする必要がないため、 QR Code API のような URL 経由で生成する方法が適している。
jobs: deploy: runs-on: ubuntu-latest steps: - name: Deploy site id: deploy uses: ./.github/actions/deploy-site
- name: Find Comment if: success() && github.event_name == 'pull_request' uses: peter-evans/find-comment@v3 id: fc with: issue-number: ${{ github.event.number }} comment-author: "github-actions[bot]" body-includes: "<!-- DEPLOY_LOG -->"
- name: Create comment if: success() && github.event_name == 'pull_request' && steps.fc.outputs.comment-id == '' uses: peter-evans/create-or-update-comment@v4 with: issue-number: ${{ github.event.number }} body: | <!-- DEPLOY_LOG --> ### <span aria-hidden="true">✅</span> Deploy Preview ready! | Name | Link | |---------------------------------|------------------------| |<span aria-hidden="true">🔨</span> Latest commit | ${{ github.sha }} | |<span aria-hidden="true">🔍</span> Latest deploy log | ${{ steps.outputs.deploy.logs }} | |<span aria-hidden="true">😎</span> Deploy Preview | ${{ steps.outputs.deploy.deploy_url }} | |<span aria-hidden="true">📱</span> Preview on mobile | <details><summary>Toggle QR Code</summary>  </details>|スプレッドシートで QR コードを表示・生成する
スプレッドシート上で、任意のライブラリを読み込んで QR コードを生成することは難しいため、QR Code API のような URL 経由で生成する方法が適している。
=image("https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=" & A2)