ESP32-CAM: Camera hex data stream use (How To?)

[Pcborges]

Hi, I am trying to transfer an image from ESP32-CAM to Node-Red.
ESP32-CAM can successfully save the image to SD and I can then view it on my PC.
But when the jpg data stream arrives at Node_Red it looks like below: (FFD8FFE00010=jpg).

An Exemple of what arrives to node-Red is as follow:

Code: Select all

FFD8FFE000104A46494600010101000000000000FFDB0043000A07080908060A0908090B0B0A0C0F19100F0E0E0F1F161712192420262624202322282D3A31282B362B2223324433363B3D4041402730474C463F4B3A3F403EFFDB0043010B0B0B0F0D0F1D10101D3E2923293E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3E3EFFC4001F0000010501010101010100000000000000000102030405060708090A0BFFC400B5100002010303020403050504040000017D01020300041105122131410613516107227114328191A1082342B1C11552D1F02433627282090A161718191A25262728292A3435363738393A434445464748494A535455565758595A636465666768696A737475767778797A838485868788898A92939495969798999AA2A3A4A5A6A7A8A9AAB2B3B4B5B6B7B8B9BAC2C3C4C5C6C7C8C9CAD2D3D4D5D6D7D8D9DAE1E2E3E4E5E6E7E8E9EAF1F2F3F4F5F6F7F8F9FAFFC4001F0100030101010101010101010000000000000102030405060708090A0BFFC400B51100020102040403040705040400010277000102031104052131061241510761711322328108144291A1B1C109233352F0156272D10A162434E125F11718191A262728292A35363738393A434445464748494A535455565758595A636465666768696A737475767778797A82838485868788898A92939495969798999AA2A3A4A5A6A7A8A9AAB2B3B4B5B6B7B8B9BAC2C3C4C5C6C7C8C9CAD2D3D4D5D6D7D8D9DAE2E3E4E5E6E7E8E9EAF2F3F4F5F6F7F8F9FAFFC000110800F0014003012100021101031101FFDA000C03010002110311003F00E364B6D7133FE8F391D8AED351FDA35A80730CA3DDADEB5E662E487417FB775088FCF6EA7D736D4F1E289B1CD9D8B63D72B45DEE1CBA9613C5309FBFA547EFB25CD598BC49A5B7DEB1B98FE8A1AA6E2E5B179752D3648F7AA9403FE7A478ACCBBD520FF96510FF00810ABB872F731A5B9F71509949EF51715C88B71C5373EF5572B9442FCFBD36A6C36C0FB1A4E6A42E2EEE68CF1C555B40133499A5D340177734134DDFA8588DA9335364037BD19AAE80C4A415120128ED4E234C68EB475AA061EA681D2A7715C4A4E7B1A1761EE2F7CD4D0AF39347516C4B4B9A683A1E98C7D299B813F7B93EF4B61D8823BD57BB36C3E62BD1B2196A5611B72F1C2DFEF46A6890AD62A5C595849F349656C4FAECC560DC2D85BBB7D9A2DAFEBD6985ADA94E4B9F9B9F4AAE66CE7D2AAC46EC8B7D33E951D6E5C5584CD1B85580139A6F148485341A8455EE2519E6AC13141A427D2A4571B9F9BA6296A92013AD252B00869A2A7EC8C29BDE88B0E82034B5561094868D8028EB536B809DE834C0075E6ACAFDE18E9496E0C247E78A6090D368365667696FA83B49B59B20FAD5AFB7408F87720FFBB9A5BB2ED62941E4C213C967623B0E38AB5FDA3107025465F71CD5F2F51B175697C9D39DD5B9FF001AE4A5973939A68C99039A6B374A4CAF313AD19E3EB504A620E0F279A1A9A1DB40CD2E2AB404145483414945F41A885251CD6D4394292852EA210D251CDA0E40452534C4276A4A4D0C4EF463D28BA1EA1F5A4A2E481EB498A5B020A2800AB107D7A53D81A603939A3145C0D3924DC30BD29AB3BE4E6A145DB52992C776E80ED273EE286BB72B82702ABC89DC24BA95C6C95F391DEB34F71F37E14426E22E830B6693B5527DC690EA4A01851F8D3F2013BE79A3A520B6A2F7A298C3AF5A33E94BAD8033499A76B896884A292B20B8869BD6A986E29A4153D03A08693B52BEA0149DE9A41A89467143EC01494842D20A9BE8361D5AAC7FCB36FA5512227DCA755790EE7456BA6C5A824A2DE7D8C1F8DFDEB2C12BFDE57A8FB4579087AE5A9CD86E38A1EBA83DC1B9391D6ABCE8C9C91D79A109C483EB40C0ED46FA83EC37BD3BAD3F30B6A27D3934FF00AD171B10F07AD1F4AABD85A877A4F7E6A4051EF453EA53D44A31473584193499ED4B425894940C2929C74DC2E25252B85C4EF4538B01293BD008052D4B60EE252D21F41D101BB9A9653F21AAEA48A3802928B8CD2071D2A0EB9C77EB4BD9F2C8A96A8519CEEE31530C15CD0D93CA3D59965574C7CBD69D29F3C36F7F9BE953248B329908620F6A6F73C9AB8EDA116171EF48051B03D4763D78A5A1BB80DA4E7753F201D452B80DA5A6027341A2425A85033CD2D07E414CA600DED48BD79A6B6016986A2D704B4B80141A7CBD47D46F34B8A2201D2969D804A2958420A7B365714EC04C07145262EA69BC6A78DF51EDF714E5E43D86888F3CD595488D8365607707D3E7A5A832247509B5E21FEF0FBD537D9F6E18F9DF30C80D800D27AC8D14AC55BAB7902F984A91E80D53E29D9913571BF4A53D3DA96A20A41C53D520DC514940052F7A6084EF4B49809483A75CD2401451605B899E68A760B8DA280133CD253E96189454EC1B06696AA42D46F7A5A4C698DA5A052DC4A5069580B20EE141A00D496DAFA21BA5B1B809FDEF2CD5469C29F9D4A9F43428BFB25CAC1E7A77603F1A7C771F27CA7228256A3FCC4FE351B6ACFDB41E0A295FF7FA552F20BB486B4EAD95DA391EB59920DAF8A577D41B1BD31814526EE0271D297155CDA58484A5F4A5B86E14D0695BB0217BE6968093129BC714F6D0683B52D2B85C290D301B47DEA7615C6D250C05EF415A0771B45242B89453B0C2929083340C555AC80963CE6A63D6A2C07ACE4A9CAB11F4A53349DDF77FBDCD53EC1E6567B6B5947EF2CED5FEB0AD549344D264186D360FC38A71D3440576F0E692460412A0FF00666350B78574E3F725BA4FF810349441DCAE7C1F07F06A320FF7A2AAD2F846E4E7ECF7B0487B2382B9A560B9CC3C6F1B94901475FBCA7B525017D2E21A51D2982620A40314EE30EF450DD842FE34BDAA404A296C02514D0087B514EE313AD005215869A5A2E35B0E09CF34A0629F30869A4C52DC06B2F714DC537A9570C5152485277A6161EADB6A553B945087D4F5B34D35A086D04D1D46149408294520399F16E91E6A1D4ED973220FDF2FA8F5AE3FF8734800E7149F8E6A5A0B0B4678A60981A280621EB4828B6B701D4948028A481AD46FB9A5AB6312834AC21A7D69E832DCD2F310F2C32702A3273421F41A29707381C9A4B7D464A2097CBC98D80F53501F6AA01B494B700A4A9420AB305C37DDE36FD055E8C0F5A355EE2EED2D4AFDAEEA2837FDDF30E334DBB0C625FE9EFC47A9D939FF00AEE2A71873F2490BFF00BB2A9A71BCB542E6485F265FF9E6DF80A61CAF07834AE868297340C335C1F88B486D3AEFCC8831B597A1FEE9F4A188C7EB498FCEA02E1DB9FD281C550AC0697B5201293EB4B71F90B49DE8F4181A3BD020E09A4A7AEC3128E314FA086D4CA3919352C16A4A969753006286423D71C5595D224E7CD9917D80CD03271676D18E13271D5A9D6CB3DEB7916C1768E49ECB54C0DAB7D3ADA08FF7D89E5EA4BF20563F886C9777DAEDC281FF002D1454D8673F8FCA9A68448DE94B484146715567619EABA45E9BED384ACCA645628F8ED583E3A6C49A5FFBB2FF00314D6A847238C0FBA33EF4DDABDD454A1BB22559255FB934ABF47357A3D5F5141F2DFDC81D3FD69A7B12FDE66D786755BFBCD50C17774D3462176F980AE9B76685B942E6A2BAB786F6D9EDAE87EEA4EA7D3DEA8763CEEFAD25B2BD782E3EF8EFFDE1EB55BBD2D6C2B052D1D06250693DC41452F200ED4945EC014945C05A69A7A86C1466860EC20EB572C39D461FF7C1A5B8CE80B963D6AADC4AB12EF7603F1E4D68872B197737F24C76A0D89E95D1686CB1692817F898963EBCD66F71224927E1B9EB59D75724A614F34DB2CC6B9265C551239A46636968108690534C2C7A8695A65CE98D70BF688A7B79F0DB403B918573FE36901BCB38F3931C4D9F6C9AAB76039AA29455837168DB4845BD36EA6B29A49EDC81218F60246455F4F11EA9C65A03F5845534596078AAF97EF5ADA1FF00BEAA55F16BEDF9F4E88FD2534A4FB13F095357D66D355B501ECA78A74FF56E2504563DB470BCBFE9129893693B80CF3DAA5BD342E16911520E0D0B41828CF5A5A25AB337B89DE9714586371463D29F5061462896F6105378A49751E818A0D5362DC12AF69BB45DF9921DA88A4E69016DAF0B4A56C63699FF00BEA322ABFF0063EAB70FBFEC9265B9CC8714DCB50DCB0BE1DBF1CBBDB463DDEAD4312DA2FEFAF626C764C9153AA08914D7313FDC66FAE315499F269BD50FA10F1551A94622B5C88D2536014DC52D86775AAEAAB35BB8863BD8266911B2DC2B05078AE7750593CEDFE515CF34735982653191D57F4A00E31D69EA2B866969FA80E46DBBBBD1BBDA8B97B11FF1734EC71D6A5EA4B1383FC55660B279ED26923C7EE88FC78345FB822AFE349DA9B602F4EA08A286C2E2F7A4A4C1B0A2801073452BDC2FD00D21F5AA420A6FAD1D405EF5D5F8734EB4934B6B9BD8164677FDDEF2718149F905AC5AD5758FB1B08AD228C3F5E1405159326B37B37DE907D028145F94D158A725CC8E4EE76FCEA139FC2A6F7640DA8F710DD6A816A264D37E82841720714CAA10945219A574364C4673DC64D45E7CB9FF0058DF9D35AEE1664BF6962BF35493DBDDA713DA4E87A7CD130A6A2CCDF98C8E748A1F2A445CFBF069B2CF6C4FEEE3551E85B352FB160C50AFCB819A88678CE290C09CB741F41464500C407E95B3A1CBB20B8DB83F32D52DC48CFBB8366645FBB5569145ABFBFBAD467F3AFA769A5DA17737A0E955714BA881B8A29883B734DCD2B942D2504EE1EF4945D0750A3BD175B0EC2804B7039AEBD3FD1AC62B70788C628D8662DE9DD7049AAFDE9121451A00C35139E7EB4C62678C536900D7A84D5086D14203A0BA413438C72BD2B288E695D7358AB87E1570DEDC31F9E595FF00DE90D53F8463D7519D4FCAEDF9D3D7539B20B36EC1CFCCA1AB18C22A5CC397BDA093DD2DCCFE6CCA4C9C7CDD2A20B6CEFCEFFC2AB6D50E3644F17D80712AB3FE757259B459AC45BC560B0CA31FBF05B34D2B2D49F88A715B59B4EA669F29FC4AA3E6C55F7B6F0FEDDB15E6AF12FBC5135385E7B09FBBA0DF22D5D3C85D5BCB88FF0015CD9EDAC8BEB64B69B115CC1749FDF8B35728A5D488B975454CD15362EE1C52D02128A496A036947D289083349406E1DE9451B9572EE9517997C99E89F39ADCB83814EC0655CF5C8AAF9F5A5240C71EB4DCD656121322A27E466B4B029118E68A4015138C5521322A4A7D0674C31CF3FA567DEC1F31957F88D4E97B89BB95A9DC8E2ABA1685E28039E6A3528771EB41C7AD342DC28CD438B6CA168E94DC49B864FAD34F3DEAB42485873D69B570D89B077A5A194149DE9137128A3CC1866834804A7FA51619A5A4B05B9C7F796B5A4FBBC53D59A27A1977155A94B72185266A49129ADD2A9810D146DA85C291A905C81BAD329D86743BC67EBD29786520F4A95A83F74A334212766C641E94CEBC7354527DC31DA819C7CC066A74061D0F14EC0A6C6263BD1C6053F21050290C534DE29D8488CD33BD1B12C09A4ED4F945D45A4A43B8868EB540C5E05378CD09085E29CBC537D80B36926D995BDEB7DFB8A9564EC52336E40AA4694F7130A2801281484566FBD4B4C37169A688811B0A8E81A37370A5CE0D4F2FBC2B86032F3558C647FF005A9A571B634AB51823A8A6E361DD583BD14B6D003F2A5A48B1292A91207A75C7E14DA56621921A75BC625976938E3AD559D82E25D5BCB6B3F9330C375A88F5A6C9DF512827DB9A9E400A5155CA034D2D3D8A0EF4F3E95325A923E3ADF89FCC843524329DC726A91EB49EE1212929D894F503CD368436C85BEF5140EE21A0F34086B73509A685735F77CCA7EB4F53CD41761F919A46E6853B3B89A2B1765EB51B4B5BB699360EBDA9C7DEB166B612969DF413D028CAF6A5764DBA852718A9E66344048C9AB7A52EFBD8F3D335AC5F7158D3D6B64F3853F3951D7D2B0E688C2FB58536D211152D4F30EC252D2E71586D3BEB4EE02AE3AD21A42EA4895B162FFB9DB4752AC327386AA4D4486D0CA5A44F5129B4D482C44FD69B4730316929261613B546F549858D3A77EB4AC8649CD15250C740DD6A278FE5FA55222E3551B834E2BF5A5A05C40B9A52B40F985DB8A4DA693434C0A3639CE7DE9855A988800C9E0568692A4DC903B0CD57502E94F3AEF71EE4629FAA2AC9124457B6E07D2AF762306E20681F6B8FA5478A96877128A913DC5E4D382FA508192CA3CA8F6FF1B557A6C10F15A164FB5B140226B9EB9AA4F4A4818DA2905C2928D808A4A60A761B128A372429A79A394668E78A0363AE295BA1571F9A70A1FBA1B8A6A393FD59146E2153EE83ED4B906972B10CE33903EB4EA2C36F513B714B54F406029296E24376019356B46F963BA9982F1B5467DF34D0172156F3506DE075349392DA8C4BD7BFE55A363E51CD6E93E56E06573C1EF5877568F037F797D6A241CA5639A318A5D00777AB56F18DC1C834BA888AECFEFB1E9505301C0D5A80E185032DCBCAD537EB4AEC6328A44851540324E950D1D062D254DC5613A52550D179A81532D0A7B8EDDDA9EADC85A7D091E78EB4D34A3DC7CA839C7434CCD1710727B1A3773D2A6E1CA296A4DF5A090022973EF5283CC47FB86ADE96B9B770BC9DF9C56880BD03112ED3F8D47D75227763DFEB55A0F544D1FDD663EB8AA77246420EF448AE633E6B5C729D3D2AAED39C62B32644B1444FCDDAADB10AA4E78A61EA673B66427D4D3693DC131738E2A504D1D40B9BBE5A85A890990E69690C4CD2D1D0435BA54549009494D001A4ED4C65CE334A3934B97A80E51C714EDBC52E6B0D6C382814E14310BBB8A53B7AE7AD3106050541EB4C0368A4F2C7A51D00367B51B3DA86808A55C2F1576D33F665278CD096BA022F47B3CAE07CE475AA8B8F36563D8E2B5064E878F6C5576FF8F86CFF000D37A01148571F2D3001B6930B8CFE2F6A8EE0E12A2C0503454B042E69EA79A2C05A8FEED35E8022C8A3A54D804A2A82E34D474009494218514EC1D4BFB76F7A5009EB5177B80A9D3A63EB4F029F28314D369598099F4AB96B76D12ED015C7FB4B9AA8BEE2B9379C5FFE58C0BF48C0A68438E70DF85685449027FB0B8F4A95562C736E3F334288C9365B951BA03F81A9960B36E91E295801F4C8A42A1431CF1D6B1ACB773031F9909029215B52FEE0BC83C66A8C7F73AFDEABDB71589BCEFDD9CFAD5553BD777F7A9363B09D5B0295BA63D295C923E82AB5C9F9714985FA153BD152C6381C5385022C474AF48087BD06800A434D80544DD694404A4A761853695C0D0A70E0F14FC863B2075A01A5CA4DC4FA1A296C17EC271D29E9D6995B9A11A65F156D63AD1AEC3DD12794053B67D6AA203C27A1A76CA570074C45F2C9B646E17EB59062104D81B4490A60E0E72319341121C0868F3DA987A7D282BA15E534A0FCB53A310C1C0CD31B96A7615C56AA7727E7C7A548B4B95FBD14ADA8C4E86A45A2C3D8993EF548D40AE44D494BA8087A5253101A8DA9009494C1094945AFA14681EBC51C8A3A8084FE74A5A900DDD467DE87A8ADA01C5381C6285B8EFA1BBA18F352467E83039ADBFB0A7F0935455F413EC3CFFACFD286B4FF006C53DC57B8DFB2B7A8A6B5BC94C642F03AA671EF55755B563681FCBC30719907614DB2599E02C6D2419FB87F2A6B80ABD6981558E697754ECC4F610E7A5341396F6A14AE2D83B5507396A4223A5A4CB1297343622643531A9B85889A928012929A185318D22465251B0EC14534CA2FB311467DE8B89EA373487D6892EA17E804D25243E83A97DE81A37BC3A0B8BA5CFDD2A6B7C67D6AD6C4DC37BD26E7A6958AB0E0C697E63D2A8435F3834CCEF648DD4317E46EA4FB01CB1DFF006A911CE763364E3A9CE6964C1FC28BF41151C9E94A6A44F5137668EDF5A5B074192B623354280169714804ED476A00553CD4EA68F20B81A8E93417129698213BD31E806479A2980945202F31A6FAD0EC5D84E38A5CF14315C01ED40383400BFC5D38A51F4A9046E786CAF9D39EFC62BA30335A2D100EDB4A1698AE3C254AAB4805D9CE3B1ACE6C8FB3C9F855582E62788D11754B5955403245F31F5C1C5503F7690883F8B149D579A4F405B0DA314856209FEEFD6A102931862969009494C029C38A4F701FBA9B4EC26252527A0C0D309E285A81152D31DC4CD19A561176938F4E68637D829BD4D28F71B1D4B45C370CD2F5A376346D78795BCCB960C368001FAD754A0ED19EB8AB2476D35204AA192AAD3B145802B36EF70B56E3847DD4D21193E25526D2DA5F976AC9B718F5AC663C540B62127E6A4A421A693B52B6A047B77CB8A9DEDF6FF0914EC32168E9A52A406914CD940084518A3701C0629A69DC0652668188691A9AD008E8A420A2803FFFD9

I compared this content with the contents of the same image saved on (SD) disk (at the ESP32-CAM) and it is precisely the same.

At Node-Red I have a function node as below:

let pic = msg.payload;
let buff = new Buffer(pic);
let base64pic = buff.toString('base64');

base64pic = "data:image/jpg;base64," + base64pic ;

msg.payload=base64pic;

return msg;

Connected to a template node as below:

Code: Select all

<img src={{msg.payload}} width="100%">

but when I check the corresponding dashboard all that is visible is a frame with a little icon typical of image not found...

But when I pic a data stream from an internet (link below) test site and replace my own stream with it, it works fine.
https://www.codespeedy.com/display-an-i ... e-in-html/

What Am I doing wrong?

Assistance welcome.
Thanks
Paulo