Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

decodeFromImage not working #525

Open
XavierTM opened this issue Jun 30, 2022 · 4 comments
Open

decodeFromImage not working #525

XavierTM opened this issue Jun 30, 2022 · 4 comments
Labels
bug no-issue-activity

Comments

@XavierTM
Copy link

Bug Description
BrowserMultiFormatReader.decodeFromImage and BrowserQRCodeReader.decodeFromImage not working.

To Reproduce
Steps to reproduce the behavior:

  1. Go to https://zxing-js.github.io/library/examples/multi-image/
  2. Click on DECODE button.
  3. See the error.

Expected behavior
Detecting the qr code on the image

Screenshots
image

Desktop

  • OS: MacOS
  • Browser: Chrome
  • Version: latest

Additional context
I also wrote my own code to test

<html>

<head>
	<title>ZXing Canvas Test</title>
</head>

<body>

	<img src="https://blog.hubspot.com/hs-fs/hub/53/file-2457427390-jpg/00-Blog_Thinkstock_Images/qr-code.jpg?width=381&name=qr-code.jpg" />

	<script src="https://unpkg.com/@zxing/library@latest"></script>

	<script>
		const { BrowserQRCodeReader } = ZXing;
		const reader = new BrowserQRCodeReader();
		
		(async () => {
			try {
				const img = document.querySelector("img");
				const results = await reader.decodeFromImage(img);
				console.log(results);
			} catch (err) {
				console.log(err);
			}
		})();
	</script>
</body>
</html>
@XavierTM XavierTM added the bug label Jun 30, 2022
@ti777777 ti777777 mentioned this issue Jul 29, 2022
Closed
@transiscodev
Copy link

I was able to replicate this. It's also true for Data Matrix decodes.

@mengyi-dev
Copy link

this.$el.innerHTML += <img id="image" src="qr.png"/>;
const img = document.getElementById('image');
img.videoWidth = 0;

For my solution !

@github-actions GitHub Actions
Copy link

Stale issue message

@lewismoten lewismoten mentioned this issue May 20, 2024
Open
@lewismoten
Copy link

this.$el.innerHTML += <img id="image" src="qr.png"/>; const img = document.getElementById('image'); img.videoWidth = 0;

For my solution !

This fixed my problem as well. Thank you for making this work-around available.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug no-issue-activity
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@lewismoten @transiscodev @XavierTM @mengyi-dev