Base64 ઇમેજ ડીકોડર | ઓનલાઇન ઇમેજ ડીકોડ અને પૂર્વાવલોકન

base64 ઇમેજ ડિકોડર શું છે?

base64 ઇમેજ ડિકોડર એવું સાધન છે, જે base64માં એન્કોડ કરેલી ટેક્સ્ટ સ્ટ્રિંગને ફરી ચિત્રમાં ફેરવે છે. Base64 એ બાઇનરી ડેટા, જેમ કે ઇમેજ ફાઇલના બાઇટ્સ, માત્ર 64 સાદા ટેક્સ્ટ અક્ષરો (અક્ષરો, અંકો, +, / અને પેડિંગ માટે =) વડે લખવાની રીત છે. બ્રાઉઝર, ઇમેઇલ અને ઘણી API આ રીતે ઇમેજ સંગ્રહે છે, જેથી ચિત્ર અલગ ફાઇલ તરીકે નહીં પરંતુ સાદા ટેક્સ્ટની અંદર મોકલી શકાય. ડિકોડર આ પ્રક્રિયાને ઉલટાવે છે: સ્ટ્રિંગ પેસ્ટ કરતાં મૂળ ઇમેજ દેખાય છે.

ડેટા URL ફોર્મેટ

વેબ પર base64 ઇમેજ સામાન્ય રીતે ડેટા URL તરીકે લખાય છે. તેનું બંધારણ આ પ્રમાણે છે:

ઉદાહરણ તરીકે:

દરેક ભાગનું પોતાનું કામ છે:

• data: તેને સામાન્ય વેબ સરનામું નહીં, પરંતુ ડેટા URL તરીકે ઓળખાવે છે.
• image/png MIME પ્રકાર છે, જે બ્રાઉઝરને ફાઇલનો પ્રકાર જણાવે છે.
• ;base64 કહે છે કે અલ્પવિરામ પછીનો ડેટા base64માં એન્કોડ કરેલો છે.
• અલ્પવિરામ પછીનું બધું જ એન્કોડ કરેલી ઇમેજ છે.

ડિકોડર કેવી રીતે કામ કરે છે

ડિકોડિંગ ચાર તબક્કામાં થાય છે.

1. સાધન તપાસે છે કે સ્ટ્રિંગ data:થી શરૂ થાય છે કે નહીં. data:text/plain જેવા ઇમેજ સિવાયના મીડિયા પ્રકારનું નામ ધરાવતું ડેટા URL તરત જ નકારવામાં આવે છે, કારણ કે તેને ચિત્ર તરીકે ક્યારેય દર્શાવી શકાતું નથી.
2. લાંબી base64 સ્ટ્રિંગ ઘણી વાર અનેક પંક્તિઓમાં વહેંચાયેલી હોય છે, તેથી તેમાંનાં સ્પેસ, ટૅબ અને પંક્તિના અંત દૂર કરવામાં આવે છે. Base64ને બદલે ટકા-એન્કોડિંગ વાપરતું પેલોડ, જેને RFC 2397 પણ મંજૂરી આપે છે, તેમાં કોઈ ફેરફાર કર્યા વિના આગળ મોકલવામાં આવે છે.
3. તે base64 ટેક્સ્ટને ફરી કાચા બાઇટ્સમાં ડિકોડ કરે છે.
4. તે પરિણામના શરૂઆતના થોડા બાઇટ્સ તપાસે છે. દરેક સામાન્ય ઇમેજ ફોર્મેટ બાઇટ્સના નિશ્ચિત ક્રમથી શરૂ થાય છે, જેને સિગ્નેચર અથવા “મેજિક નંબર” કહે છે. PNG ફાઇલો 89 50 4E 47થી, JPEG ફાઇલો FF D8 FFથી શરૂ થાય છે અને અન્ય ફોર્મેટમાં પણ આવું જ હોય છે. ડિકોડર આ સિગ્નેચર સાથે મેળ બેસાડી, તે ઓળખાવતા પ્રકાર સાથે ઇમેજને લેબલ કરે છે.

લેબલ કરતાં બાઇટ્સને પ્રાથમિકતા મળે છે. ડેટા URLમાં data:image/png લખેલું હોય, પરંતુ બાઇટ્સ FF D8 FFથી શરૂ થતાં હોય, તો ડિકોડર URLને data:image/jpeg તરીકે ફરી બનાવે છે, જેથી “Copy Image URL” બટન દ્વારા અપાતી સ્ટ્રિંગ પોતાની સામગ્રીનું ખોટું વર્ણન ન કરે.

જો સ્ટ્રિંગમાં data: પ્રીફિક્સ ન હોય, તો ડિકોડર તેને કાચા base64 ડેટા તરીકે ગણે છે, તેને ડિકોડ કરે છે અને એ જ રીતે સિગ્નેચર વાંચે છે. બાઇટ્સ કોઈ જાણીતા ઇમેજ સિગ્નેચર સાથે મેળ ન ખાતા હોય અને SVG ટેક્સ્ટ જેવા પણ ન લાગતા હોય, તો ડિકોડર જણાવે છે કે સ્ટ્રિંગ ઇમેજ જણાતી નથી. તે ફોર્મેટનો અંદાજ લગાવતું નથી કે કોઈ ડિફૉલ્ટ પ્રકાર પર આધાર રાખતું નથી.

SVG અલગ રીતે સંભાળવામાં આવે છે, કારણ કે SVG બાઇનરી નહીં પરંતુ ટેક્સ્ટ ફોર્મેટ (XML) છે અને તેથી તેનું કોઈ નિશ્ચિત બાઇટ સિગ્નેચર નથી. ડિકોડર ડિકોડ કરેલા ટેક્સ્ટના પ્રથમ 1024 બાઇટ્સમાં <svg ટૅગ, તેના પછી <?xml version="1.0"?> જેવી XML ઘોષણા, અથવા તેના પછી SVG દસ્તાવેજ પ્રકારની ઘોષણા તપાસે છે. શરૂઆતમાં આવેલ બાઇટ ઓર્ડર માર્ક, જેને કેટલાક સંપાદકો UTF-8 ફાઇલોમાં ઉમેરે છે, અવગણવામાં આવે છે. SVGને બાઇટ સિગ્નેચરથી ઓળખી શકાતું ન હોવાથી, image/svg+xml જાહેર કરતું ડેટા URL જાહેર કરેલો પ્રકાર જ જાળવી રાખે છે.

Base64 ઇમેજના કદ માટેનું સૂત્ર

Base64 બાઇનરી ડેટાના દર 3 બાઇટને 4 ટેક્સ્ટ અક્ષરોમાં ફેરવે છે. એન્કોડ કરેલી લંબાઈનું સૂત્ર આ છે:

⌈ ⌉ ચિહ્નોનો અર્થ “આગલી પૂર્ણ સંખ્યા સુધી ઉપરની તરફ પૂર્ણાંક બનાવો” એવો થાય છે, કારણ કે base64 હંમેશાં 4 અક્ષરોના જૂથોમાં કામ કરે છે અને અધૂરા જૂથમાં = ચિહ્નો વડે પેડિંગ કરે છે.

મોટી ફાઇલો માટે કદમાં આશરે 33% વધારો થાય છે, કારણ કે 4 ÷ 3 ≈ 1.33. નાની ફાઇલોમાં ટકાવારીનો વધારો વધુ દેખાઈ શકે છે, કારણ કે શરૂઆતમાં ડેટા ઓછો હોય ત્યારે 4 અક્ષરોના આગલા જૂથ સુધી ઉપરની તરફ પૂર્ણાંક બનાવવાની અસર વધુ પડે છે.

ગણતરીનું ઉદાહરણ

ઉપરનું PNG ઉદાહરણ 85 બાઇટ ઇમેજ ડેટામાં ડિકોડ થાય છે. સૂત્રનો ઉપયોગ કરતાં:

Base64 સ્ટ્રિંગ ખરેખર 116 અક્ષરો જેટલી લાંબી છે, જે મેળ ખાય છે. મૂળ 85 બાઇટની સરખામણીમાં આ 36% નો વધારો છે (116 ÷ 85 ≈ 1.36), અને ફાઇલ ખૂબ નાની હોવાથી 33% આંકડા કરતાં થોડો વધારે છે.

સપોર્ટેડ ઇમેજ ફોર્મેટ

ડિકોડર ફોર્મેટ ઓળખવા માટે ડિકોડ કરેલા ડેટાના બાઇટ સિગ્નેચર વાંચે છે. તે આ પ્રકારોને ઓળખે છે:

Base64 ઇમેજ કેવી રીતે ડિકોડ કરવી

1. HTML, CSS, API પ્રતિભાવ અથવા ઇમેઇલમાંથી data:image/... પ્રીફિક્સ સાથે કે તેના વિના base64 સ્ટ્રિંગ કૉપી કરો.
2. તેને ઇનપુટ બૉક્સમાં પેસ્ટ કરો.
3. ટાઇપ કરવાનું બંધ કર્યા પછી થોડી ક્ષણમાં ઇમેજ આપમેળે ડિકોડ થાય છે અથવા ડિકોડ બટન દબાવી શકાય છે.
4. ડિકોડ કરેલી ઇમેજ પ્રિવ્યૂ વિસ્તારમાં દેખાય છે. તેનું ડેટા URL “Copy Image URL” બટનથી કૉપી કરી શકાય છે, અને પ્રિવ્યૂમાં ઇમેજ પર જમણું-ક્લિક કરીને તેને સાચવવાનો વિકલ્પ પસંદ કરવાથી ઇમેજ પોતે પણ સાચવી શકાય છે, કારણ કે તે બ્રાઉઝરમાં સામાન્ય ઇમેજ એલિમેન્ટ તરીકે રેન્ડર થાય છે.

Base64 ઇમેજના સામાન્ય ઉપયોગો

• HTML, CSS અથવા JavaScriptમાં એમ્બેડ કરવી: ઇમેજ ડેટા કોડમાં સીધો મૂકવાથી અલગ ફાઇલની વિનંતી ટાળી શકાય છે.
• ઇમેઇલ ટેમ્પલેટ: કેટલીક ઇમેઇલ ક્લાયન્ટ બાહ્ય રીતે લિંક કરેલી ઇમેજને ડિફૉલ્ટ રૂપે અવરોધે છે, પરંતુ એમ્બેડ કરેલી base64 ઇમેજ દેખાય છે.
• એક જ ફાઇલવાળા HTML સાધનો: ઇમેજ સહિત આખું પાનું એક જ સ્વયંસંપૂર્ણ ફાઇલ તરીકે મોકલી શકાય છે.
• API પ્રતિભાવો: ઇમેજને પોતાના અલગ એન્ડપોઇન્ટની જરૂરિયાત વિના JSON પેલોડમાં મોકલી શકાય છે.
• CSS બૅકગ્રાઉન્ડ અને આઇકન: નાના આઇકન ક્યારેક ડેટા URL તરીકે સ્ટાઇલશીટમાં સીધા લખવામાં આવે છે.

Base64 ઇમેજના લાભ-ગેરલાભ

Base64 એન્કોડિંગ સુવિધાજનક છે, પરંતુ તેની કિંમત છે:

• એન્કોડ કરેલું ટેક્સ્ટ મૂળ ફાઇલ કરતાં આશરે ત્રીજા ભાગ જેટલું મોટું હોય છે.
• બ્રાઉઝર એમ્બેડ કરેલી ઇમેજને લિંક કરેલી ફાઇલની જેમ કૅશ કરી શકતા નથી, તેથી આસપાસનું પાનું અથવા સ્ટાઇલશીટ જ્યારે પણ ડાઉનલોડ થાય ત્યારે ઇમેજ ફરી ડાઉનલોડ થાય છે.
• ઇમેજ દર્શાવતાં પહેલાં બ્રાઉઝરે base64 ટેક્સ્ટ ડિકોડ કરવું પડે છે, જેમાં થોડું વધારાનું પ્રોસેસિંગ લાગે છે.
• કદ વધે છે અને કૅશિંગ ગુમાય છે, તેથી base64 એમ્બેડિંગ આઇકન અને સરળ લોગો જેવી નાની ઇમેજ માટે યોગ્ય છે. મોટી તસવીરો સામાન્ય ઇમેજ ફાઇલ તરીકે આપવી સામાન્ય રીતે વધુ સારી રહે છે.

વારંવાર પૂછાતા પ્રશ્નો

base64 ઇમેજ ડિકોડર શું છે?

આ એવું સાધન છે, જે base64માં એન્કોડ કરેલી ટેક્સ્ટ સ્ટ્રિંગને PNG, JPEG, GIF, WebP, BMP અથવા SVG ફાઇલ જેવી જોઈ શકાય તેવી ઇમેજમાં ફેરવે છે.

Base64 ઇમેજ કેવી રીતે ડિકોડ કરું?

data:image/... પ્રીફિક્સ સાથે કે તેના વિના base64 સ્ટ્રિંગ ડિકોડરમાં પેસ્ટ કરો. તે સ્ટ્રિંગ વાંચશે, તેને ડિકોડ કરશે અને પરિણામની ઇમેજ બતાવશે.

શું ડેટા URL પ્રીફિક્સ વિના base64 સ્ટ્રિંગ ડિકોડ કરી શકાય?

હા. ડિકોડર તેને કાચા base64 ડેટા તરીકે ગણે છે, બાઇટ્સ ડિકોડ કરે છે અને PNG, JPEG, GIF, WebP, BMP અથવા ICO જેવા સિગ્નેચર પરથી ફોર્મેટ ઓળખવા માટે શરૂઆતના થોડા બાઇટ્સ વાંચે છે. ડિકોડ કરેલા ટેક્સ્ટમાં <svg ટૅગ શોધીને SVG ઓળખવામાં આવે છે. આમાંથી કોઈ પણ મેળ ન ખાય, તો ફોર્મેટનો અંદાજ લગાવવાને બદલે ડિકોડર જણાવે છે કે સ્ટ્રિંગ ઇમેજ જણાતી નથી.

મારી base64 ઇમેજ ડિકોડ કેમ થતી નથી?

મોટા ભાગના કિસ્સાઓમાં ત્રણ કારણો હોય છે. સ્ટ્રિંગમાં પ્રમાણભૂત base64 અક્ષરસમૂહની બહારના અક્ષરો હોઈ શકે છે, જેમાં A–Z, a–z, 0–9, +, / અને = આવે છે; કેટલીક વેબ ટોકનમાં વપરાતો base64url પ્રકાર તેના બદલે - અને _ લખે છે અને સ્વીકારવામાં આવતો નથી. સ્ટ્રિંગ અધવચ્ચે કપાઈ ગઈ હોઈ શકે છે, જેના કારણે તેની લંબાઈ ચારના ગુણાંક કરતાં એક વધારે બને છે; માન્ય base64 સ્ટ્રિંગમાં આવું ક્યારેય થતું નથી. અથવા બાઇટ્સ સપોર્ટેડ ઇમેજ ફોર્મેટમાંથી કોઈ એકના ન હોઈ શકે. માત્ર = પેડિંગ ન હોવું સમસ્યા નથી, અને ડિકોડિંગ પહેલાં સ્પેસ તથા પંક્તિના અંત દૂર કરવામાં આવે છે.

શું base64 એન્કોડિંગ સુરક્ષા અથવા એન્ક્રિપ્શનનો એક પ્રકાર છે?

ના. Base64 માત્ર બાઇટ્સને ટેક્સ્ટ તરીકે રજૂ કરવાની રીત છે; તે કંઈ છુપાવતું નથી. કોઈપણ વ્યક્તિ મફત સાધનથી થોડી સેકન્ડમાં base64 સ્ટ્રિંગ ડિકોડ કરી શકે છે, તેથી ખાનગી ઇમેજ અથવા અન્ય ડેટાને સુરક્ષિત રાખવા માટે તેનો ઉપયોગ ક્યારેય કરવો જોઈએ નહીં.

મૂળ ઇમેજ કરતાં base64 સ્ટ્રિંગ કેટલી મોટી હોય છે?

મોટી ફાઇલો માટે આશરે એક તૃતીયાંશ મોટી હોય છે, કારણ કે મૂળ ડેટાના દર 3 બાઇટને 4 ટેક્સ્ટ અક્ષરોમાં ફેરવવામાં આવે છે. 100 KBની ઇમેજ એન્કોડ થયા પછી આશરે 133 KBની બને છે. રાઉન્ડિંગને કારણે નાની ઇમેજમાં ટકાવારીનો વધારો થોડો વધુ દેખાઈ શકે છે.

ઇતિહાસ

Base64ની શરૂઆત 1970ના દાયકામાં અને 1980ના દાયકામાં વિકસાવાયેલી એવી એન્કોડિંગ પદ્ધતિઓમાંથી થઈ, જેનો ઉપયોગ માત્ર સાદા ટેક્સ્ટ સંભાળતી મેઇલ સિસ્ટમ દ્વારા બાઇનરી ડેટા મોકલવા માટે થતો હતો. ઇમેઇલ માટે તેને RFC 989 (1987) અને પછી RFC 1421માં ઔપચારિક બનાવવામાં આવ્યું. RFC 2397 (1998)માં data: URL યોજના નિર્ધારિત થયા પછી વેબ પેજમાં ઇમેજ એમ્બેડ કરવી શક્ય બની, અને અલગ HTTP વિનંતીઓ ઘટાડવાના માર્ગો શોધતા ડેવલપરને કારણે, ખાસ કરીને ધીમા મોબાઇલ કનેક્શન પર, 2000ના દાયકાના મધ્યમાં તેનો ઉપયોગ વધુ સામાન્ય બન્યો.

સંદર્ભસૂચિ

1. RFC 4648: Base16, Base32 અને Base64 ડેટા એન્કોડિંગ
2. RFC 2397: “data” URL યોજના
3. MDN Web Docs: ડેટા URL
4. WHATWG MIME સ્નિફિંગ સ્ટાન્ડર્ડ