barcode-reader-javascript-samples/read-an-image.html at 1e91468a735573cb1be346f74e67920ac16a4a0a · Dynamsoft/barcode-reader-javascript-samples · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width,initial-scale=1.0" />
  <meta name="description" content="Read barcodes from an image with Dynamsoft Barcode Reader." />
  <meta name="keywords" content="barcode, image" />
  <link rel="canonical" href="https://demo.dynamsoft.com/Samples/DBR/JS/read-an-image.html" />
  <title>Dynamsoft Barcode Reader Sample - Hello World (Read an Image)</title>
</head>

<body>
  <h1>Hello World (Read an Image)</h1>
  <input id="input-file" type="file" multiple accept=".jpg,.jpeg,.icon,.gif,.svg,.webp,.png,.bmp" /><br />
  Results:<br />
  <div id="results"></div>
  <script src="https://cdn.jsdelivr.net/npm/dynamsoft-barcode-reader-bundle@11.2.4000/dist/dbr.bundle.js"></script>
  <!-- If the network is unstable or you prefer to self-host the SDK, uncomment the line below to load it locally -->
  <!-- <script src="../dist/dbr.bundle.js"></script> -->

  <script>
    /** LICENSE ALERT - README
     * To use the library, you need to first specify a license key using the API "initLicense()" as shown below.
     */

    Dynamsoft.License.LicenseManager.initLicense("DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9");

    /**
     * You can visit https://www.dynamsoft.com/customer/license/trialLicense?utm_source=samples&product=dbr&package=js to get your own trial license good for 30 days.
     * Note that if you downloaded this sample from Dynamsoft while logged in, the above license key may already be your own 30-day trial license.
     * For more information, see https://www.dynamsoft.com/barcode-reader/docs/web/programming/javascript/user-guide/index.html?ver=11.2.4000&cVer=true#specify-the-license&utm_source=samples or contact support@dynamsoft.com.
     * LICENSE ALERT - THE END
     */

    // Optional. Preload "BarcodeReader" module for reading barcodes. It will save time on the initial decoding by skipping the module loading.
    Dynamsoft.Core.CoreModule.loadWasm();
    const resultsContainer = document.querySelector("#results");

    let cvRouter; // an instance of CaptureVisionRouter
    let pCvRouter; // promise of CaptureVisionRouter

    document.querySelector("#input-file").addEventListener("change", async function () {
      let files = [...this.files];
      this.value = "";
      resultsContainer.innerText = "";
      try {
        cvRouter = cvRouter || (await (pCvRouter = pCvRouter || Dynamsoft.CVR.CaptureVisionRouter.createInstance()));

        for (let file of files) {
          // Decode selected image with 'ReadBarcodes_SpeedFirst' template.
          const result = await cvRouter.capture(file, "ReadBarcodes_ReadRateFirst");
          const barcodeResultItems = result.decodedBarcodesResult?.barcodeResultItems;

          if (files.length > 1) {
            resultsContainer.innerText += `\n${file.name}:\n`;
          }
          if (!barcodeResultItems?.length){
            resultsContainer.innerText += "No barcode found\n";
            continue;
          }

          for (let item of barcodeResultItems) {
            resultsContainer.innerText += item.text + "\n";
            console.log(item.text);
          }
        }
      } catch (ex) {
        let errMsg = ex.message || ex;
        console.error(ex);
        alert(errMsg);
      }
    });
  </script>
</body>

</html>