QRCode.Fun QRCode.Fun
شروع کریں
JavaScript QR کوڈ لائبریری

JavaScript کے ساتھ QR کوڈ بنائیں

JavaScript ویب ڈیولپمنٹ کے لیے سب سے مقبول زبان ہے۔ براؤزر یا Node.js میں QR کوڈ بنانے کے لیے qrcode.js یا qr-code-styling جیسی لائبریریز استعمال کریں، یا جدید اسٹائلنگ کے لیے QRCode.fun API کال کریں۔

QR جنریٹر آزمائیںAPI دستاویزات دیکھیں

انسٹالیشن

اپنے پسندیدہ پیکیج مینیجر کا استعمال کرکے مقبول JavaScript QR کوڈ لائبریریز انسٹال کریں۔

npm
npm install qrcode
yarn
yarn add qrcode
npm (styled)
npm install qr-code-styling

JavaScript لائبریریز سے QR کوڈ بنائیں

اپنے پراجیکٹس میں QR کوڈ بنانے کے لیے مقبول JavaScript QR کوڈ لائبریریز کے استعمال کی کوڈ مثالیں۔

Basic QR Code (Node.js)
const QRCode = require('qrcode')

// Generate QR code as data URL
const dataUrl = await QRCode.toDataURL('https://qrcode.fun')
console.log(dataUrl)

// Generate QR code as file
await QRCode.toFile('./qrcode.png', 'https://qrcode.fun', {
  width: 300,
  margin: 2,
  color: {
    dark: '#1A2B3C',
    light: '#FFFFFF'
  }
})
Browser Canvas Rendering
import QRCode from 'qrcode'

const canvas = document.getElementById('canvas')
await QRCode.toCanvas(canvas, 'https://qrcode.fun', {
  width: 256,
  margin: 2,
  color: {
    dark: '#1A2B3C',
    light: '#FFFFFF'
  }
})
Styled QR Code with Logo
import QRCodeStyling from 'qr-code-styling'

const qrCode = new QRCodeStyling({
  width: 300,
  height: 300,
  data: 'https://qrcode.fun',
  image: '/logo.png',
  dotsOptions: {
    color: '#1A2B3C',
    type: 'rounded'
  },
  cornersSquareOptions: {
    color: '#8564C3',
    type: 'extra-rounded'
  },
  backgroundOptions: {
    color: '#FFFFFF'
  }
})

qrCode.append(document.getElementById('qr-container'))
qrCode.download({ extension: 'png' })
QRCode.fun API

JavaScript میں API سے QR کوڈ بنائیں

اپنی JavaScript ایپلیکیشن سے حسب ضرورت رنگوں، شکلوں اور لوگوز کے ساتھ اسٹائلڈ QR کوڈ بنانے کے لیے QRCode.fun API استعمال کریں۔

JavaScript API انضمام
// Using fetch (Browser or Node.js 18+)
const response = await fetch('https://qrcode.fun/api/generate-qr-styled', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({
    data: 'https://qrcode.fun',
    width: 300,
    height: 300,
    type: 'png',
    margin: 10,
    dotsOptions: {
      color: '#1A2B3C',
      type: 'rounded'
    },
    cornersSquareOptions: {
      color: '#8564C3',
      type: 'extra-rounded'
    },
    backgroundOptions: {
      color: '#FFFFFF'
    }
  })
})

const result = await response.json()
// result.data contains the base64 PNG data URL
console.log(result.data)

لائیو QR کوڈ پریویو

ابھی JavaScript سے QR کوڈ بنا کر دیکھیں۔

QR پریویو

مقامی لائبریری بمقابلہ API

JavaScript QR کوڈ لائبریری کا براہ راست استعمال بمقابلہ QRCode.fun API کا موازنہ۔

فیچرمقامی لائبریریQRCode.fun API
سیٹ اپ پیچیدگیپیکیج انسٹال کریں، بنڈلر ترتیب دیںایک HTTP ریکوئسٹ
حسب ضرورت تبدیلیلائبریری کے مطابق مختلفمکمل اسٹائلنگ: رنگ، شکلیں، لوگوز
آف لائن سپورٹہاںانٹرنیٹ درکار
دیکھ بھالڈیپنڈنسیز دستی طور پر اپڈیٹ کریںہمیشہ اپڈیٹ
آؤٹ پٹ فارمیٹسPNG, SVG (لائبریری پر منحصر)PNG, SVG

JavaScript QR کوڈ استعمال کی صورتیں

عام منظرنامے جہاں JavaScript ڈیولپرز QR کوڈ بناتے ہیں۔

ویب ایپلیکیشنز

لنکس، ادائیگیوں یا تصدیق کی شیئرنگ کے لیے React، Vue، Angular یا ونیلا JS ویب ایپس میں متحرک طور پر QR کوڈ بنائیں۔

Node.js بیک اینڈ

انوائسز، ٹکٹس، شپنگ لیبلز اور خودکار ای میل منسلکات کے لیے سرور سائیڈ QR کوڈ بنائیں۔

پروگریسو ویب ایپس

اسکین ایبل کوڈز کے ساتھ آف لائن قابل موبائل تجربات کے لیے PWAs میں QR کوڈ جنریشن شامل کریں۔

براؤزر ایکسٹینشنز

موجودہ صفحے کے URL یا منتخب ٹیکسٹ کے لیے QR کوڈ بنانے والے Chrome یا Firefox ایکسٹینشنز بنائیں۔

اکثر پوچھے جانے والے سوالات

JavaScript سے QR کوڈ بنانے کے بارے میں عام سوالات۔

دو سب سے مقبول اختیارات qrcode (ہلکی، سادہ QR کوڈز کے لیے بہترین) اور qr-code-styling (رنگوں، شکلوں اور لوگوز کے ساتھ جدید حسب ضرورت تبدیلی) ہیں۔ سادگی کے لیے qrcode یا ڈیزائن لچک کے لیے qr-code-styling منتخب کریں۔

JavaScript سے QR کوڈ بنانا شروع کریں

تیز QR کوڈز کے لیے ہمارا مفت آن لائن جنریٹر استعمال کریں، یا خودکار جنریشن کے لیے API کو اپنے JavaScript پراجیکٹ میں ضم کریں۔

QR جنریٹر کھولیںAPI دستاویزات دریافت کریں