Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/weblineindia/vue-qrcode-scanner

A Vue.js based QR Code scanner component, allowing you to detect and decode QR codes without leaving the browser.
https://github.com/weblineindia/vue-qrcode-scanner

qrcode qrcode-scanner vue vue-component vue-component-library vue-components vue-plugin vue-plugins vue-qr-reader vue-qrcode vue-webrtc vuecomponent vuecomponents vuejs vuejs-components vuejs-library vuejs-plugin vuejs-qrcode-generator vuejs-qrcode-scanner vuejs-snippets

Last synced: 2 months ago
JSON representation

A Vue.js based QR Code scanner component, allowing you to detect and decode QR codes without leaving the browser.

Host: GitHub
URL: https://github.com/weblineindia/vue-qrcode-scanner
Owner: weblineindia
License: mit
Created: 2020-06-26T12:29:12.000Z (over 4 years ago)
Default Branch: master
Last Pushed: 2023-12-27T07:59:02.000Z (about 1 year ago)
Last Synced: 2023-12-27T08:40:35.821Z (about 1 year ago)
Topics: qrcode, qrcode-scanner, vue, vue-component, vue-component-library, vue-components, vue-plugin, vue-plugins, vue-qr-reader, vue-qrcode, vue-webrtc, vuecomponent, vuecomponents, vuejs, vuejs-components, vuejs-library, vuejs-plugin, vuejs-qrcode-generator, vuejs-qrcode-scanner, vuejs-snippets
Language: Vue
Homepage: https://www.weblineindia.com/communities.html
Size: 104 KB
Stars: 11
Watchers: 3
Forks: 5
Open Issues: 0
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE

Awesome Lists containing this project

README

        # Vue QR Scanner Component

A Vue.js based QR Code scanner component, allowing you to detect and decode QR codes without leaving the browser.

## Table of contents

- [Browser Support](#browser-support)

- [Getting started](#getting-started)

- [Usage](#usage)

- [Want to Contribute?](#want-to-contribute)

- [Need Help / Support?](#need-help)

- [Collection of Components](#collection-of-components)

- [Changelog](#changelog)

- [Credits](#credits)

- [License](#license)

- [Keywords](#Keywords)

## Browser Support

#### `QrcodeStream`

This component fundamentally depends on the [Stream API](https://caniuse.com/#feat=stream).

![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png) | ![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png) | ![Safari](https://raw.github.com/alrra/browser-logos/master/src/safari/safari_48x48.png) | ![Edge](https://raw.github.com/alrra/browser-logos/master/src/edge/edge_48x48.png) | ![IE](https://raw.github.com/alrra/browser-logos/master/src/archive/internet-explorer_9-11/internet-explorer_9-11_48x48.png) |

--- | --- | --- | --- | --- |

83.0 ✔ | 77.0  ✔ | 13.1.1 ✔ | 83.0 ✔ | Not verified |

1. Chrome requires [HTTPS or localhost](https://sites.google.com/a/chromium.org/dev/Home/chromium-security/deprecating-powerful-features-on-insecure-origins) (see _Troubleshooting_ for help)

2. Safari also requires HTTPS **even** on localhost. It also won't work in:

   - _Chrome for iOS_, _Firefox for iOS_,

   - WkWebView component of native iOS apps

   - web apps added to home screen (PWA mode) **prior to iOS 13.4**

#### `QrcodeDropZone` and `QrcodeCapture`

The newest API these components depend on is the [FileReader API](https://caniuse.com/#feat=filereader).

![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png) | ![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png) | ![Safari](https://raw.github.com/alrra/browser-logos/master/src/safari/safari_48x48.png) | ![Edge](https://raw.github.com/alrra/browser-logos/master/src/edge/edge_48x48.png) | ![IE](https://raw.github.com/alrra/browser-logos/master/src/archive/internet-explorer_9-11/internet-explorer_9-11_48x48.png) |

--- | --- | --- | --- | --- |

83.0 ✔ | 77.0  ✔ | 13.1.1 ✔ | 83.0 ✔ | 10+ |

## Getting started

Install the npm package:

``` bash

npm install vue-weblineindia-qrcode-scanner

#OR

yarn add vue-weblineindia-qrcode-scanner

```

## Usage

Use the `` component:

Either import the components independantly for local registration:

```javascript

import { QrcodeStream, QrcodeDropZone, QrcodeCapture } from 'vue-weblineindia-qr-scanner'

const MyComponent = {

  components: {

    QrcodeStream,

    QrcodeDropZone,

    QrcodeCapture

  },

  // ...

))

```

Or register all of them globally:

```javascript

import Vue from "vue";

import VueQrcodeReader from "vue-weblineindia-qr-scanner";

Vue.use(VueQrcodeReader);

```

## Import Css

- ``

- ``

## Want to Contribute?

- Created something awesome, made this code better, added some functionality, or whatever (this is the hardest part).

- [Fork it](http://help.github.com/forking/).

- Create new branch to contribute your changes.

- Commit all your changes to your branch.

- Submit a [pull request](http://help.github.com/pull-requests/).

-----

## Need Help? 

We also provide a free, basic support for all users who want to use this VueJS QR code scanner in their software project. In case you want to customize this VueJS QR code scanner to suit your development needs, then feel free to contact our [VueJS developers](https://www.weblineindia.com/hire-vuejs-developer.html).

-----

## Collection of Components

We have built many other components and free resources for software development in various programming languages. Kindly click here to view our [Free Resources for Software Development](https://www.weblineindia.com/communities.html)

------

## Changelog

Detailed changes for each release are documented in [CHANGELOG.md](./CHANGELOG.md).

## Credits

vue-weblineindia-qr-scanner is inspired by [vue-qrcode-reader](https://www.npmjs.com/package/vue-qrcode-reader).

## License

[MIT](LICENSE)

[mit]: https://github.com/weblineindia/Vue-CK-Editor/blob/master/LICENSE

## Keywords

vue-weblineindia-qr-scanner, vue, vuejs, vue-component, qrcode, qrcode-reader, qrcode-scanner, webrtc