プログラミング

QRコードの画像ファイルから内容を読み取るWebページを作りました

投稿日:2017年10月6日 更新日:

1. はじめに

QRコードの画像ファイルから内容を読み取る を作りました。

2. スクリーンショット

スクリーンショット

3. URL

以下の URL でアクセスできます。

4. 操作と内容

  1. QRコードの画像ファイルを選択します。
    • ローカルのファイルをアップロードすることもできますし、Web上にある画像ファイルの URL を指定することもできます。
  2. [ファイル送信] ボタンを押します。

以上の操作により、QRコードから取得した内容を画面に表示します。

5. ソースコード

6. 参考情報

📂-プログラミング
-

執筆者:labo


  1. 阿野 より:

    初めまして。
    どうしてもワードプレスのサイトからQRコードを読み込みたいと考え、こちらのサイトを拝見して実装しようとしたのですが、何をどうしてもワードプレス上ではエラーが出て動作しません。
    大変ご面倒かと存じますが、ご助言いただけましたら幸いです。

    宜しくお願い致します。

    • labo より:

      コメントありがとうございます。

      https://tools.laboradian.com/qrcode-reader/
      は、以下のようにして作っています(WordPressのサイトです)。
      (1) 固定ページ(スラッグを “qrcode-reader” とする)を作成します。内容は空です。
      (2) 使っているテーマのディレクトリ直下に、page-qrcode-reader.php ファイル(”page-” + スラッグ名 + “.php” )を作成します(上のURLにアクセスすると、こちらが呼ばれるようになります)。
      (3) page-qrcode-reader.php に、好き勝手に QRコードを読むPHPコードや画面のHTMLを記述します。
      ・ テーマのディレクトリで Composer を使っており、このPHPファイル内では、QRコードを読み込むライブラリを利用しています。
      ・ HTMLのヘッダ部分では get_header() 関数を実行してヘッダを出力し、フッター部分では get_footer() 関数を実行してフッタを出力させています。

      おおまかにはこのような仕組みです。

comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

時間とともに風景画像の色を変化させるサンプルページを作りました

時間とともに風景画像の色を変化させるサンプルページを作りました。 夕方や夜に変化する効果を狙っています。 目次1. スクリーンショット2. デモ3. ソースコード4. メモ 1. スクリーンショット …

Python

定期的にツイートするbotをPythonで作る方法

Twitterでツイートを行う botプログラムを Python(プログラミング言語)で作ります。 このプログラムは、CentOS(Linuxの一種です)上で定期実行します。 スポンサードリンク 目次 …

Web Programming

サーバーからブラウザを通じてデスクトップ通知する方法(Push API を利用)

Push API を使ってサーバーからブラウザにメッセージを送る方法について説明しています。

web development

Layout Instability API を使ってレイアウト・シフトを検出する

目次1. Layout Instability API について2. サンプルコード3. インターフェイス情報PerformanceObserver interfaceLayoutShift inte …

Web Programming

以前作っていた静的サイトの開発に関するメモ

以前、静的なツールでウェブサイトを作っていたのですが、その開発に関するメモです。完全にメモであることをご了承下さい。 目次方針使用しているツール新たなページを作成する時の大まかな流れ1. 新たなページ …