search

TeraTech / MMM-WiFiPassword

Magic Mirror Module that displays your WiFi network, password with QRCode
MIT License
99 stars 19 forks source link

Scanning with Andorid 10+ integrated WLAN-QR-Scanner #5

Closed MLpGHub closed 3 years ago

MLpGHub commented 3 years ago

Hello @TeraTech,

while using your MMM-WiFiPassword I have noticed some scanning issue. Since Android 10 there is an option available to scan a QR-Code for accessing Network right underneath the Network section on for example a Smart Phone (attached Image). I tested scanning with this option on several Android devices, but it didn't worked for me. Using the scanner I can see the QR-Code created by your MMM-WiFiPassword but it wont show up any further reaction. Now I am using a third party app. Some worked just fine others not. Maybe there are some differences in the types of network QR-Codes.

Is there an opportunity you can change the MMM-WiFiPassword so we can use the integrated QR reader on Android? I would appreciate.

If I am right with the idea of different network QR Types maybe you can build a little switch so users can decide which Type do they need.

I don't know if this issue only happens to me, but I thought is still worth to share with you.

Tested on OnePlus 6 OxygenOS Version 10.3.5 IntegratedQR-CodeScanner IntegratedQR-CodeScanner2

skuethe commented 3 years ago

I have the same problem. Haven't really found out until now what the problem is. I tried other QR Wifi implementations (not on MM²) and they work just fine. F.e. qifi. The actual text send by the code seems to be just fine.

I suspect something with either the js lib used for this or maybe some color problem? Will try to investigate more if I find the time.

skuethe commented 3 years ago

After some testing I would definitely pin this on the "inverted" colors. Also see reason nr. one on this site: https://www.qrcode-monkey.com/6-reasons-why-your-qr-code-is-not-working

So would need to make it work with "normal" colors

skuethe commented 3 years ago

For testing:

image

skuethe commented 3 years ago

Trying to hack colorDark and colorLight to use the opposite colors does not work either:

colorDark: "#fff",
colorLight: "#000",

Probably because of reason nr. 6 - no border space: https://www.qrcode-monkey.com/6-reasons-why-your-qr-code-is-not-working

Fun fact btw: I am getting this error also on a one plus phone. Tried to replicate it with an huawei running android10 , but that does not seem to have this option (yet?).

At this point I would think about maybe switching to some other js library. The testings above where done with https://github.com/kazuhikoarase/qrcode-generator/tree/master/js explicitly the createSvgTag function. It does not seem to have a nice feature to actually determine the width and height per pixel but it seems to do the job :)

skuethe commented 3 years ago

Sorry for spamming, one last update from my side :) I created a PR #6 for this. We actually don't need to switch to another library. Fixing this issue is done in two steps:

  1. don't use inverted colors as per default config
  2. add a padding to the QR image, so that scanners can pick it up easily