Prevent duplicated scans in a single QR code scan in DJango

The current camera scans the QR code and posts the same value to multiple times till the QR code is moved away from the camera. This causes my database to have many repeated values shown in the image below. How do I prevent this from happening?

In situations where I scan another QR code without relaunching the camera, the program should be able to detect that it is a new QR code and POST the results into the


{% load static %}

{% block mainbody %}

<title>Django Online Barcode Reader</title>
<meta charset="utf-8">
{% csrf_token %}

<script src={% static "js/html5-qrcode.min.js" %}></script>
    background-color: green;


<!--<form action="" method="POST">-->

{% csrf_token %}
<div class="row">
  <div class="col">
    <div style="width:500px;" id="reader"></div>
  <div class="col" style="padding:30px;">
    <h4>Scanned Result</h4>
    <!--<div id="result" name="result">Result Here</div>-->
    <output type="POST" id="result" name="result" placeholder="qrCodeMessage">
      {% csrf_token %}

<script type="text/javascript">

  // 1) Create a function to get the CSRF token
  function getCookie(name) {
    let cookie = document.cookie.match("(^|;) ?" + name + "=([^;]*)(;|$)");
    return cookie ? cookie[2] : null;

  // 2) After generating the qrcode in the onScanSuccess callback, you invoke sendQrCode function with the qr code as argument
  function onScanSuccess(qrCodeMessage) {
    document.getElementById("result").innerHTML = '<span class="result">' + qrCodeMessage + "</span>";
    // Call the function here

  //3) Fetch to send a POST request to nurse_qrscan route:
  async function sendQrCode(qrCode) {
    const response = await fetch("/nurse_qrscan", {
      method: "POST",
      headers: {
        "X-CSRFToken": getCookie("csrftoken"),
      body: JSON.stringify({
        result: qrCode,
      .then((response) => response.json())
      .then((data) => {

  function onScanError(errorMessage) {
    //handle scan error

  var html5QrcodeScanner = new Html5QrcodeScanner("reader", {
    fps: 10,
    qrbox: 250,
  html5QrcodeScanner.render(onScanSuccess, onScanError);


{% endblock %}


# Nurse scans QR
def nurse_qrscan(request):
  if request.method == 'POST':
    # parse the JSON data
    data = json.load(request)
    result = data.get("result")
    if result != None:
      c = connection.cursor()
      # Saving the result to database, nurse_QR
      c.execute("INSERT INTO nurse_QR (output) VALUES ('{0}');".format(result))
      return Action.success()

<Image: Output shown in database - Values of the single QR code is repeated multiple times from the POSTS>

enter image description here

Back to Top