0

I have created QRcode using QRCode.toDataURL() function and added returned value to an SVG file. its working correctly on desktop but it shows nothing on mobile. Here is the output link:https://portal.coach.wordupapp.co/cert?no=ec475bf4-83f3-4f17-8878-2365643e01d0

I create base64 string here:

    const fetchBarCode = () => {
        QRCode.toDataURL(certificate?.certificateURL ?? " ",
            {
                color: {
                    dark: '#7B4BA2',
                    light: '#FFFFFF'
                },
                margin: 0
            })
            .then(url => {

                setBarCode(url);

            })
            .catch(err => {
                console.error(err)
            })
    }

and use it here in an svg file:

<image
    xlinkHref={barCode}
    id="k"
    width={1024}
    height={1024}>
</image>
Keyvan
  • 11
  • 4
  • Might be related to this [safari/iOS issue](https://stackoverflow.com/questions/69949555/convert-svg-with-image-not-working-in-safari/69968513#69968513). You might fix it by adding a delay before rendering the image. – herrstrietzel Jun 27 '23 at 17:30
  • I've tested it using Firefox and chrome on my phone. Not resolved. – Keyvan Jun 28 '23 at 15:50
  • If your phone is an iphone - the render is always safari webkit (even for ios FF or chrome). So at least you could narrow it down to a safari/webkit specific bug. Does this error also occur when generating a very simple short URL? You might also circumvent this proplem using the `renderAs` option `svg` – herrstrietzel Jun 28 '23 at 16:01
  • not work with short link also. This is the URL:https://portal.coach.wordupapp.co/cert?no=ec475bf4-83f3-4f17-8878-2365643e01d0 – Keyvan Jun 29 '23 at 10:42

0 Answers0