html5-qrcode ile yapılabiliyormuş. çalışan örneği ;
index.html;
<!DOCTYPE html>
<html>
<head>
<title>QR Code Scanner</title>
<script src="https://unpkg.com/html5-qrcode@2.3.8/html5-qrcode.min.js"></script>
</head>
<body>
<h1>QR Code Scanner</h1>
<div id="reader" style="width:500px; height:500px;"></div>
<form id="qrForm" method="POST" action="process.php">
<input type="hidden" id="qrCodeResult" name="qrCodeResult" value="">
</form>
<script>
function onScanSuccess(decodedText, decodedResult) {
console.log(`QR Code detected: ${decodedText}`);
document.getElementById('qrCodeResult').value = decodedText;
document.getElementById('qrForm').submit();
}
function onScanFailure(error) {
console.warn(`QR error: ${error}`);
}
window.addEventListener('load', function() {
let html5QrCode = new Html5Qrcode("reader");
html5QrCode.start(
{ facingMode: "environment" },
{
fps: 10,
qrbox: { width: 250, height: 250 }
},
onScanSuccess,
onScanFailure
).catch(err => {
console.error(`Unable to start scanning, error: ${err}`);
});
});
</script>
</body>
</html>process.php ;
<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST' && !empty($_POST['qrCodeResult'])) {
$qrCodeResult = htmlspecialchars($_POST['qrCodeResult']);
echo "Taranan QR Yanıtı: " . $qrCodeResult;
} else {
echo "QR kodu tarama hatalı.";
}
?>