Derinlemesine yazılım eğitimleri için kanalımı takip edebilirsiniz...

QrCode Nedir? QRCode.js ve QRCoder Kütüphanelerini Kullanarak QrCode Oluşturma

Merhaba,

Çağımızın gereği en önemli unsur ‘bilgi’… Dolayısıyla hayatımız bilgi merkezli bir yaklaşımla şekillenmekte ve bu yüzden günlük yaşantımızda belirli ihtiyaçlar ortaya çıkmaktadır. Bu ihtiyaçlardan en önemli ve hassasiyet gerektireni, bilginin bir yerden başka bir yere taşınması ve transfer edilmesidir. Bilginin transfer sürecinde hedef odaklı bir disiplin ile birlikte güvenlik faktörlerininde önemi göz ardı edilemeyecek derecede kritik arz etselerde biz bu içeriğimizde -bilginin transfer- süreci odalı bir teknolojiyle ilgileneceğiz. Bu teknoloji QrCode teknolojisidir.

QrCode Nedir?

Pratik anlamda bilginin taşınmasının en kolay yolu…

İsmini Quick Response(QR) kelimelerinin baş harflerinden alan bu teknoloji ilk olarak otomotiv sanayi sektöründe kullanılmak amacıyla geliştirilmiştir ve genellikle mobil cihazların kameralarından okutulabilen ve görsel olarak kodlanmış(yahut görsele gömülmüşte diyebiliriz) veriyi eylemi gerçekleştiren cihaza transfer eden bir teknolojidir. Yapısal olarak aşağıdakine benzer niteliklerde bir kare koddan oluşmaktadır;

QrCode Nedir QRCode.js ve QRCoder Kütüphanelerini Kullanarak QrCode Oluşturma
Sanırım günlük hayatımıza azar azar temas eden bu kare koda çok yabancı olmasa gerek 🙂

Peki bu kodu kendi projelerimize özel nasıl oluşturabiliriz?
QrCode’u kendi projelerimizde kullanabilmek için JavaScript temelli QRCode.js kütüphanesini yahut .NET ortamında QRCoder kütüpnanesini kullanabiliriz. Bu içeriğimizde her iki kütüphane ile bir QrCode’un nasıl oluşturulduğunu inceleyeceğiz.

QRCode.js İle JavaScript Ortamında QrCode Oluşturma

QrCode üretebilmek için tasarlanmış hazır JavaScript kütüphanesidir. Buradaki adresten indirilebilir. Kullanımı ise aşağıdaki gibi oldukça basit ve pratiktir;

<html>
<head>
    <script src="qrcode.min.js"></script>
</head>
<body>
    <div id="qrcode"></div>
    <script type="text/javascript">
        new QRCode(document.getElementById("qrcode"), {
            text: 'barkoda cevrilecek veriyi buraya yazınız.',
            width: 250,
            height: 250,
            colorDark: 'red',
            colorLight: 'white',
            correctLevel: QRCode.CorrectLevel.H
        });
    </script>
</body>
</html>

QrCode Nedir QRCode.js ve QRCoder Kütüphanelerini Kullanarak QrCode Oluşturma
Görüldüğü üzere üretilecek barkodun renk, boyut vs. gibi özellikleri ayarlanabilmekte ve hızlıca sayfaya gömülebilmektedir.

QRCoder İle Asp.NET Core Ortamında QrCode Oluşturma

QRCoder ise QrCode üretebilmemizi sağlayan C# ile yazılmış basit bir kütüphanedir. Şuradaki adresten indirilip .NET çatısı altındaki Asp.NET/Core Web API/MVC vs. tüm uygulamalara dahil edilebilir. Biz içeriğimizde Asp.NET Core Web API mimarisinde QrCode oluşturmayı örneklendireceğiz.

İlgili kütüphaneyi uygulamaya indirdikten sonra “QrCode(Controllers).cs” isimli controller sınıfı içerisinde aşağıdaki çalışmayı yapmanız yeterlidir;

    [ApiController]
    [Route("api/[controller]")]
    public class QrCodeController : ControllerBase
    {
        public IActionResult QrCodeGenerator(string text)
        {
            QRCodeGenerator qRCodeGenerator = new QRCodeGenerator();
            QRCodeData qrCodeData = qRCodeGenerator.CreateQrCode(text, QRCodeGenerator.ECCLevel.Q);
            QRCode qrCode = new QRCode(qrCodeData);
            Bitmap qrCodeImage = qrCode.GetGraphic(10, Color.Orange, Color.White, true);
            using (MemoryStream stream = new MemoryStream())
            {
                qrCodeImage.Save(stream, ImageFormat.Png);
                var bitmapBytes = stream.ToArray();
                return File(bitmapBytes, "image/jpeg");
            }
        }
    }

İlgili kaynak kodun 10. satırındaki ‘GetGraphic’ metodundan aşağıdaki olası hatayı alırsanız eğer ‘System.Drawing.Common’ kütüphanesini uygulamaya yüklemeniz yeterlidir.
QrCode Nedir QRCode.js ve QRCoder Kütüphanelerini Kullanarak QrCode Oluşturma

Hata mesajı;

Assembly ‘QRCoder’ with identity ‘QRCoder, Version=1.3.6.0, Culture=neutral, PublicKeyToken=null’ uses ‘System.Drawing.Common, Version=4.0.0.1, Culture=neutral, PublicKeyToken=cc7b13ffcd2ddd51’ which has a higher version than referenced assembly ‘System.Drawing.Common’ with identity ‘System.Drawing.Common, Version=4.0.0.0, Culture=neutral, PublicKeyToken=cc7b13ffcd2ddd51’

Hata görseli;
QrCode Nedir QRCode.js ve QRCoder Kütüphanelerini Kullanarak QrCode Oluşturma

Velhasıl yukarıdaki işlemin çıktısı aşağıdaki gibi olacaktır;
QrCode Nedir QRCode.js ve QRCoder Kütüphanelerini Kullanarak QrCode Oluşturma

Böylece birden fazla kütüphane ile aynı işlemin yani QrCode barkodunun nasıl oluşturulduğunu incelemiş olduk. Sonraki içeriklerimizde farklı platformlarda bu barkodların nasıl okunduğuna dair içerikler kaleme alacağız. O halde ilgili içeriklerde görüşmek üzere…

İlgilenenlerin faydalanması dileğiyle…
İyi çalışmalar…

Not : Örnek çalışmaları indirmek için buraya tıklayınız.

Bunlar da hoşunuza gidebilir...

3 Cevaplar

  1. 16 Mart 2020

    […] önceki QrCode Nedir? QRCode.js ve QRCoder Kütüphanelerini Kullanarak QrCode Oluşturma başlıklı yazımızda QrCode nedir ve nasıl oluşturulur detaylıca incelemiştik. Bu […]

  2. 18 Mart 2020

    […] QrCode Nedir? QRCode.js ve QRCoder Kütüphanelerini Kullanarak QrCode Oluşturma başlıklı makale akabinde klavyeye aldığımız Instascan.js Kütüphanesi İle QrCode Okuma makalemizden sonra sıra bir Angular projesi üzerinde QrCode’un nasıl okunduğunu incelemeye geldi. […]

  3. 06 Mayıs 2021

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

*