Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Trying to show an encoded with base64 contents of a qvideoframe into html



  • I received a correct qvideoframe object from qcamera using qabstractvideosurface and convert it to base64

    			QByteArray arr ( (char *) frame.image ( ).bits ( ) );
    			qDebug ( ) << arr.toBase64 ( ) << endl;
    

    Now I sent the encoded data to some html client how can I show it

    <img src="data:image/png;base64,$encodedContent" />  <!-- invalid -->
    <img src="data:image/png;base64,$encodedContent" />  <!-- invalid -->
    

  • Moderators

    @Jafar-Sag-Sibil
    frame.image().bits() is not PNG image data

    the docs show to convert it to PNG


  • Lifetime Qt Champion

    Hi,

    You know that an img tag is not meant to provide a video stream to a person loading the page ?



  • if you mean that I need audio beside my image => yes I know because I want create something like pantomime
    if you mean I can't display as video in img tag => no please describe


  • Lifetime Qt Champion

    @Jafar-Sag-Sibil said in Trying to show an encoded with base64 contents of a qvideoframe into html:

    no please describe

    You could also read about HTML: https://www.w3schools.com/tags/tag_img.asp
    "The <img> tag is used to embed an image in an HTML page."



  • @jsulm said in Trying to show an encoded with base64 contents of a qvideoframe into html:

    no please describe
    Anyway I want grab an image from qt show that in some html client
    new code is

    			QImage		 image = frame.image ( );
    			QByteArray ba;
    			QBuffer		 buffer ( &ba );
    			buffer.open ( QIODevice::WriteOnly );
    			image.save ( &buffer, "PNG" );
    			qDebug ( ) << buffer.data ( ).toBase64 ( ) << endl;
    

    output is

    D libuntitled_armeabi-v7a.so: "iVBORw0KGgoAAAANSUhEUgAAAyAAAAJYCAYAAACadoJwAAAACXBIWXMAAAsTAAALEwEAmpwYAAAgAElEQVR4nHy96ZItSXIe9rlHZJ6t6m7dPbdnwewboDECwiqj8QfNyH/iDCgaQJjxafo1JD2CZHoTyPRDMlEDDUEAA3TPdN+lqs6WmRHh+uHuEZGnG8qeO1V1lsxYfP18Cfpf/7f/RYgYRAQRAVBARBggmOcZuRQAwK//8TeYlxlv3z/i7Zs3eDo+IISIw/aAw+EAyQuIGMSCkjMCMQAgpYR5nlEgAIAlZxQpCCFAiiADCCHicp1BTCDSf3PScWQRfT0wlmXBOI54/vw5vvHRAeMwYhwCckoIwwZxGABhhMCYrxHzPON0Jmw2Gzx/scGHH36IGAqGOGCeZwDAMAT4RUyIxHUdAICJAAA5ZYTYPuuXFB3fiICUEwAghogkWd9nQk4ZHHSNKQSICEQKiBiggFwyAkHXRAREBCZCEQGyrgMAcGAgAUWkjqvtm16BGVKkviZcUIogMhACIxX9TsltDsU+6/dMOSGGESEElJR1PANQSl49j4jgN8pS6rjiMEBSBjNhyfp+gc2fCVIEaUogJuzGAUUERaitqQimtEBEEGNEzhkhEIoUAEo7y2LvY8Rf//Vf43//P/4ej4+PePfZZxjGAa9ePdO15IxSMh4f32OeF8wEPD0dcZkniBQUjjoX0b3bjgOePXuG7X6v86Rii1QQQ0TIgsAMIkEcBuSk7xdiMDEgSvcZQM4FIr5PvsYBy5IQxmjf89unurYxBBAxlrRgnmcEZtv/ABRd41IIIgVt2Yo9t9FCKaXyUwGv1pcKgZnrXjqf93Tge0xEsOEj51y/57QqIghY04XPi0X/Zo4opSDbgENHv0SMnGeltwLM84wxBgzDgJIziggi2/p2V5GCOSv/1eeCEVh5SkQAf48BKQWCbPyk85WOv5zvdDWNfwvZHKmunfK88ZfocyI3eTHEAffI2Gw2eBYKODB2MYKYUErC09
    

    the size of image is detected correctly by html but still cannot show

    html code

    <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAyAAAAJYCAYAAACadoJwAAAACXBIWXMAAAsTAAALEwEAmpwYAAAgAElEQVR4nHy96ZItyZEe9rlHZJ6lqu7aG6DG1sDMAAMQGBtxJJJm0gMMbYY0k0hRfBo8kMz0R68hM45JIgkNMNh6v7fvreVsmRkRrhuHhFZ3VC1VdetU+dkRkZ4+PL55x70v8f5uklCGpgIjAHFBKxhAilmUBlYyUE7788nPc39j4eGAh8MDzqcL5nnB06fPEUPAbr9HWhYUAkQEAQQiQs7A+XzCeEAZgbHAUtKyKkghIgEgoigEAAAMQSknMHMAIAQGESEkgs4MJgDiAhXux0+eP99PNlfg4kQhwExBOSSICJYSkTKCcnGcbUPePbsOTZx0d83IwAgLQUhBCxZdNxDxJISxmFAKQUsOq7AjJILAgIAgGJASnovACCi+m8AYI4QETAzSintfRz1J4o+L1P9rEgBc9DPRb1PkoS0LNgMW5Sia0REX7tnJAYxYZrOIGKQDTwyIEVATJAiECEwM9IiCCF+bfz+M8QAJkLKOl8QvT4TIefSxsI6byXr83Bge26srleyi0VQMSePUQUEQxDBAvqdUMMiEwoOQNBkFKu9yslg4ghovIzXTL+0z8JzDlbfP7F55jmB4zjiP022lyxrXPG6XzGqs7HA9HIDCWeQaxVLkPgSEh48nNEzAPYNa58r+LFBAxhiEiICCXAuKInDNSKSAmBKh8jnGAFEGwZy0l13lOOaMwoZQCrNZfUGw9igDMocofsa15FbFSZc33WzfWQjEhJza+5gDMkxmJdpnTS6CrMYhRepaMHOVk2ADYHsuwyDVvJZ7LZZVPb8fnXM9OgpqOBPfRERCgQ5F4itpz4PY6wXygjMyLDxMyFwgEiy+Qz+NjAzAgfkkhHAJo9seqjUOfXxM1OddyJCThkE1VX+NZjcj4Ne2ZDePfdd3HNE5gZ+3xAEUEgndfNEMFEmKczAGCeZ8QYEI" />
    

    the size was set to 800x600 in qt and html size that correct but with an empty content


  • Lifetime Qt Champion

    @Jafar-Sag-Sibil said in Trying to show an encoded with base64 contents of a qvideoframe into html:

    no please describe

    Describe what? That img is used to show images and not videos or anything else? Isn't that clear from HTML documentation?
    If you want to show video take a look at https://www.w3schools.com/html/html5_video.asp



  • I know what img tag does but I convert videoframe to image then use its base64 to embed on html
    I want to show that image nothing else why are you angry man?
    even I converted that image to png in save method


  • Lifetime Qt Champion

    @Jafar-Sag-Sibil said in Trying to show an encoded with base64 contents of a qvideoframe into html:

    I want to show that image nothing else

    I had the impression that you wanted to show video.
    If you compare the qDebug() output to the html code you will see that your Base64 differ.
    You should use the QByteArray (ba) to convert to Base64, not buffer.


Log in to reply