Laravel에서 QR 코드를 생성하는 방법

49775 단어 webdevlaravel
제품 ID, 재고 등을 위해 QR 코드가 필요한 경우가 있습니다. 그렇다면 QR코드는 어떻게 생성할까요? 간단합니다. Simple QRcode를 사용하여 laravel 프레임워크에서 QRcode를 만들 수 있습니다.

이 기사에서는 코드가 SMS, 이메일, 웹 사이트로 연결될 때 또는 QR 코드 뒤에 어떤 데이터가 있는지 알아보기 위해 QR 코드를 생성하거나 생성하는 방법을 배웁니다.

이 실험에서는 새로운 laravel 프로젝트를 생성하기 전에 처음부터 모든 것을 시작할 것입니다. 다음 단계는 다음과 같습니다.
  • laravel 프로젝트를 만들려는 디렉토리로 이동하여 laravel 프로젝트를 만듭니다. laravel의 안내와 마찬가지로 아래와 같은 명령어로 새로운 프로젝트를 생성할 수 있습니다.

  • composer create-project --prefer-dist laravel/laravel qrcode
    


  • laravel 프로젝트가 성공적으로 생성되었으면 프로젝트 디렉토리로 들어가 아래와 같이 Simple QRcode에서 명령어를 실행합니다.

  • composer require simplesoftwareio/simple-qrcode "~4"
    


  • 아래 명령을 사용하여 새 컨트롤러 파일을 만듭니다.

  • php artisan make:controller DataController
    


  • 그런 다음 모델과 마이그레이션 파일을 생성하여 QRcode로 생성될 데이터 컨테이너 테이블을 생성합니다. 모델/마이그레이션을 만드는 명령어는 아래와 같이 볼 수 있습니다.

  • php artisan make:model Data -m
    


  • 데이터베이스> 마이그레이션 폴더에서 Data Migrate 파일을 열고 아래와 같이 편집하십시오.

  • <?php
    use Illuminate\Database\Migrations\Migration;
    use Illuminate\Database\Schema\Blueprint;
    use Illuminate\Support\Facades\Schema;
    class CreateDataTable extends Migration
    {
        /**
         * Run the migrations.
         *
         * @return void
         */
        public function up()
        {
            Schema::create('data', function (Blueprint $table) {
                $table->id();
                $table->string('name');
                $table->string('email');
                $table->bigInteger('phone');
                $table->timestamps();
            });
        }
        /**
         * Reverse the migrations.
         *
         * @return void
         */
        public function down()
        {
            Schema::dropIfExists('data');
        }
    }
    


  • phpmyadmin, adminer, laragon 또는 기타에서 새 데이터베이스를 만듭니다.
  • .env 파일의 DB_DATABASE를 새로 만든 데이터베이스의 이름과 일치시킵니다.
  • 새 데이터베이스가 생성되면 터미널로 돌아가서 php artisan migrate 명령을 실행합니다.
  • 3단계에서 만든 DataController 파일을 연 다음 아래와 같이 코드를 편집합니다.

  • <?php
    namespace App\Http\Controllers;
    use Illuminate\Http\Request;
    use SimpleSoftwareIO\QrCode\Facades\QrCode;
    use App\Models\Data;
    class GenerateController extends Controller
    {
        public function index(){
            $data = Data::all();
            return view ('welcome', ['data' => $data]);
        }
        public function store(Request $request){
            $data = new Data;
            $data->name = $request->name;
            $data->email = $request->email;
            $data->phone = $request->phone;
            $data->save();
            return back();
        }
        public function generate ($id)
        {
            $data = Data::findOrFail($id);
            $qrcode = QrCode::size(400)->generate($data->name);
            return view('qrcode',compact('qrcode'));
        }
    }
    


    참고:

    Function index berfungsi untuk menampilkan data-data dari database (table data).

    Function store berfungsi untuk menambahkan data baru ke dalam table data (model Data).

    Function generate berfungsi untuk membuat QRcode dari data yang ingin di generate menjadi QR code (nama, email atau phone number).


  • Buka 파일 web.php 양 ada di 폴더 경로, kemudian 편집 menjadi seperti di bawah ini.

  • <?php
    use Illuminate\Support\Facades\Route;
    use App\Http\Controllers\DataController;
    /*
    |--------------------------------------------------------------------------
    | Web Routes
    |--------------------------------------------------------------------------
    |
    | Here is where you can register web routes for your application. These
    | routes are loaded by the RouteServiceProvider within a group which
    | contains the "web" middleware group. Now create something great!
    |
    */
    Route::get('/', [DataController::class, 'index']);
    Route::post('/', [DataController::class, 'store'])->name('store');
    Route::get('qrcode/{id}', [DataController::class, 'generate'])->name('generate');
    


  • views 폴더에서 welcome.blade.php 파일을 연 다음 아래와 같이 편집합니다.

  • <!DOCTYPE html>
    <html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
        <head>
            <meta charset="utf-8">
            <meta name="viewport" content="width=device-width, initial-scale=1">
            <title>Laravel</title>
            <!-- Fonts -->
            <link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap" rel="stylesheet">
            <!-- Styles -->
            <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
            <style>
                body {
                    font-family: 'Nunito';
                }
            </style>
        </head>
        <body>
            <div class="container">
                <div class="row mt-5">
                    <form class="form-inline" action="{{ route('store') }}" method="POST">
                        @csrf
                        <div class="form-group mb-2">
                          <input type="text" class="form-control" name="name" placeholder="Masukkan Nama">
                        </div>
                        <div class="form-group mb-2 ml-1">
                            <input type="email" class="form-control" name="email" placeholder="Masukkan Email">
                          </div>
                          <div class="form-group mb-2 ml-1">
                            <input type="number" class="form-control" name="phone" placeholder="Masukkan Nomor Telephone">
                          </div>
                        <button type="submit" class="btn btn-primary ml-1 mb-2">Create</button>
                      </form>
                    <br>
                    <table class="table">
                        <thead>
                          <tr>
                            <th scope="col">Nama</th>
                            <th scope="col">Email</th>
                            <th scope="col">Phone</th>
                            <th scope="col">QR code</th>
                          </tr>
                        </thead>
                        <tbody>
                         @foreach ($data as $data)
                         <tr>
                            <td>{{ $data->name }}</td>
                            <td>{{ $data->email }}</td>
                            <td>{{ $data->phone }}</td>
                            <td>
                                <a href="{{ route('generate',$data->id) }}" class="btn btn-primary">Generate</a>
                            </td>
                          </tr>
                         @endforeach
                        </tbody>
                      </table>
                </div>
            </div>
            <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>
        </body>
    </html>
    


  • qrcode.blade.php라는 보기 폴더에 새 보기 파일을 만들어 나중에 QR 코드를 표시합니다. 그런 다음 새 보기 파일에 아래 코드를 추가합니다.

  • <!DOCTYPE html>
    <html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
        <head>
            <meta charset="utf-8">
            <meta name="viewport" content="width=device-width, initial-scale=1">
            <title>Laravel</title>
            <!-- Fonts -->
            <link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap" rel="stylesheet">
            <!-- Styles -->
            <style>
                /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}a{background-color:transparent}[hidden]{display:none}html{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}*,:after,:before{box-sizing:border-box;border:0 solid #e2e8f0}a{color:inherit;text-decoration:inherit}svg,video{display:block;vertical-align:middle}video{max-width:100%;height:auto}.bg-white{--bg-opacity:1;background-color:#fff;background-color:rgba(255,255,255,var(--bg-opacity))}.bg-gray-100{--bg-opacity:1;background-color:#f7fafc;background-color:rgba(247,250,252,var(--bg-opacity))}.border-gray-200{--border-opacity:1;border-color:#edf2f7;border-color:rgba(237,242,247,var(--border-opacity))}.border-t{border-top-width:1px}.flex{display:flex}.grid{display:grid}.hidden{display:none}.items-center{align-items:center}.justify-center{justify-content:center}.font-semibold{font-weight:600}.h-5{height:1.25rem}.h-8{height:2rem}.h-16{height:4rem}.text-sm{font-size:.875rem}.text-lg{font-size:1.125rem}.leading-7{line-height:1.75rem}.mx-auto{margin-left:auto;margin-right:auto}.ml-1{margin-left:.25rem}.mt-2{margin-top:.5rem}.mr-2{margin-right:.5rem}.ml-2{margin-left:.5rem}.mt-4{margin-top:1rem}.ml-4{margin-left:1rem}.mt-8{margin-top:2rem}.ml-12{margin-left:3rem}.-mt-px{margin-top:-1px}.max-w-6xl{max-width:72rem}.min-h-screen{min-height:100vh}.overflow-hidden{overflow:hidden}.p-6{padding:1.5rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.pt-8{padding-top:2rem}.fixed{position:fixed}.relative{position:relative}.top-0{top:0}.right-0{right:0}.shadow{box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.text-center{text-align:center}.text-gray-200{--text-opacity:1;color:#edf2f7;color:rgba(237,242,247,var(--text-opacity))}.text-gray-300{--text-opacity:1;color:#e2e8f0;color:rgba(226,232,240,var(--text-opacity))}.text-gray-400{--text-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--text-opacity))}.text-gray-500{--text-opacity:1;color:#a0aec0;color:rgba(160,174,192,var(--text-opacity))}.text-gray-600{--text-opacity:1;color:#718096;color:rgba(113,128,150,var(--text-opacity))}.text-gray-700{--text-opacity:1;color:#4a5568;color:rgba(74,85,104,var(--text-opacity))}.text-gray-900{--text-opacity:1;color:#1a202c;color:rgba(26,32,44,var(--text-opacity))}.underline{text-decoration:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.w-5{width:1.25rem}.w-8{width:2rem}.w-auto{width:auto}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}@media (min-width:640px){.sm\:rounded-lg{border-radius:.5rem}.sm\:block{display:block}.sm\:items-center{align-items:center}.sm\:justify-start{justify-content:flex-start}.sm\:justify-between{justify-content:space-between}.sm\:h-20{height:5rem}.sm\:ml-0{margin-left:0}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:pt-0{padding-top:0}.sm\:text-left{text-align:left}.sm\:text-right{text-align:right}}@media (min-width:768px){.md\:border-t-0{border-top-width:0}.md\:border-l{border-left-width:1px}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:1024px){.lg\:px-8{padding-left:2rem;padding-right:2rem}}@media (prefers-color-scheme:dark){.dark\:bg-gray-800{--bg-opacity:1;background-color:#2d3748;background-color:rgba(45,55,72,var(--bg-opacity))}.dark\:bg-gray-900{--bg-opacity:1;background-color:#1a202c;background-color:rgba(26,32,44,var(--bg-opacity))}.dark\:border-gray-700{--border-opacity:1;border-color:#4a5568;border-color:rgba(74,85,104,var(--border-opacity))}.dark\:text-white{--text-opacity:1;color:#fff;color:rgba(255,255,255,var(--text-opacity))}.dark\:text-gray-400{--text-opacity:1;color:#cbd5e0;color:rgba(203,213,224,var(--text-opacity))}}
            </style>
            <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
            <style>
                body {
                    font-family: 'Nunito';
                }
            </style>
        </head>
        <body>
            <div class="container">
                <div class="row mt-5 text-center">
                    {!! $qrcode !!}
                </div>
            </div>
            <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>
        </body>
    </html>
    


    자, 이제 우리는 서버(php artisan serve)를 실행하여 프로그램을 실행하려고 합니다. URL 127.0.0.1:8000 또는 qrcode.test를 엽니다.


    첫 페이지 표시 또는 welcome.blade.php 파일에서 위의 그림과 같을 것입니다. 그런 다음 이름, 이메일, 전화 번호와 같은 3개의 기존 양식에 데이터를 입력한 다음 생성을 클릭하여 데이터를 추가합니다.



    일부 기존 데이터에서 QR 코드를 보려면 생성 버튼을 누르십시오. 그러면 위의 이미지에서 볼 수 있듯이 데이터의 QR 코드가 표시됩니다.



    휴대폰 스캐너나 다른 것을 사용하여 스캔을 시도하면 스캐너가 QR 코드를 캡처하면 위 이미지와 같은 페이지로 이동합니다.

    여기에서 laravel에서 스캔할 때 이름 데이터를 표시하는 QR 코드를 생성하는 데 성공했습니다. 그런 다음 스캔할 때 이메일로 리디렉션되도록 하려면 어떻게 해야 합니까? 자세한 내용은 Codelapan.com에서 확인하세요.

    좋은 웹페이지 즐겨찾기