Giter Club home page Giter Club logo

qrcodescan.in's Introduction

QR Code Scanner - a simple, fast and useful progressive web application

Features

  • App Shell
  • Offline
  • Secure via https
  • Responsive
  • Add to home screen & Splash screen
  • Supported Browser (Mobile & Desktop) - Google Chrome, Firefox, Safari, Opera, Microsoft Edge and now supports iOS as well.

Installation

  1. Clone this repo
git clone https://github.com/code-kotis/qr-code-scanner
  1. Installation
npm install
  1. Run
npm run start
  1. Build
npm run build

Contributions

If you find a bug, please file an issue. PR's are most welcome ;)

MIT Licensed

qrcodescan.in's People

Contributors

dependabot[bot] avatar e-sung avatar gokulkrishh avatar hemanth avatar mauriliofilho avatar redochka avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

qrcodescan.in's Issues

Camera Feed Not Shown In Microsoft Edge

OS: Linux (Solus)
Browsers: Firefox (Nightly), Edge (Dev)
Webcam: Logitech B525

Hello, I usually use QR Code Scanner as a PWA on my desktop and laptop, however lately I have noticed that the camera Feed simply does not show up, with only a grey background appearing.

From my testing, QR Code Scanner simply does not work on Edge, however it does work on Firefox (which does not support PWAs), and other sites (such as Microsoft Teams or Jitsi, as well as an assortment of webcam testing sites, work just fine on Edge.

Add iOS splash screen

Is your feature request related to a problem? Please describe.

Yes. The PWA does not have an iOS splash screen.
Describe the solution you'd like
For a splash screen to be generated using https://appsco.pe/developer/splash-screen and incorporated.

Describe alternatives you've considered
There are no alternative solutions.

Additional context
If this is done, the end result will look like https://crossnote.app/ .

To include drag and drop feature

Great application at all! It will be a bit more effective if we can drag and drop image of qr code.
Would it be possible to add this feature?

platforms support

hello~
I want to ask if this only supports ios safari?
because I open it in other browsers on ios and it does not support

Error: Cannot find module './lib/encoding'

I have pulled the *qrcodescan.in repo whenever I run it it is giving me the below error?
Can some help to resove the issue or maybe change the code to normal react js structure because I am even failing to build the project.

INFO: Gracefully shutting down. Please wait...
node:internal/modules/cjs/loader:995
  const err = new Error(message);
              ^

Error: Cannot find module './lib/encoding'
Require stack:
- C:\Users\machilika.l\Documents\projects\qrcodescan.in\node_modules\negotiator\index.js
- C:\Users\machilika.l\Documents\projects\qrcodescan.in\node_modules\accepts\index.js
- C:\Users\machilika.l\Documents\projects\qrcodescan.in\node_modules\compression\index.js
- C:\Users\machilika.l\Documents\projects\qrcodescan.in\node_modules\serve\bin\serve.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:995:15)
    at Module._load (node:internal/modules/cjs/loader:841:27)
    at Module.require (node:internal/modules/cjs/loader:1061:19)
    at require (node:internal/modules/cjs/helpers:103:18)
    at loadModule (C:\Users\machilika.l\Documents\projects\qrcodescan.in\node_modules\negotiator\index.js:108:16)
    at Negotiator.encodings (C:\Users\machilika.l\Documents\projects\qrcodescan.in\node_modules\negotiator\index.js:56:28)
    at Accepts.encoding.Accepts.encodings (C:\Users\machilika.l\Documents\projects\qrcodescan.in\node_modules\accepts\index.js:143:26)
    at ServerResponse.onResponseHeaders (C:\Users\machilika.l\Documents\projects\qrcodescan.in\node_modules\compression\index.js:178:27)
    at ServerResponse.writeHead (C:\Users\machilika.l\Documents\projects\qrcodescan.in\node_modules\on-headers\index.js:35:16)
    at module.exports (C:\Users\machilika.l\Documents\projects\qrcodescan.in\node_modules\serve-handler\src\index.js:754:11) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\Users\\machilika.l\\Documents\\projects\\qrcodescan.in\\node_modules\\negotiator\\index.js',
    'C:\\Users\\machilika.l\\Documents\\projects\\qrcodescan.in\\node_modules\\accepts\\index.js',
    'C:\\Users\\machilika.l\\Documents\\projects\\qrcodescan.in\\node_modules\\compression\\index.js',
    'C:\\Users\\machilika.l\\Documents\\projects\\qrcodescan.in\\node_modules\\serve\\bin\\serve.js'
  ]
}

Node.js v18.12.1
ERROR: "serve" exited with 1.

it can not work

Describe the bug
I deploy it on http://192.168.2.122:4399, and browse it on my iPhone 11' browser, Safari browser, no error report and it doesn't work

To Reproduce
Steps to reproduce the behavior:

  1. rewrite webpack.config.js
    devServer: { port: 4399, host: "192.168.2.122", contentBase: __dirname + '/app' }
  2. npm run start , it tips Compiled successfully
  3. browse it on my iPhone

Expected behavior
It starts sanning.

Screenshots
image
.

Desktop (please complete the following information):

  • OS: [e.g. windows 10]
  • Browser [e.g. chrome, safari]
  • Version [e.g. 22]

Smartphone (please complete the following information):

  • Device: [e.g. iPhone11]
  • OS: [e.g. iOS14.6]
  • Browser [e.g. stock browser, safari]
  • Version [i dont know]

Additional context
I browse https://qrcodescan.in/ on my Iphone, it works;

wordpress theme

hi sir !!
did you know any ideas to run your code inside wordpress website
thank you !!

how to use in vueproject as a plugin

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

  1. Go to '...'
  2. Click on '....'
  3. Scroll down to '....'
  4. See error

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

  • OS: [e.g. iOS]
  • Browser [e.g. chrome, safari]
  • Version [e.g. 22]

Smartphone (please complete the following information):

  • Device: [e.g. iPhone6]
  • OS: [e.g. iOS8.1]
  • Browser [e.g. stock browser, safari]
  • Version [e.g. 22]

Additional context
Add any other context about the problem here.

Problem with links without http

Describe the bug
When link without http is scanned, "Open" button sometimes appear and sometimes doesn't.
Also when such link is opened, linking don't work correctly. Ie. scanning page.com result in address like qrreaderhost.com/page.com

To Reproduce
Steps to reproduce the behavior:

  1. Open scanner
  2. Scan link with http
  3. Close popup
  4. Scan link without http - "Open" button will be present*
  5. Click "Open" - incorrect webpage will open
    *Sometimes "open" button will be persistent, sometimes it disappears after few scans of non-http text

Expected behavior
Links without http should be either not recognized as links or script should check if link have http:// and add it if not (I'd prefer second option).

Desktop (please complete the following information):

  • W10 1909
  • Chrome 87

Additional context
Imho ideal way of dealing with this would be by using 3 buttons in popup:

  1. Open as website
    //checks if text is starting with http:// or https://, if not - adds http:// at the beginning of text and treats it as hyperlink
  2. Copy to clipboard
    //copies text to clipboard
  3. Close
    //closes popup without additional action

Webpack issue

Describe the bug
There is a webpack conflict!

npm run start

[email protected] start
webpack-dev-server --hot --inline --open --mode=development

The command moved into a separate package: @webpack-cli/serve
Would you like to install serve? (That will run npm install -D @webpack-cli/serve) (yes/NO) : yes
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/webpack
npm ERR! dev webpack@"^4.20.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer webpack@"5.x.x" from @webpack-cli/[email protected]
npm ERR! node_modules/@webpack-cli/serve
npm ERR! dev @webpack-cli/serve@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR!

Desktop:

  • Browser [e.g. stock browser, safari]
  • Version [ 1.45.133 Chromium: 107.0.5304.141 ]

Website doesn’t read the second QR code

Describe the bug
I use this website to scan the first QR code, then a dialog diaplayed and let me to open the webpage, but after that, the green bar disappeared from qrcodescan.in, and doesn’t work with the second QR code

To Reproduce
Steps to reproduce the behavior:

  1. Go to qrcodescan.in
  2. Show the first QR code made by 2QR.info
  3. Show the second QR code made by 2QR.info

Expected behavior
The site should read every QR code as expected

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

  • OS: Windows 10
  • Browser Firefox
  • Version 87.0

Smartphone (please complete the following information):

  • Device: Galaxy S6+ Edge
  • OS: Android 7.0
  • Browser Firefox
  • Version 87.0.0-rc.1

Additional context
Add any other context about the problem here.

Shapes in re-scan

Hi
In Android - Chrome 90.0.4430.210
The first scan is done well and opens the dialog box, but for the next scan, the scanner gets out of work, while the camera is turned on, the scan pointer is not displayed.

Thanks so much

Image is read two times instead of one

Hello,

First thank you for the QR Code scanner!
On https://qrcodescan.in/, when I click on the button to take a picture (no use of the video), take a picture and choose ok, the QRCode is read well and the popin appears. But when I click on close, it appears again and I have to close it a second time.

Is it because the qrcode is read two times instead of one ? Or it's just a bug of the popin?

Thank you!

Support for image upload

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

To include scanning of Micro QR

Great application Gokul! It is the fastest non-commercial PWA QR code scanner I have found yet. Would it be possible to add scanning of the Micro QR code version to help in getting the smallest possible code size?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.