programming javascript

Máy quét mã vạch USB JavaScript

QuaggaJS là một trình quét mã vạch hoàn toàn được viết bằng JavaScript hỗ trợ bản địa hóa và giải mã theo thời gian thực của nhiều loại mã vạch khác nhau như EAN, CODE 128, CODE 39, EAN 8, UPC-A, UPC-C, I2of5, 2of5, CODE 93 và . Thư viện cũng có khả năng sử dụng 

> npm install
> npm run build
4 để truy cập trực tiếp vào luồng camera của người dùng. Mặc dù mã dựa trên xử lý hình ảnh nặng, ngay cả những điện thoại thông minh gần đây cũng có khả năng định vị và giải mã mã vạch trong thời gian thực

Hãy thử một số ví dụ và xem bài đăng trên blog [Cách bản địa hóa mã vạch hoạt động trong QuaggaJS] nếu bạn muốn tìm hiểu sâu hơn về chủ đề này

Một thư viện mã vạch khác?

Đây không phải là một cổng khác của thư viện zxing tuyệt vời, mà là một phần mở rộng của nó. Việc triển khai này có bộ định vị mã vạch có khả năng tìm mẫu giống như mã vạch trong hình ảnh dẫn đến hộp giới hạn ước tính bao gồm cả vòng xoay. Nói một cách đơn giản, trình đọc này không thay đổi tỷ lệ và xoay, trong khi các thư viện khác yêu cầu mã vạch được căn chỉnh với khung nhìn

Quagga sử dụng nhiều API Web hiện đại chưa được triển khai bởi tất cả các trình duyệt. Có hai chế độ mà Quagga hoạt động. 1. phân tích hình ảnh tĩnh và 2. sử dụng máy ảnh để giải mã hình ảnh từ luồng trực tiếp. Cái sau yêu cầu sự hiện diện của MediaDevices API. Bạn có thể theo dõi tính tương thích của các API Web đã sử dụng cho từng chế độ

Hình ảnh tĩnh

Các API sau cần được triển khai trong trình duyệt của bạn

Trực tiếp

Ngoài các API được đề cập ở trên

QuaggaJS có thể được cài đặt bằng cách sử dụng npm, bower hoặc bằng cách thêm nó vào thẻ script

NPM

Và sau đó nhập nó dưới dạng phụ thuộc vào dự án của bạn

import Quagga from 'quagga'; // ES6
const Quagga = require['quagga'].default; // Common JS [important: default]

Hiện tại, chức năng đầy đủ chỉ khả dụng thông qua trình duyệt. Khi sử dụng QuaggaJS trong nút, chỉ khả dụng giải mã dựa trên tệp. Xem ví dụ cho

người cúi đầu

Bạn cũng có thể cài đặt QuaggaJS thông qua bower

Script-Tag Anno 1998

Bạn có thể chỉ cần đưa 

> npm install
> npm run build
5 vào dự án của mình và bạn đã sẵn sàng để bắt đầu. Tập lệnh hiển thị thư viện trên không gian tên chung bên dưới 
> npm install
> npm run build
6

Đối với người mới bắt đầu, hãy xem các ví dụ để biết ý tưởng bắt đầu từ đây

Bạn có thể tự xây dựng thư viện bằng cách sao chép repo và gõ

> npm install
> npm run build

Tập lệnh npm này xây dựng phiên bản không được tối ưu hóa 

> npm install
> npm run build
7 và phiên bản rút gọn 
> npm install
> npm run build
8 và đặt cả hai tệp vào thư mục 
> npm install
> npm run build
9. Ngoài ra, một bản đồ nguồn 
Quagga.init[{
    inputStream : {
      name : "Live",
      type : "LiveStream",
      target: document.querySelector['#yourElement']    // Or '#yourElement' [optional]
    },
    decoder : {
      readers : ["code_128_reader"]
    }
  }, function[err] {
      if [err] {
          console.log[err];
          return
      }
      console.log["Initialization finished. Ready to start"];
      Quagga.start[];
  }];
0 được đặt bên cạnh các tệp này. Tệp này chỉ hợp lệ đối với phiên bản không chỉnh sửa 
> npm install
> npm run build
7 vì phiên bản rút gọn đã bị thay đổi sau khi nén và không khớp với tệp bản đồ nữa

Nút

Mã trong thư mục 

> npm install
> npm run build
9 chỉ được nhắm mục tiêu đến trình duyệt và sẽ không hoạt động trong nút do phụ thuộc vào DOM. Để sử dụng trong nút, lệnh 
Quagga.init[{
    inputStream : {
      name : "Live",
      type : "LiveStream",
      target: document.querySelector['#yourElement']    // Or '#yourElement' [optional]
    },
    decoder : {
      readers : ["code_128_reader"]
    }
  }, function[err] {
      if [err] {
          console.log[err];
          return
      }
      console.log["Initialization finished. Ready to start"];
      Quagga.start[];
  }];
3 cũng tạo một tệp 
> npm install
> npm run build
7 trong thư mục 
Quagga.init[{
    inputStream : {
      name : "Live",
      type : "LiveStream",
      target: document.querySelector['#yourElement']    // Or '#yourElement' [optional]
    },
    decoder : {
      readers : ["code_128_reader"]
    }
  }, function[err] {
      if [err] {
          console.log[err];
          return
      }
      console.log["Initialization finished. Ready to start"];
      Quagga.start[];
  }];
5

Bạn có thể xem các ví dụ để biết cách sử dụng QuaggaJS. Về cơ bản, thư viện hiển thị API sau

Phương thức này khởi tạo thư viện cho một cấu hình nhất định 

Quagga.init[{
    inputStream : {
      name : "Live",
      type : "LiveStream",
      target: document.querySelector['#yourElement']    // Or '#yourElement' [optional]
    },
    decoder : {
      readers : ["code_128_reader"]
    }
  }, function[err] {
      if [err] {
          console.log[err];
          return
      }
      console.log["Initialization finished. Ready to start"];
      Quagga.start[];
  }];
6 [xem bên dưới] và gọi 
Quagga.init[{
    inputStream : {
      name : "Live",
      type : "LiveStream",
      target: document.querySelector['#yourElement']    // Or '#yourElement' [optional]
    },
    decoder : {
      readers : ["code_128_reader"]
    }
  }, function[err] {
      if [err] {
          console.log[err];
          return
      }
      console.log["Initialization finished. Ready to start"];
      Quagga.start[];
  }];
7 khi Quagga kết thúc giai đoạn khởi động. Quá trình khởi tạo cũng yêu cầu quyền truy cập máy ảnh nếu phát hiện thời gian thực được định cấu hình. Trong trường hợp xảy ra lỗi, tham số 
Quagga.init[{
    inputStream : {
      name : "Live",
      type : "LiveStream",
      target: document.querySelector['#yourElement']    // Or '#yourElement' [optional]
    },
    decoder : {
      readers : ["code_128_reader"]
    }
  }, function[err] {
      if [err] {
          console.log[err];
          return
      }
      console.log["Initialization finished. Ready to start"];
      Quagga.start[];
  }];
8 được đặt và chứa thông tin về nguyên nhân. Nguyên nhân tiềm ẩn có thể là do 
Quagga.init[{
    inputStream : {
      name : "Live",
      type : "LiveStream",
      target: document.querySelector['#yourElement']    // Or '#yourElement' [optional]
    },
    decoder : {
      readers : ["code_128_reader"]
    }
  }, function[err] {
      if [err] {
          console.log[err];
          return
      }
      console.log["Initialization finished. Ready to start"];
      Quagga.start[];
  }];
9 được đặt thành 
{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
0, nhưng trình duyệt không hỗ trợ API này hoặc đơn giản là nếu người dùng từ chối quyền sử dụng máy ảnh

Nếu bạn không chỉ định mục tiêu, QuaggaJS sẽ tìm một phần tử khớp với bộ chọn CSS 

{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
1 [để tương thích ngược]. 
{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
2 có thể là một chuỗi [bộ chọn CSS khớp với một trong các nút DOM của bạn] hoặc một nút DOM

________số 8_______

lang băm. bắt đầu[]

Khi thư viện được khởi tạo, phương thức 

{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
3 bắt đầu luồng video và bắt đầu định vị và giải mã hình ảnh

lang băm. dừng lại[]

Nếu bộ giải mã hiện đang chạy, sau khi gọi 

{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
4 bộ giải mã không xử lý thêm hình ảnh nào nữa. Ngoài ra, nếu một luồng camera được yêu cầu khi khởi tạo, thao tác này cũng sẽ ngắt kết nối camera

lang băm. onProcessed [gọi lại]

Phương pháp này đăng ký một hàm 

{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
5 được gọi cho mỗi khung sau khi xử lý xong. Đối tượng 
{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
6 chứa thông tin chi tiết về sự thành công/thất bại của hoạt động. Đầu ra khác nhau, tùy thuộc vào việc phát hiện và/hoặc giải mã có thành công hay không

lang băm. onDetected [gọi lại]

Đăng ký chức năng 

{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
5 được kích hoạt bất cứ khi nào mẫu mã vạch được định vị và giải mã thành công. Đối tượng 
{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
6 được thông qua chứa thông tin về quá trình giải mã bao gồm mã được phát hiện có thể lấy được bằng cách gọi 
{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
9

lang băm. giải mãSingle[cấu hình, gọi lại]

Ngược lại với các cuộc gọi được mô tả ở trên, phương pháp này không dựa vào 

> npm install
> npm run build
4 và thay vào đó hoạt động trên một hình ảnh duy nhất. Cuộc gọi lại được cung cấp giống như trong 
{
  numOfWorkers: 4,
  locate: true,
  inputStream: {...},
  frequency: 10,
  decoder:{...},
  locator: {...},
  debug: false,
}
1 và chứa kết quả đối tượng 
{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
6

lang băm. offProcessed[xử lý]

Trong trường hợp sự kiện 

{
  numOfWorkers: 4,
  locate: true,
  inputStream: {...},
  frequency: 10,
  decoder:{...},
  locator: {...},
  debug: false,
}
3 không còn phù hợp, thì 
{
  numOfWorkers: 4,
  locate: true,
  inputStream: {...},
  frequency: 10,
  decoder:{...},
  locator: {...},
  debug: false,
}
4 sẽ loại bỏ sự kiện 
{
  numOfWorkers: 4,
  locate: true,
  inputStream: {...},
  frequency: 10,
  decoder:{...},
  locator: {...},
  debug: false,
}
5 đã cho khỏi hàng đợi sự kiện

lang băm. offDetected[xử lý]

Trong trường hợp sự kiện 

{
  numOfWorkers: 4,
  locate: true,
  inputStream: {...},
  frequency: 10,
  decoder:{...},
  locator: {...},
  debug: false,
}
1 không còn phù hợp, thì 
{
  numOfWorkers: 4,
  locate: true,
  inputStream: {...},
  frequency: 10,
  decoder:{...},
  locator: {...},
  debug: false,
}
7 sẽ xóa sự kiện 
{
  numOfWorkers: 4,
  locate: true,
  inputStream: {...},
  frequency: 10,
  decoder:{...},
  locator: {...},
  debug: false,
}
5 đã cho khỏi hàng đợi sự kiện

Các cuộc gọi lại được chuyển vào 

{
  numOfWorkers: 4,
  locate: true,
  inputStream: {...},
  frequency: 10,
  decoder:{...},
  locator: {...},
  debug: false,
}
3, 
{
  numOfWorkers: 4,
  locate: true,
  inputStream: {...},
  frequency: 10,
  decoder:{...},
  locator: {...},
  debug: false,
}
1 và 
{
  name: "Live",
  type: "LiveStream",
  constraints: {
    width: 640,
    height: 480,
    facingMode: "environment",
    deviceId: "7832475934759384534"
  },
  area: { // defines rectangle of the detection/localization area
    top: "0%",    // top offset
    right: "0%",  // right offset
    left: "0%",   // left offset
    bottom: "0%"  // bottom offset
  },
  singleChannel: false // true: only the red color-channel is read
}
1 nhận một đối tượng 
{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
6 khi thực hiện. Đối tượng 
{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
6 chứa thông tin sau. Tùy thuộc vào sự thành công, một số trường có thể là 
{
  name: "Live",
  type: "LiveStream",
  constraints: {
    width: 640,
    height: 480,
    facingMode: "environment",
    deviceId: "7832475934759384534"
  },
  area: { // defines rectangle of the detection/localization area
    top: "0%",    // top offset
    right: "0%",  // right offset
    left: "0%",   // left offset
    bottom: "0%"  // bottom offset
  },
  singleChannel: false // true: only the red color-channel is read
}
4 hoặc chỉ để trống

{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}

Cấu hình đi kèm với QuaggaJS bao gồm các trường hợp sử dụng mặc định và có thể được tinh chỉnh cho các yêu cầu cụ thể

Cấu hình được quản lý bởi đối tượng 

Quagga.init[{
    inputStream : {
      name : "Live",
      type : "LiveStream",
      target: document.querySelector['#yourElement']    // Or '#yourElement' [optional]
    },
    decoder : {
      readers : ["code_128_reader"]
    }
  }, function[err] {
      if [err] {
          console.log[err];
          return
      }
      console.log["Initialization finished. Ready to start"];
      Quagga.start[];
  }];
6 xác định các thuộc tính cấp cao sau

{
  numOfWorkers: 4,
  locate: true,
  inputStream: {...},
  frequency: 10,
  decoder:{...},
  locator: {...},
  debug: false,
}

numOfWorkers

QuaggaJS hỗ trợ web worker ngay lập tức và chạy với 

{
  name: "Live",
  type: "LiveStream",
  constraints: {
    width: 640,
    height: 480,
    facingMode: "environment",
    deviceId: "7832475934759384534"
  },
  area: { // defines rectangle of the detection/localization area
    top: "0%",    // top offset
    right: "0%",  // right offset
    left: "0%",   // left offset
    bottom: "0%"  // bottom offset
  },
  singleChannel: false // true: only the red color-channel is read
}
6 worker trong cấu hình mặc định của nó. Số phải phù hợp với số lượng lõi có sẵn trong các thiết bị được nhắm mục tiêu của bạn

Trong trường hợp bạn không biết trước số lượng hoặc nếu số lượng thiết bị quá lớn, bạn có thể sử dụng 

{
  name: "Live",
  type: "LiveStream",
  constraints: {
    width: 640,
    height: 480,
    facingMode: "environment",
    deviceId: "7832475934759384534"
  },
  area: { // defines rectangle of the detection/localization area
    top: "0%",    // top offset
    right: "0%",  // right offset
    left: "0%",   // left offset
    bottom: "0%"  // bottom offset
  },
  singleChannel: false // true: only the red color-channel is read
}
7 [xem tại đây] nếu có hoặc sử dụng công cụ ước tính lõi

Một trong những tính năng chính của QuaggaJS là khả năng định vị mã vạch trong một hình ảnh nhất định. Thuộc tính 

{
  name: "Live",
  type: "LiveStream",
  constraints: {
    width: 640,
    height: 480,
    facingMode: "environment",
    deviceId: "7832475934759384534"
  },
  area: { // defines rectangle of the detection/localization area
    top: "0%",    // top offset
    right: "0%",  // right offset
    left: "0%",   // left offset
    bottom: "0%"  // bottom offset
  },
  singleChannel: false // true: only the red color-channel is read
}
8 kiểm soát xem tính năng này được bật [mặc định] hay tắt

Tại sao ai đó sẽ tắt tính năng này? . Một lý do khác là thiếu lấy nét tự động tạo ra hình ảnh mờ khiến tính năng bản địa hóa rất không ổn định

Tuy nhiên, ngay cả khi không có trường hợp nào ở trên áp dụng, vẫn có một trường hợp nữa có thể hữu ích khi vô hiệu hóa 

{
  name: "Live",
  type: "LiveStream",
  constraints: {
    width: 640,
    height: 480,
    facingMode: "environment",
    deviceId: "7832475934759384534"
  },
  area: { // defines rectangle of the detection/localization area
    top: "0%",    // top offset
    right: "0%",  // right offset
    left: "0%",   // left offset
    bottom: "0%"  // bottom offset
  },
  singleChannel: false // true: only the red color-channel is read
}
8. Nếu đã biết hướng và/hoặc vị trí gần đúng của mã vạch hoặc nếu bạn muốn hướng dẫn người dùng qua đường viền hình chữ nhật. Điều này có thể tăng hiệu suất và độ bền cùng một lúc

đầu vàoStream

Thuộc tính 

{
  readers: [
    'code_128_reader'
  ],
  debug: {
      drawBoundingBox: false,
      showFrequency: false,
      drawScanline: false,
      showPattern: false
  }
  multiple: false
}
0 xác định nguồn hình ảnh/video trong QuaggaJS

{
  name: "Live",
  type: "LiveStream",
  constraints: {
    width: 640,
    height: 480,
    facingMode: "environment",
    deviceId: "7832475934759384534"
  },
  area: { // defines rectangle of the detection/localization area
    top: "0%",    // top offset
    right: "0%",  // right offset
    left: "0%",   // left offset
    bottom: "0%"  // bottom offset
  },
  singleChannel: false // true: only the red color-channel is read
}

Đầu tiên, thuộc tính 

{
  readers: [
    'code_128_reader'
  ],
  debug: {
      drawBoundingBox: false,
      showFrequency: false,
      drawScanline: false,
      showPattern: false
  }
  multiple: false
}
1 có thể được đặt thành ba giá trị khác nhau. 
{
  readers: [
    'code_128_reader'
  ],
  debug: {
      drawBoundingBox: false,
      showFrequency: false,
      drawScanline: false,
      showPattern: false
  }
  multiple: false
}
2, 
{
  readers: [
    'code_128_reader'
  ],
  debug: {
      drawBoundingBox: false,
      showFrequency: false,
      drawScanline: false,
      showPattern: false
  }
  multiple: false
}
3 hoặc 
{
  "codeResult": {
    "code": "FANAVF1461710",  // the decoded code as a string
    "format": "code_128", // or code_39, codabar, ean_13, ean_8, upc_a, upc_e
    "start": 355,
    "end": 26,
    "codeset": 100,
    "startInfo": {
      "error": 1.0000000000000002,
      "code": 104,
      "start": 21,
      "end": 41
    },
    "decodedCodes": [{
      "code": 104,
      "start": 21,
      "end": 41
    },
    // stripped for brevity
    {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    }],
    "endInfo": {
      "error": 0.8888888888888893,
      "code": 106,
      "start": 328,
      "end": 350
    },
    "direction": -1
  },
  "line": [{
    "x": 25.97278706156836,
    "y": 360.5616435369468
  }, {
    "x": 401.9220519377024,
    "y": 70.87524989906444
  }],
  "angle": -0.6565217179979483,
  "pattern": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, /* .. */ 1],
  "box": [
    [77.4074243622672, 410.9288668804402],
    [0.050203235235130705, 310.53619724086366],
    [360.15706727788256, 33.05711026051813],
    [437.5142884049146, 133.44977990009465]
  ],
  "boxes": [
    [
      [77.4074243622672, 410.9288668804402],
      [0.050203235235130705, 310.53619724086366],
      [360.15706727788256, 33.05711026051813],
      [437.5142884049146, 133.44977990009465]
    ],
    [
      [248.90769330706507, 415.2041489551161],
      [198.9532321622869, 352.62160512937635],
      [339.546160777576, 240.3979259789976],
      [389.5006219223542, 302.98046980473737]
    ]
  ]
}
0 [mặc định] và nên được chọn tùy thuộc vào trường hợp sử dụng. Rất có thể, giá trị mặc định là đủ

Thứ hai, phím 

{
  readers: [
    'code_128_reader'
  ],
  debug: {
      drawBoundingBox: false,
      showFrequency: false,
      drawScanline: false,
      showPattern: false
  }
  multiple: false
}
5 xác định kích thước vật lý của hình ảnh đầu vào và các thuộc tính bổ sung, chẳng hạn như 
{
  readers: [
    'code_128_reader'
  ],
  debug: {
      drawBoundingBox: false,
      showFrequency: false,
      drawScanline: false,
      showPattern: false
  }
  multiple: false
}
6 đặt nguồn camera của người dùng trong trường hợp có nhiều thiết bị được kết nối. Ngoài ra, nếu được yêu cầu, có thể đặt 
{
  readers: [
    'code_128_reader'
  ],
  debug: {
      drawBoundingBox: false,
      showFrequency: false,
      drawScanline: false,
      showPattern: false
  }
  multiple: false
}
7 nếu lựa chọn máy ảnh được cung cấp cho người dùng. Điều này có thể dễ dàng đạt được thông qua MediaDevices. liệt kêDevices[]

Thứ ba, giá trị 

{
  readers: [
    'code_128_reader'
  ],
  debug: {
      drawBoundingBox: false,
      showFrequency: false,
      drawScanline: false,
      showPattern: false
  }
  multiple: false
}
8 hạn chế vùng giải mã của hình ảnh. Các giá trị được cung cấp theo tỷ lệ phần trăm, tương tự như thuộc tính kiểu CSS khi sử dụng 
{
  readers: [
    'code_128_reader'
  ],
  debug: {
      drawBoundingBox: false,
      showFrequency: false,
      drawScanline: false,
      showPattern: false
  }
  multiple: false
}
9. 
{
  readers: [
    'code_128_reader'
  ],
  debug: {
      drawBoundingBox: false,
      showFrequency: false,
      drawScanline: false,
      showPattern: false
  }
  multiple: false
}
8 này cũng hữu ích trong trường hợp thuộc tính 
{
  name: "Live",
  type: "LiveStream",
  constraints: {
    width: 640,
    height: 480,
    facingMode: "environment",
    deviceId: "7832475934759384534"
  },
  area: { // defines rectangle of the detection/localization area
    top: "0%",    // top offset
    right: "0%",  // right offset
    left: "0%",   // left offset
    bottom: "0%"  // bottom offset
  },
  singleChannel: false // true: only the red color-channel is read
}
8 được đặt thành 
decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
2, xác định hình chữ nhật cho người dùng

Khóa cuối cùng 

decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
3 chỉ phù hợp trong trường hợp ai đó muốn gỡ lỗi hành vi sai lầm của bộ giải mã. Nếu được đặt thành 
decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
4, kênh màu đỏ của hình ảnh đầu vào sẽ được đọc thay vì tính toán các giá trị thang độ xám của RGB của nguồn. Điều này hữu ích khi kết hợp với 
decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
5 nơi lưu các biểu diễn thang độ xám của các hình ảnh được xác định sai

tần số

Thuộc tính cấp cao nhất này kiểm soát tần số quét của luồng video. Nó là tùy chọn và xác định số lần quét tối đa mỗi giây. Điều này hữu ích cho các trường hợp phiên quét kéo dài và các tài nguyên như sức mạnh CPU được quan tâm

bộ giải mã

QuaggaJS thường chạy theo cách thức hai giai đoạn [

{
  name: "Live",
  type: "LiveStream",
  constraints: {
    width: 640,
    height: 480,
    facingMode: "environment",
    deviceId: "7832475934759384534"
  },
  area: { // defines rectangle of the detection/localization area
    top: "0%",    // top offset
    right: "0%",  // right offset
    left: "0%",   // left offset
    bottom: "0%"  // bottom offset
  },
  singleChannel: false // true: only the red color-channel is read
}
8 được đặt thành 
decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
4] trong đó, sau khi xác định được mã vạch, quá trình giải mã sẽ bắt đầu. Giải mã là quá trình chuyển đổi các thanh thành ý nghĩa thực sự của nó. Hầu hết các tùy chọn cấu hình trong 
decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
8 chỉ dành cho mục đích gỡ lỗi/trực quan hóa

{
  readers: [
    'code_128_reader'
  ],
  debug: {
      drawBoundingBox: false,
      showFrequency: false,
      drawScanline: false,
      showPattern: false
  }
  multiple: false
}

Thuộc tính quan trọng nhất là 

decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
9 có một loạt các loại mã vạch sẽ được giải mã trong phiên. giá trị có thể là

  • code_128_reader [mặc định]
  • ean_reader
  • ean_8_reader
  • code_39_reader
  • mã_39_vin_reader
  • codabar_reader
  • upc_reader
  • upc_e_reader
  • i2of5_reader
  • 2of5_reader
  • code_93_reader

Tại sao không phải tất cả các loại được kích hoạt theo mặc định? . Nhiều bộ giải mã hơn có nghĩa là nhiều xung đột có thể xảy ra hơn hoặc dương tính giả. Người ta nên quan tâm đến thứ tự mà người đọc được cung cấp, vì một số có thể trả về giá trị mặc dù nó không phải là loại chính xác [EAN-13 so với. UPC-A]

Thuộc tính 

{
  halfSample: true,
  patchSize: "medium", // x-small, small, medium, large, x-large
  debug: {
    showCanvas: false,
    showPatches: false,
    showFoundPatches: false,
    showSkeleton: false,
    showLabels: false,
    showPatchLabels: false,
    showRemainingPatchLabels: false,
    boxFromPatches: {
      showTransformed: false,
      showTransformedBox: false,
      showBB: false
    }
  }
}
0 cho bộ giải mã biết liệu nó có nên tiếp tục giải mã sau khi tìm thấy mã vạch hợp lệ hay không. Nếu bội số được đặt thành 
decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
4, kết quả sẽ được trả về dưới dạng một mảng các đối tượng kết quả. Mỗi đối tượng trong mảng sẽ có một 
{
  halfSample: true,
  patchSize: "medium", // x-small, small, medium, large, x-large
  debug: {
    showCanvas: false,
    showPatches: false,
    showFoundPatches: false,
    showSkeleton: false,
    showLabels: false,
    showPatchLabels: false,
    showRemainingPatchLabels: false,
    boxFromPatches: {
      showTransformed: false,
      showTransformedBox: false,
      showBB: false
    }
  }
}
2 và có thể có một 
{
  halfSample: true,
  patchSize: "medium", // x-small, small, medium, large, x-large
  debug: {
    showCanvas: false,
    showPatches: false,
    showFoundPatches: false,
    showSkeleton: false,
    showLabels: false,
    showPatchLabels: false,
    showRemainingPatchLabels: false,
    boxFromPatches: {
      showTransformed: false,
      showTransformedBox: false,
      showBB: false
    }
  }
}
3 tùy thuộc vào sự thành công của việc giải mã hộp riêng lẻ

Các thuộc tính còn lại 

{
  halfSample: true,
  patchSize: "medium", // x-small, small, medium, large, x-large
  debug: {
    showCanvas: false,
    showPatches: false,
    showFoundPatches: false,
    showSkeleton: false,
    showLabels: false,
    showPatchLabels: false,
    showRemainingPatchLabels: false,
    boxFromPatches: {
      showTransformed: false,
      showTransformedBox: false,
      showBB: false
    }
  }
}
4, 
{
  halfSample: true,
  patchSize: "medium", // x-small, small, medium, large, x-large
  debug: {
    showCanvas: false,
    showPatches: false,
    showFoundPatches: false,
    showSkeleton: false,
    showLabels: false,
    showPatchLabels: false,
    showRemainingPatchLabels: false,
    boxFromPatches: {
      showTransformed: false,
      showTransformedBox: false,
      showBB: false
    }
  }
}
5, 
{
  halfSample: true,
  patchSize: "medium", // x-small, small, medium, large, x-large
  debug: {
    showCanvas: false,
    showPatches: false,
    showFoundPatches: false,
    showSkeleton: false,
    showLabels: false,
    showPatchLabels: false,
    showRemainingPatchLabels: false,
    boxFromPatches: {
      showTransformed: false,
      showTransformedBox: false,
      showBB: false
    }
  }
}
6 và 
{
  halfSample: true,
  patchSize: "medium", // x-small, small, medium, large, x-large
  debug: {
    showCanvas: false,
    showPatches: false,
    showFoundPatches: false,
    showSkeleton: false,
    showLabels: false,
    showPatchLabels: false,
    showRemainingPatchLabels: false,
    boxFromPatches: {
      showTransformed: false,
      showTransformedBox: false,
      showBB: false
    }
  }
}
7 chủ yếu được quan tâm trong quá trình gỡ lỗi và trực quan hóa

Kích hoạt EAN mở rộng

Cài đặt mặc định cho 

{
  halfSample: true,
  patchSize: "medium", // x-small, small, medium, large, x-large
  debug: {
    showCanvas: false,
    showPatches: false,
    showFoundPatches: false,
    showSkeleton: false,
    showLabels: false,
    showPatchLabels: false,
    showRemainingPatchLabels: false,
    boxFromPatches: {
      showTransformed: false,
      showTransformedBox: false,
      showBB: false
    }
  }
}
8 không có khả năng đọc các phần mở rộng như EAN-2 hoặc EAN-5. Để kích hoạt các chất bổ sung đó, bạn phải cung cấp chúng trong cấu hình như sau

decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}

Lưu ý rằng thứ tự của 

{
  halfSample: true,
  patchSize: "medium", // x-small, small, medium, large, x-large
  debug: {
    showCanvas: false,
    showPatches: false,
    showFoundPatches: false,
    showSkeleton: false,
    showLabels: false,
    showPatchLabels: false,
    showRemainingPatchLabels: false,
    boxFromPatches: {
      showTransformed: false,
      showTransformedBox: false,
      showBB: false
    }
  }
}
9 quan trọng đến mức người đọc ngừng giải mã khi tìm thấy phần bổ sung đầu tiên. Vì vậy, nếu bạn quan tâm đến tiện ích mở rộng EAN-2 và EAN-5, hãy sử dụng thứ tự được mô tả ở trên

Điều quan trọng cần đề cập là, nếu cung cấp các chất bổ sung, mã EAN-13 thông thường sẽ không thể đọc được nữa với cùng một đầu đọc. Nếu bạn muốn đọc EAN-13 có và không có phần mở rộng, bạn phải thêm một đầu đọc 

{
  halfSample: true,
  patchSize: "medium", // x-small, small, medium, large, x-large
  debug: {
    showCanvas: false,
    showPatches: false,
    showFoundPatches: false,
    showSkeleton: false,
    showLabels: false,
    showPatchLabels: false,
    showRemainingPatchLabels: false,
    boxFromPatches: {
      showTransformed: false,
      showTransformedBox: false,
      showBB: false
    }
  }
}
8 khác vào cấu hình

Cấu hình 

Quagga.decodeSingle[{
    decoder: {
        readers: ["code_128_reader"] // List of active readers
    },
    locate: true, // try to locate the barcode in the image
    src: '/test/fixtures/code_128/image-001.jpg' // or 'data:image/jpg;base64,' + data
}, function[result]{
    if[result.codeResult] {
        console.log["result", result.codeResult.code];
    } else {
        console.log["not detected"];
    }
}];
1 chỉ có liên quan nếu cờ 
{
  name: "Live",
  type: "LiveStream",
  constraints: {
    width: 640,
    height: 480,
    facingMode: "environment",
    deviceId: "7832475934759384534"
  },
  area: { // defines rectangle of the detection/localization area
    top: "0%",    // top offset
    right: "0%",  // right offset
    left: "0%",   // left offset
    bottom: "0%"  // bottom offset
  },
  singleChannel: false // true: only the red color-channel is read
}
8 được đặt thành 
decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
4. Nó kiểm soát hành vi của quá trình bản địa hóa và cần được điều chỉnh cho từng trường hợp sử dụng cụ thể. Cài đặt mặc định chỉ đơn giản là sự kết hợp của các giá trị hoạt động tốt nhất trong quá trình phát triển

Chỉ có hai thuộc tính phù hợp để sử dụng trong Quagga [

Quagga.decodeSingle[{
    decoder: {
        readers: ["code_128_reader"] // List of active readers
    },
    locate: true, // try to locate the barcode in the image
    src: '/test/fixtures/code_128/image-001.jpg' // or 'data:image/jpg;base64,' + data
}, function[result]{
    if[result.codeResult] {
        console.log["result", result.codeResult.code];
    } else {
        console.log["not detected"];
    }
}];
4 và 
Quagga.decodeSingle[{
    decoder: {
        readers: ["code_128_reader"] // List of active readers
    },
    locate: true, // try to locate the barcode in the image
    src: '/test/fixtures/code_128/image-001.jpg' // or 'data:image/jpg;base64,' + data
}, function[result]{
    if[result.codeResult] {
        console.log["result", result.codeResult.code];
    } else {
        console.log["not detected"];
    }
}];
5] trong khi phần còn lại chỉ cần thiết cho việc phát triển và gỡ lỗi

{
  halfSample: true,
  patchSize: "medium", // x-small, small, medium, large, x-large
  debug: {
    showCanvas: false,
    showPatches: false,
    showFoundPatches: false,
    showSkeleton: false,
    showLabels: false,
    showPatchLabels: false,
    showRemainingPatchLabels: false,
    boxFromPatches: {
      showTransformed: false,
      showTransformedBox: false,
      showBB: false
    }
  }
}

Cờ 

Quagga.decodeSingle[{
    decoder: {
        readers: ["code_128_reader"] // List of active readers
    },
    locate: true, // try to locate the barcode in the image
    src: '/test/fixtures/code_128/image-001.jpg' // or 'data:image/jpg;base64,' + data
}, function[result]{
    if[result.codeResult] {
        console.log["result", result.codeResult.code];
    } else {
        console.log["not detected"];
    }
}];
4 cho biết quy trình định vị liệu nó có hoạt động trên hình ảnh được thu nhỏ lại [một nửa chiều rộng/chiều cao, một phần tư số pixel ] hay không. Bật 
Quagga.decodeSingle[{
    decoder: {
        readers: ["code_128_reader"] // List of active readers
    },
    locate: true, // try to locate the barcode in the image
    src: '/test/fixtures/code_128/image-001.jpg' // or 'data:image/jpg;base64,' + data
}, function[result]{
    if[result.codeResult] {
        console.log["result", result.codeResult.code];
    } else {
        console.log["not detected"];
    }
}];
4 giúp giảm đáng kể thời gian xử lý và cũng giúp tìm mẫu mã vạch do làm mịn hoàn toàn. Nên tắt tính năng này trong trường hợp mã vạch thực sự nhỏ và cần độ phân giải đầy đủ để tìm vị trí. Bạn nên bật tính năng này và sử dụng hình ảnh video có độ phân giải cao hơn nếu cần

Thuộc tính thứ hai 

Quagga.decodeSingle[{
    decoder: {
        readers: ["code_128_reader"] // List of active readers
    },
    locate: true, // try to locate the barcode in the image
    src: '/test/fixtures/code_128/image-001.jpg' // or 'data:image/jpg;base64,' + data
}, function[result]{
    if[result.codeResult] {
        console.log["result", result.codeResult.code];
    } else {
        console.log["not detected"];
    }
}];
5 xác định mật độ của lưới tìm kiếm. Thuộc tính chấp nhận các chuỗi có giá trị 
Quagga.decodeSingle[{
    decoder: {
        readers: ["code_128_reader"] // List of active readers
    },
    locate: true, // try to locate the barcode in the image
    src: '/test/fixtures/code_128/image-001.jpg' // or 'data:image/jpg;base64,' + data
}, function[result]{
    if[result.codeResult] {
        console.log["result", result.codeResult.code];
    } else {
        console.log["not detected"];
    }
}];
9, 
> npm install
> npm run build
00, 
> npm install
> npm run build
01, 
> npm install
> npm run build
02 và 
> npm install
> npm run build
03. 
Quagga.decodeSingle[{
    decoder: {
        readers: ["code_128_reader"] // List of active readers
    },
    locate: true, // try to locate the barcode in the image
    src: '/test/fixtures/code_128/image-001.jpg' // or 'data:image/jpg;base64,' + data
}, function[result]{
    if[result.codeResult] {
        console.log["result", result.codeResult.code];
    } else {
        console.log["not detected"];
    }
}];
5 tỷ lệ thuận với kích thước của mã vạch được quét. Nếu bạn có mã vạch thực sự lớn có thể đọc cận cảnh, thì nên sử dụng 
> npm install
> npm run build
02 hoặc 
> npm install
> npm run build
03. Trong trường hợp mã vạch ở xa ống kính máy ảnh hơn [thiếu lấy nét tự động hoặc mã vạch nhỏ] thì bạn nên đặt kích thước thành 
> npm install
> npm run build
00 hoặc thậm chí 
Quagga.decodeSingle[{
    decoder: {
        readers: ["code_128_reader"] // List of active readers
    },
    locate: true, // try to locate the barcode in the image
    src: '/test/fixtures/code_128/image-001.jpg' // or 'data:image/jpg;base64,' + data
}, function[result]{
    if[result.codeResult] {
        console.log["result", result.codeResult.code];
    } else {
        console.log["not detected"];
    }
}];
9. Về sau, bạn cũng nên tăng độ phân giải để tìm mã vạch

ví dụ

Ví dụ sau lấy hình ảnh 

> npm install
> npm run build
09 làm đầu vào và in kết quả trên bàn điều khiển. Bộ giải mã được định cấu hình để phát hiện mã vạch Code128 và kích hoạt cơ chế định vị để có kết quả mạnh mẽ hơn

Quagga.decodeSingle[{
    decoder: {
        readers: ["code_128_reader"] // List of active readers
    },
    locate: true, // try to locate the barcode in the image
    src: '/test/fixtures/code_128/image-001.jpg' // or 'data:image/jpg;base64,' + data
}, function[result]{
    if[result.codeResult] {
        console.log["result", result.codeResult.code];
    } else {
        console.log["not detected"];
    }
}];

Ví dụ sau minh họa việc sử dụng QuaggaJS trong môi trường nút. Nó gần giống với phiên bản trình duyệt với sự khác biệt là nút không hỗ trợ nhân viên web ngay lập tức. Do đó, thuộc tính cấu hình 

> npm install
> npm run build
10 phải được đặt rõ ràng thành 
> npm install
> npm run build
11

> npm install
> npm run build
0

Bộ sưu tập các mẹo và thủ thuật ngày càng tăng để cải thiện các khía cạnh khác nhau của Quagga

Mã vạch quá nhỏ?

Mã vạch ở quá xa máy ảnh hoặc ống kính quá gần đối tượng dẫn đến tỷ lệ nhận dạng kém và Quagga có thể phản hồi với rất nhiều kết quả dương tính giả

Bắt đầu từ Chrome 59, giờ đây bạn có thể sử dụng 

> npm install
> npm run build
12 và trực tiếp điều khiển mức thu phóng của máy ảnh. Truy cập bản trình diễn web-cam và xem tính năng Thu phóng

Bạn có thể đọc thêm về những 

> npm install
> npm run build
12 trong Hãy thắp đuốc và khám phá các khả năng của MediaStreamTrack

Video quá tối?

Môi trường tối thường dẫn đến hình ảnh nhiễu và do đó gây rối với logic nhận dạng

Kể từ Chrome 59, bạn có thể bật/tắt Đèn pin trên thiết bị của chúng tôi và cải thiện đáng kể chất lượng hình ảnh. Truy cập bản trình diễn web-cam và xem tính năng Torch

Để tìm hiểu thêm về tính năng này, hãy đọc tiếp

kiểm tra

Bài kiểm tra đơn vị có thể được chạy bằng Karma và được viết bằng Mocha, Chai và SinonJS. Báo cáo bảo hiểm được tạo tự động trong thư mục bảo hiểm/

> npm install
> npm run build
1

Gỡ lỗi hình ảnh

Trong trường hợp bạn muốn tìm hiểu sâu hơn về hoạt động bên trong của Quagga, hãy tìm hiểu khả năng sửa lỗi của triển khai hiện tại. Các cờ khác nhau được hiển thị thông qua đối tượng 

Quagga.init[{
    inputStream : {
      name : "Live",
      type : "LiveStream",
      target: document.querySelector['#yourElement']    // Or '#yourElement' [optional]
    },
    decoder : {
      readers : ["code_128_reader"]
    }
  }, function[err] {
      if [err] {
          console.log[err];
          return
      }
      console.log["Initialization finished. Ready to start"];
      Quagga.start[];
  }];
6 cung cấp cho bạn khả năng hình dung hầu hết mọi bước trong quá trình xử lý. Do sự ra đời của web-workers và hạn chế của họ là không có quyền truy cập vào DOM, cấu hình phải được đặt rõ ràng thành 
> npm install
> npm run build
15 để hoạt động

Quagga không hoàn hảo theo bất kỳ cách nào và đôi khi có thể tạo ra kết quả dương tính giả. Để tìm ra những hình ảnh nào tạo ra những kết quả dương tính giả đó, 

decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
5 tích hợp sẵn sẽ hỗ trợ bạn và tôi giúp loại bỏ các lỗi trong quá trình triển khai

Tạo một 
decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
5

Bạn có thể dễ dàng tạo một 

decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
5 mới bằng cách gọi phương thức 
> npm install
> npm run build
19 của nó với một cấu hình

> npm install
> npm run build
2

Sử dụng một 
decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
5

Sau khi tạo một 

decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
5, bạn phải gắn nó vào Quagga bằng cách gọi 
> npm install
> npm run build
22

Đọc kết quả

Sau phiên kiểm tra/ghi, giờ đây bạn có thể in các kết quả đã thu thập được không phù hợp với một lược đồ nhất định. Gọi 

> npm install
> npm run build
23 trên 
> npm install
> npm run build
24 trả về một 
> npm install
> npm run build
25 chứa các đối tượng với

> npm install
> npm run build
3

Thuộc tính 

> npm install
> npm run build
26 là một đại diện bên trong của hình ảnh và do đó chỉ có sẵn ở thang màu xám. Biểu diễn dataURL cho phép dễ dàng lưu/kết xuất hình ảnh

So sánh kết quả

Giờ đây, khi đã có sẵn các khung hình trên đĩa, bạn có thể tải từng hình ảnh đơn lẻ bằng cách gọi 

{
  name: "Live",
  type: "LiveStream",
  constraints: {
    width: 640,
    height: 480,
    facingMode: "environment",
    deviceId: "7832475934759384534"
  },
  area: { // defines rectangle of the detection/localization area
    top: "0%",    // top offset
    right: "0%",  // right offset
    left: "0%",   // left offset
    bottom: "0%"  // bottom offset
  },
  singleChannel: false // true: only the red color-channel is read
}
1 với cấu hình giống như được sử dụng trong quá trình ghi. Để tái tạo kết quả chính xác như vậy, bạn phải đảm bảo bật cờ 
decoder: {
    readers: [{
        format: "ean_reader",
        config: {
            supplements: [
                'ean_5_reader', 'ean_2_reader'
            ]
        }
    }]
}
3 trong cấu hình khi sử dụng 
{
  name: "Live",
  type: "LiveStream",
  constraints: {
    width: 640,
    height: 480,
    facingMode: "environment",
    deviceId: "7832475934759384534"
  },
  area: { // defines rectangle of the detection/localization area
    top: "0%",    // top offset
    right: "0%",  // right offset
    left: "0%",   // left offset
    bottom: "0%"  // bottom offset
  },
  singleChannel: false // true: only the red color-channel is read
}
1

2017-06-07

  • Cải tiến
    • đã thêm 
      > npm install
> npm run build
      30 và 
      > npm install
> npm run build
      31 vào 
      > npm install
> npm run build
      32 để làm cho nó hoạt động cho Safari 11 Beta [thậm chí cả iOS]
  • Sửa lỗi

2017-06-06

  • Đặc trưng
    • Hỗ trợ mã vạch 2of5 tiêu chuẩn [Xem #194]
    • Hỗ trợ mã vạch Code 93 [Xem #194]
    • Hiển thị 
      > npm install
> npm run build
      33 để có quyền truy cập vào 
      > npm install
> npm run build
      34 hiện đang được sử dụng

Hãy xem ghi chú phát hành [[0. 7. 0] [https. //github. com/serratus/quaggaJS/phát hành/tag/v0. 7. 0]]

Bài Viết Liên Quan

Tên gốc của JavaScript LiveScript Escript Mocha JavaScript là gì?
Size 160 tương đường size bao nhiêu
Phân phối ngẫu nhiên trong Python
Bàn làm việc mysql là máy khách hay máy chủ?
Itertools có trong thư viện chuẩn Python không?
Thứ tự ưu tiên trong Python từ cao nhất đến thấp nhất là gì?
Python phát hiện ngoại lệ đa biến
THÍCH MySQL
Giải vô địch bóng đá nữ thế giới 2023 sẽ diễn ra ở đâu?
Tạo người dùng root MongoDB
0 75m bằng bao nhiêu dm
Thuật toán sắp xếp trong Python
Có thể sử dụng JavaScript để phỏng vấn viết mã không?
Làm cách nào để lấy dữ liệu hàng đã chọn trong bảng HTML?
Cách chạy javascript trong notepad++
Đồng bộ hóa QuickBooks Excel
Hành trình Bermuda tháng 8 năm 2023
Làm cách nào để đặt các dấu ngoặc đơn xung quanh một biến trong python?
Sự khác biệt == và === trong php là gì?
1 lạng đường bao nhiêu calo?

Toplist mới

#1
Top 7 sự tích hồ gươm - ngữ văn lớp 6 2023
6 tháng trước
#2
Top 7 gdcd 6 bài 1 kết nối tri thức 2023
6 tháng trước
#3
Top 7 ý nghĩa của xây dựng gia đình văn hóa 2023
6 tháng trước
#4
Top 6 mẫu hợp đồng mượn đất làm nhà xưởng 2023
6 tháng trước
#5
Top 3 tổng tài biến thái tôi yêu anh tập 27 2023
6 tháng trước
#6
Top 6 kết thực phim mỹ nhân vô lệ 2023
6 tháng trước
#7
Top 9 trong những câu thơ sau câu nào sử dụng thành ngữ 2023
6 tháng trước
#8
Top 8 đề tài và chủ de của tác phẩm tắt đèn 2023
6 tháng trước
#9
Top 5 tiểu sử của thầy thích pháp hòa 2023
6 tháng trước

Bài mới nhất

Hạt giống nguyên chủng là gì năm 2024
De thi học kì 1 hóa 9 tphcm năm 2024
Phục hồi nút erase trong cs6 bị lỗi năm 2024
Nhung loai rau cu tot cho gan và tiên hóa năm 2024
Dì ruột bán cháu ở thường xuân thanh hóa năm 2024
Kiến bu quần lót là hiện tượng gì năm 2024

Chủ Đề

programming Hỏi Đáp Toplist Là gì Bài Tập Địa Điểm Hay Mẹo Hay Học Tốt Nghĩa của từ Công Nghệ Khỏe Đẹp bao nhiêu Top List Tiếng anh Bao nhiêu Sản phẩm tốt Xây Đựng Ngôn ngữ javascript Ở đâu Đại học Hướng dẫn Bài tập Tại sao Dịch So Sánh Máy tính Món Ngon mẹo hay Bao lâu Thế nào So sánh Khoa Học Vì sao Lớp 9 Lớp 10