பேஸ்64 படம் குறியாக்கி மற்றும் காட்சி | பேஸ்64 ஐ படங்களில் மாற்றவும்
பேஸ்64 குறியாக்கப்பட்ட படத்தின் சரங்களை உடனடியாக குறியாக்கவும் மற்றும் முன்னோட்டம் காணவும். தவறான உள்ளீடுகளுக்கு தவறுகளை கையாள்வதுடன் JPEG, PNG, GIF மற்றும் பிற பொதுவான வடிவங்களை ஆதரிக்கிறது.
பேச64 படம் மாற்றி
படத்தை பேச64 ஆக குறியாக்கம் செய்
இங்கே ஒரு படம் இழுக்கவும் அல்லது தேர்ந்தெடுக்க கிளிக் செய்யவும்
JPG, PNG, GIF, SVG ஆதரிக்கிறது
பேச64 ஐ படமாக மாற்று
ஆவணம்
Base64 படம் மாற்றி: படங்களை குறியாக்கவும் மற்றும் மீட்டெடுக்கவும்
அறிமுகம்
Base64 படம் மாற்றி என்பது படங்களை எளிதாக Base64 உரை வடிவத்திற்கு மாற்றவும், Base64 சரங்களை மீண்டும் காணக்கூடிய படங்களாக மீட்டெடுக்கவும் அனுமதிக்கும் பல்துறை ஆன்லைன் கருவியாகும். Base64 குறியாக்கம் என்பது பைனரி தரவுகளை ASCII உரை வடிவத்தில் பிரதிநிதித்துவப்படுத்தும் பைனரி-க்கு-உரை குறியாக்க திட்டமாகும், இது HTML, CSS, JavaScript, JSON மற்றும் பிற உரை அடிப்படையிலான வடிவங்களில் நேரடியாக புகைப்பட தரவுகளை இணைக்கக்கூடியதாக இருக்கிறது, அங்கு பைனரி தரவுகளை நேரடியாக சேர்க்க முடியாது.
இந்த இலவச கருவி இரண்டு முதன்மை செயல்பாடுகளை வழங்குகிறது:
- படத்தை Base64 ஆக: எந்த பட கோப்பையும் பதிவேற்றவும் மற்றும் உடனடியாக அதை Base64 குறியாக்கப்பட்ட சரமாக மாற்றவும்
- Base64 ஐ படமாக: ஒரு Base64 குறியாக்கப்பட்ட சரத்தை ஒட்டவும் மற்றும் முடிவில் உள்ள படத்தை காணவும் அல்லது பதிவிறக்கம் செய்யவும்
நீங்கள் உங்கள் குறியீட்டில் படங்களை இணைக்கும் வலை மேம்பாட்டாளர், தரவுப் URI களைப் பயன்படுத்துவது, அல்லது API க்களில் படம் தரவுகளை கையாள்வது என்றால், எங்கள் Base64 படம் மாற்றி ஒரு எளிமையான, திறமையான தீர்வு வழங்குகிறது, சுத்தமான இடைமுகம் மற்றும் உங்கள் மாற்றிய வெளியீட்டிற்கான நகலெடுக்க மற்றும் பதிவிறக்கம் செய்யும் விருப்பங்கள் போன்ற பயனுள்ள அம்சங்களுடன்.
Base64 படம் மாற்றம் எப்படி செயல்படுகிறது
Base64 குறியாக்கம் வடிவம்
Base64 குறியாக்கம் 64 ASCII எழுத்துக்களை (A-Z, a-z, 0-9, +, மற்றும் /) கொண்ட தொகுப்பாக பைனரி தரவுகளை மாற்றுகிறது, = பூர்த்திக்காகப் பயன்படுத்தப்படுகிறது. இணையத்தில் படங்களுக்கு, base64 தரவுகள் பொதுவாக பின்வரும் கட்டமைப்புடன் தரவுப் URL ஆக வடிவமைக்கப்படுகின்றன:
1data:[<media type>][;base64],<data>
2
எடுத்துக்காட்டாக, ஒரு base64-குறியாக்கப்பட்ட PNG படம் இதுபோல இருக்கலாம்:
1data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==
2
இந்த வடிவத்தின் கூறுகள்:
data:
- URL திட்டம்image/png
- தரவின் MIME வகை;base64
- குறியாக்க முறை,
- தலைப்பும் தரவுக்கும் இடையே உள்ள ஒரு பிரிப்பு- உண்மையான base64-குறியாக்கப்பட்ட தரவுகள்
படம் Base64 ஆக மாற்றும் செயல்முறை
ஒரு படத்தை Base64 ஆக மாற்றும்போது, பின்வரும் படிகள் நிகழ்கின்றன:
- படம் கோப்பு பைனரி தரவாக படிக்கப்படுகிறது
- பைனரி தரவுகள் Base64 அல்காரிதம் பயன்படுத்தி குறியாக்கப்படுகிறது
- படத்தின் வகையை அடையாளம் காண்க (MIME வகை) என்பதைக் குறிப்பிடுவதற்காக ஒரு தரவுப் URL முன்னணி சேர்க்கப்படுகிறது
- முடிவில் கிடைக்கும் சரம் HTML, CSS இல் நேரடியாகப் பயன்படுத்தப்படலாம், அல்லது தரவுத்தொகுப்பில் சேமிக்கலாம்
Base64 ஐ படம் மீட்டெடுக்கும் செயல்முறை
Base64 படம் சரத்தை மீட்டெடுக்கும்போது, பின்வரும் படிகள் நிகழ்கின்றன:
- சரம் தரவுப் URL முன்னணி உள்ளதா என்பதை அடையாளம் காணப்படுகிறது
- முன்னணி இருந்தால், படம் வடிவத்தை அடையாளம் காண்பதற்காக MIME வகை எடுக்கப்படுகிறது
- base64 தரவுப் பகுதி தனியாக்கப்படுகிறது மற்றும் பைனரி தரவாக மீட்டெடுக்கப்படுகிறது
- பைனரி தரவுகள் ஒரு Blob அல்லது ஒரு பொருள் URL ஆக மாற்றப்படுகிறது, இது ஒரு படமாகக் காணப்படலாம்
உள்ளீடு தரவுப் URL முன்னணி கொண்டதாக இல்லையெனில், குறியாக்கி அதை கச்சிதமான base64 தரவாகக் கருதிக்கொண்டு, குறியாக்கப்பட்ட பைனரி தலைப்பிலிருந்து படம் வகையை ஊகிக்க முயற்சிக்கிறது அல்லது PNG க்கு மாறுகிறது.
ஆதரிக்கப்படும் படம் வடிவங்கள்
எங்கள் Base64 படம் மாற்றி அனைத்து பொதுவான இணைய படம் வடிவங்களை ஆதரிக்கிறது:
வடிவம் | MIME வகை | வழக்கமான பயன்பாட்டு வழிகள் | அளவு திறன் |
---|---|---|---|
JPEG | image/jpeg | புகைப்படங்கள், நிறங்கள் நிறைந்த சிக்கலான படங்கள் | புகைப்படங்களுக்கு நல்ல பூர்த்தி |
PNG | image/png | வெளிப்படைத்தன்மை தேவைப்படும் படங்கள், திரைபடங்கள், கிராஃபிக்ஸ் | குறைந்த நிறங்களுடன் கிராஃபிக்ஸ் க்காக சிறந்தது |
GIF | image/gif | எளிய அனிமேஷன்கள், வரையறுக்கப்பட்ட நிறங்கள் உள்ள படங்கள் | அனிமேஷன்களுக்கு நல்லது, வரையறுக்கப்பட்ட நிறங்கள் |
WebP | image/webp | JPEG/PNG க்கான சிறந்த பூர்த்தி கொண்ட நவீன வடிவம் | சிறந்த பூர்த்தி, வளர்ந்து வரும் ஆதரவு |
SVG | image/svg+xml | வெக்டர் கிராஃபிக்ஸ், அளவிடக்கூடிய சின்னங்கள் மற்றும் விளக்கங்கள் | வெக்டர் கிராஃபிக்ஸ் க்காக மிகவும் சிறியது |
BMP | image/bmp | அசைவு பட வடிவம் | மோசம் (மிகவும் பெரிய கோப்பு அளவுகள்) |
ICO | image/x-icon | Favicon கோப்புகள் | மாறுபடுகிறது |
நடைமுறை பயன்பாட்டு வழிகள்
Base64 படம் மாற்றம் வலை மேம்பாட்டில் மற்றும் அதற்குப் பிற பல்வேறு பயன்பாடுகள் உள்ளன:
படம் Base64 குறியாக்கத்தை எப்போது பயன்படுத்த வேண்டும்
-
HTML/CSS/JS இல் படங்களை இணைத்தல்: உங்கள் குறியீட்டில் நேரடியாகப் படங்களை உள்ளடக்கியதால் HTTP கோரிக்கைகளை குறைக்கிறது, இது சிறிய படங்களுக்கு பக்கம் ஏற்றும் நேரத்தை மேம்படுத்தலாம்.
1 <!-- HTML இல் நேரடியாக base64 படம் இணைத்தல் -->
2 <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Base64 குறியாக்கப்பட்ட படம்">
3
-
மின்னஞ்சல் மாதிரிகள்: வெளிப்புற படங்களை இயல்பாகக் கட்டுப்படுத்தும் மின்னஞ்சல் கிளையன்ட்களில் படங்கள் சரியாகக் காணப்படுவதை உறுதி செய்கிறது.
-
ஒற்றை கோப்பு பயன்பாடுகள்: அனைத்து வளங்களும் ஒரே கோப்பில் உள்ளதுபோல உருவாக்குகிறது.
-
API பதில்கள்: தனிப்பட்ட பட தரவுகளை JSON பதில்களில் நேரடியாகச் சேர்க்கிறது.
-
CSS இல் தரவுப் URI கள்: சிறிய சின்னங்கள் மற்றும் பின்னணி படங்களை CSS கோப்புகளில் நேரடியாக உள்ளடக்குகிறது.
1 .icon {
2 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==');
3 }
4
-
Canvas கையாள்வுகள்: Canvas படம் தரவுகளை சேமிக்க மற்றும் மாற்றுவதற்கு உதவுகிறது.
-
ஆஃப்லைன் பயன்பாடுகள்: உள்ளடக்கமாக உள்ள படங்களை உள்ளமைவு அல்லது IndexedDB இல் உரை சரங்களாக சேமிக்கிறது.
Base64 ஐ படம் மீட்டெடுக்க எப்போது பயன்படுத்த வேண்டும்
-
இணைக்கப்பட்ட படங்களை மீட்டெடுக்க: HTML, CSS, அல்லது JS கோப்புகளிலிருந்து படங்களை மீட்டெடுக்கவும் சேமிக்கவும்.
-
API ஒருங்கிணைப்பு: API களிலிருந்து Base64 வடிவத்தில் பெறப்பட்ட படம் தரவுகளை செயல்படுத்தவும்.
-
பிழை திருத்தம்: Base64 படம் தரவுகளை காட்சிப்படுத்தவும் அதன் உள்ளடக்கம் மற்றும் வடிவத்தை உறுதிப்படுத்தவும்.
-
தரவுகளை மீட்டெடுக்க: தரவுத்தொகுப்புகள் அல்லது உரை கோப்புகளில் Base64 ஆக சேமிக்கப்பட்ட படங்களை மீட்டெடுக்கவும்.
-
கிளிப்போர்டு தரவுகளை மாற்றுவது: பல்வேறு மூலங்களில் நகலெடுக்கப்பட்ட Base64 படம் தரவுகளை செயல்படுத்தவும்.
அளவு மற்றும் செயல்திறன் கருத்துக்கள்
Base64 குறியாக்கம் வசதியை வழங்கினாலும், கவனிக்க வேண்டிய முக்கிய வரம்புகள் உள்ளன:
- அளவு அதிகரிப்பு: Base64 குறியாக்கம் மூலம் தரவின் அளவு சுமார் 33% அதிகரிக்கிறது.
- உலாவி காஷிங் இல்லை: இணைக்கப்பட்ட படங்கள் தனியாக காஷ் செய்ய முடியாது.
- பார்சிங் மேலோட்டம்: உலாவிகள் குறியாக்கப்பட்ட Base64 சரத்தை காட்சிப்படுத்துவதற்கு முன் குறியாக்கம் செய்ய வேண்டும்.
- பராமரிப்பு சிரமங்கள்: இணைக்கப்பட்ட படங்கள் குறியீட்டில் உள்ள கோப்புகளைப் போல புதுப்பிக்க கடினமாக இருக்கின்றன.
சிறந்த செயல்திறனுக்காக, Base64 குறியாக்கம் பொதுவாக சிறிய படங்களுக்கு (10KB க்குள்) பரிந்துரைக்கப்படுகிறது. பெரிய படங்கள் பொதுவாக தனி கோப்புகள் ஆகவே சிறந்ததாக இருக்கின்றன, அவை சரியாகக் காஷ் செய்யப்படலாம் மற்றும் மேம்படுத்தப்படலாம்.
கோப்பு அளவுக்கான வழிகாட்டிகள்
படம் அளவு (அசல்) | குறியாக்கப்பட்ட அளவு (சுமார்) | பரிந்துரை |
---|---|---|
5KB க்குள் | 7KB க்குள் | Base64 குறியாக்கத்திற்கு நல்ல வேட்பாளர் |
5KB - 10KB | 7KB - 14KB | முக்கியமான படங்களுக்கு Base64 ஐப் பரிசீலிக்கவும் |
10KB - 50KB | 14KB - 67KB | Base64 ஐ தேர்வு செய்யவும், செயல்திறன் தாக்கத்தை மதிப்பீடு செய்யவும் |
50KB க்கும் மேல் | 67KB க்கும் மேல் | Base64 ஐ தவிர்க்கவும், வெளிப்புற கோப்புகளைப் பயன்படுத்தவும் |
மாற்று அணுகுமுறைகள்
பல்வேறு பயன்பாடுகளுக்கான Base64 குறியாக்கத்திற்கு மாற்று அணுகுமுறைகள் உள்ளன:
-
SVG உள்ளமைவான இணைப்பு: வெக்டர் கிராஃபிக்ஸுக்கான SVG உள்ளமைவு Base64-குறியாக்கப்பட்ட SVG க்கும் மேலான செயல்திறனை வழங்குகிறது.
-
WebP மற்றும் நவீன படம் வடிவங்கள்: இவை Base64-குறியாக்கப்பட்ட JPEG/PNG க்கான சிறந்த பூர்த்தியை வழங்குகின்றன.
-
பட ஸ்பிரைடுகள்: பல சிறிய படங்களை ஒரு கோப்பில் இணைத்து CSS இடவெளி பயன்படுத்துதல்.
-
CDNs (உள்ளடக்க விநியோக நெட்வொர்க்கள்): உற்பத்தி தளங்களுக்கு, சிறந்த படங்களை CDN இல் வழங்குவது பெரும்பாலும் அதிக செயல்திறனை வழங்குகிறது.
-
தரவுகளைச் சுருக்கம்: பெரிய அளவிலான பைனரி தரவுகளை மாற்றுவதற்கு, gzip அல்லது Brotli போன்ற சிறப்பான சுருக்க அல்காரிதங்களை Base64 க்கு மேலான திறமையாகக் கருதலாம்.
-
HTTP/2 மற்றும் HTTP/3: இந்த நெறிமுறைகள் பல கோரிக்கைகளின் மேலோட்டத்தை குறைக்கின்றன, இது வெளிப்புற படம் குறியீடுகளை மேலும் திறமையாகக் கண்டுபிடிக்கிறது.
குறியீட்டு எடுத்துக்காட்டுகள்
Base64-குறியாக்கப்பட்ட படங்களுடன் பல்வேறு நிரல் மொழிகளில் வேலை செய்வதற்கான எடுத்துக்காட்டுகள் இங்கே உள்ளன:
JavaScript (உலாவி)
1// ஒரு படத்தை Base64 ஆக மாற்றவும்
2function imageToBase64(imgElement) {
3 const canvas = document.createElement('canvas');
4 canvas.width = imgElement.width;
5 canvas.height = imgElement.height;
6
7 const ctx = canvas.getContext('2d');
8 ctx.drawImage(imgElement, 0, 0);
9
10 // தரவுப் URL (Base64 சரம்) ஆகப் பெறவும்
11 return canvas.toDataURL('image/png');
12}
13
14// கோப்பு உள்ளீட்டை Base64 ஆக மாற்றவும்
15function fileToBase64(fileInput, callback) {
16 const reader = new FileReader();
17 reader.onload = function(e) {
18 callback(e.target.result);
19 };
20 reader.readAsDataURL(fileInput.files[0]);
21}
22
23// Base64 படத்தை காட்சிப்படுத்தவும்
24function displayBase64Image(base64String) {
25 const img = new Image();
26
27 // தரவுப் URL முன்னணி இல்லாத சரங்களை கையாளவும்
28 if (!base64String.startsWith('data:')) {
29 base64String = `data:image/png;base64,${base64String}`;
30 }
31
32 img.src = base64String;
33 document.body.appendChild(img);
34}
35
36// Base64 படத்தை பதிவிறக்கம் செய்யவும்
37function downloadBase64Image(base64String, fileName = 'image.png') {
38 const link = document.createElement('a');
39 link.href = base64String;
40 link.download = fileName;
41 link.click();
42}
43
Python
1import base64
2from PIL import Image
3from io import BytesIO
4
5# ஒரு படம் கோப்பைப் Base64 ஆக மாற்றவும்
6def image_to_base64(image_path):
7 with open(image_path, "rb") as image_file:
8 encoded_string = base64.b64encode(image_file.read())
9 return encoded_string.decode('utf-8')
10
11# Base64 ஐ படம் ஆக மாற்றவும் மற்றும் சேமிக்கவும்
12def base64_to_image(base64_string, output_path):
13 # தரவுப் URL முன்னணி இருந்தால் அகற்றவும்
14 if ',' in base64_string:
15 base64_string = base64_string.split(',')[1]
16
17 image_data = base64.b64decode(base64_string)
18 image = Image.open(BytesIO(image_data))
19 image.save(output_path)
20
21# எடுத்துக்காட்டு பயன்பாடு
22base64_str = image_to_base64("input.jpg")
23print(f"data:image/jpeg;base64,{base64_str[:30]}...") # சரத்தின் தொடக்கத்தை அச்சிடவும்
24
25base64_to_image(base64_str, "output.jpg")
26
PHP
1<?php
2// PHP இல் ஒரு படம் கோப்பைப் Base64 ஆக மாற்றவும்
3function imageToBase64($path) {
4 $type = pathinfo($path, PATHINFO_EXTENSION);
5 $data = file_get_contents($path);
6 return 'data:image/' . $type . ';base64,' . base64_encode($data);
7}
8
9// Base64 ஐ படம் ஆக மாற்றவும் மற்றும் சேமிக்கவும்
10function base64ToImage($base64String, $outputPath) {
11 // தரவுப் URL முன்னணி இருந்தால் அகற்றவும்
12 $imageData = explode(',', $base64String);
13 $imageData = isset($imageData[1]) ? $imageData[1] : $imageData[0];
14
15 // குறியாக்கம் செய்து சேமிக்கவும்
16 $data = base64_decode($imageData);
17 file_put_contents($outputPath, $data);
18}
19
20// எடுத்துக்காட்டு பயன்பாடு
21$base64Image = imageToBase64('input.jpg');
22echo substr($base64Image, 0, 50) . "...\n"; // சரத்தின் தொடக்கத்தை அச்சிடவும்
23
24base64ToImage($base64Image, 'output.jpg');
25?>
26
Java
1import java.io.File;
2import java.io.FileOutputStream;
3import java.io.IOException;
4import java.nio.file.Files;
5import java.util.Base64;
6
7public class Base64ImageUtil {
8
9 // ஒரு படம் கோப்பைப் Base64 ஆக மாற்றவும்
10 public static String imageToBase64(String imagePath) throws IOException {
11 File file = new File(imagePath);
12 byte[] fileContent = Files.readAllBytes(file.toPath());
13 String extension = imagePath.substring(imagePath.lastIndexOf(".") + 1);
14 String base64String = Base64.getEncoder().encodeToString(fileContent);
15
16 return "data:image/" + extension + ";base64," + base64String;
17 }
18
19 // Base64 ஐ படம் ஆக மாற்றவும் மற்றும் சேமிக்கவும்
20 public static void base64ToImage(String base64String, String outputPath) throws IOException {
21 // தரவுப் URL முன்னணி இருந்தால் அகற்றவும்
22 if (base64String.contains(",")) {
23 base64String = base64String.split(",")[1];
24 }
25
26 byte[] decodedBytes = Base64.getDecoder().decode(base64String);
27
28 try (FileOutputStream fos = new FileOutputStream(outputPath)) {
29 fos.write(decodedBytes);
30 }
31 }
32
33 public static void main(String[] args) throws IOException {
34 String base64Image = imageToBase64("input.jpg");
35 System.out.println(base64Image.substring(0, 50) + "..."); // சரத்தின் தொடக்கத்தை அச்சிடவும்
36
37 base64ToImage(base64Image, "output.jpg");
38 }
39}
40
C#
1using System;
2using System.IO;
3using System.Text.RegularExpressions;
4
5class Base64ImageConverter
6{
7 // ஒரு படம் கோப்பைப் Base64 ஆக மாற்றவும்
8 public static string ImageToBase64(string imagePath)
9 {
10 byte[] imageBytes = File.ReadAllBytes(imagePath);
11 string base64String = Convert.ToBase64String(imageBytes);
12
13 string extension = Path.GetExtension(imagePath).TrimStart('.').ToLower();
14 return $"data:image/{extension};base64,{base64String}";
15 }
16
17 // Base64 ஐ படம் ஆக மாற்றவும் மற்றும் சேமிக்கவும்
18 public static void Base64ToImage(string base64String, string outputPath)
19 {
20 // தரவுப் URL முன்னணி இருந்தால் அகற்றவும்
21 if (base64String.Contains(","))
22 {
23 base64String = base64String.Split(',')[1];
24 }
25
26 byte[] imageBytes = Convert.FromBase64String(base64String);
27 File.WriteAllBytes(outputPath, imageBytes);
28 }
29
30 static void Main()
31 {
32 string base64Image = ImageToBase64("input.jpg");
33 Console.WriteLine(base64Image.Substring(0, 50) + "..."); // சரத்தின் தொடக்கத்தை அச்சிடவும்
34
35 Base64ToImage(base64Image, "output.jpg");
36 }
37}
38
உலாவி பொருத்தம்
Base64 படம் மாற்றி கருவி அனைத்து நவீன உலாவிகளில் செயல்படுகிறது, பின்வரும் பொருத்தம் கருத்துக்களை உட்படுத்துகிறது:
உலாவி | Base64 ஆதரவு | தரவுப் URL ஆதரவு | கோப்பு API ஆதரவு |
---|---|---|---|
Chrome | முழு | முழு | முழு |
Firefox | முழு | முழு | முழு |
Safari | முழு | முழு | முழு |
Edge | முழு | முழு | முழு |
Opera | முழு | முழு | முழு |
IE 11 | பகுதி | வரம்பு (அதிகபட்ச URL நீளம்) | பகுதி |
மொபைல் ஆதரவு
இந்த கருவி முழுமையாக பதிலளிக்கும் மற்றும் மொபைல் உலாவிகளில் செயல்படுகிறது, பின்வரும் கருத்துக்களை உட்படுத்துகிறது:
- கோப்பு அளவுக்கான வரம்புகள்: மொபைல் சாதனங்கள் மிகப்பெரிய படங்களை கையாளும் போது நினைவக கட்டுப்பாடுகள் இருக்கலாம்
- செயல்திறன்: பெரிய படங்களை குறியாக்கம்/மீட்டெடுக்கும்போது மொபைல் சாதனங்களில் மெதுவாக இருக்கலாம்
- பதிவிறக்கம் செய்யும் விருப்பங்கள்: சில மொபைல் உலாவிகள் பதிவிறக்கம் செய்யும் முறைகளை மேசை உலாவிகளைவிட வேறுபட்ட முறையில் கையாள்கின்றன
பொதுவான சிக்கல்கள் மற்றும் தீர்வுகள்
படங்களை Base64 ஆக மாற்றும் போது
-
பெரிய கோப்பு அளவு: உங்கள் Base64 வெளியீடு மிகவும் பெரியதாக இருந்தால், பரிசீலிக்கவும்:
- படத்தை சிறிய பரிமாணங்களுக்கு மறுபரிசீலனை செய்யவும்
- குறியாக்கத்திற்கு முன் படத்தை சுருக்கம் செய்யவும்
- அதிக திறனுள்ள வடிவத்தை (WebP JPEG/PNG க்கு பதிலாக) தேர்ந்தெடுக்கவும்
-
வடிவம் பொருத்தம்: சில படம் வடிவங்கள் Base64-குறியாக்கப்பட்ட போது அனைத்து உலாவிகளில் ஆதரிக்கப்படmay. JPEG, PNG, மற்றும் SVG க்கு அதிகபட்ச பொருத்தத்திற்காக Stick.
-
செயல்திறன் தாக்கம்: Base64 படங்களை இணைத்த பிறகு பக்கம் செயல்திறன் குறைகிறதெனில், பரிசீலிக்கவும்:
- பெரிய படங்களுக்கு வெளிப்புற கோப்புகளைப் பயன்படுத்தவும்
- முக்கியமான மேலே உள்ள படங்களுக்கு Base64 குறியாக்கத்தை மட்டுமே பயன்படுத்தவும்
- குறியீட்டில் உள்ள படங்களை சுருக்கம் செய்யவும்
Base64 ஐ படம் மீட்டெடுக்கும்போது
-
செல்லுபடியாகாத Base64 தரவுகள்: நீங்கள் குறியாக்கத்தை மீட்டெடுக்கும்போது பிழைகள் கிடைத்தால்:
- Base64 சரத்தில் வரி இடைவெளிகள் அல்லது இடைவெளிகள் உள்ளதா என்பதை உறுதி செய்யவும்
- சரம் செல்லுபடியாகும் Base64 எழுத்துக்கள் (A-Z, a-z, 0-9, +, /, =) மட்டுமே உள்ளதா என்பதை சரிபார்க்கவும்
- தரவுப் URL முன்னணி (உள்ளது என்றால்) சரியாக வடிவமைக்கப்பட்டுள்ளதா என்பதை உறுதி செய்யவும்
-
படம் காட்சியளிக்கவில்லை: மீட்டெடுக்கப்பட்ட படம் தோன்றவில்லை என்றால்:
- தரவுப் URL இல் உள்ள MIME வகை உண்மையான படம் வடிவத்துடன் பொருந்துகிறதா என்பதைச் சரிபார்க்கவும்
- Base64 தரவுகள் குறுக்கீடு செய்யப்படவில்லை என்பதை உறுதி செய்யவும்
- கச்சிதமான Base64 பயன்படுத்தும் போது தெளிவாக தரவுப் URL முன்னணி சேர்க்கவும்
அடிக்கடி கேட்கப்படும் கேள்விகள்
பொதுவான கேள்விகள்
Q: Base64 குறியாக்கம் என்ன, படங்களுக்கு இதைப் பயன்படுத்துவது ஏன்?
A: Base64 குறியாக்கம் என்பது பைனரி தரவுகளை ASCII உரை வடிவத்தில் மாற்றும் ஒரு முறை. இது படங்களை HTML, CSS, அல்லது JavaScript இல் நேரடியாக இணைக்க உதவுகிறது, இது HTTP கோரிக்கைகளை குறைத்து சிறிய படங்களுக்கு பக்கம் ஏற்றும் செயல்திறனை மேம்படுத்தலாம்.
Q: நான் மாற்ற முடியுமா என்பதற்கான படங்களுக்கு அளவுக்கான வரம்பு என்ன?
A: எங்கள் கருவி பல்வேறு அளவிலான படங்களை கையாளலாம், ஆனால் 5MB க்குள் உள்ள படங்களை பரிந்துரைக்கிறோம். Base64 குறியாக்கம் சுமார் 33% அளவைக் அதிகரிக்கிறது, எனவே 5MB படம் சுமார் 6.7MB Base64 உரையாக மாறும்.
Q: Base64 குறியாக்கம் என் படங்களை சுருக்கம்செய்யுமா?
A: இல்லை, Base64 குறியாக்கம் தரவின் அளவைக் சுமார் 33% அதிகரிக்கிறது. இது ஒரு மாற்று முறை, சுருக்கம் அல்காரிதம் அல்ல. குறியாக்கத்திற்கு முன் உங்கள் படங்களைச் சுருக்கம் செய்ய வேண்டும்.
படம் Base64 குறியாக்கம் கேள்விகள்
Q: நான் Base64 ஆக மாற்றக்கூடிய படம் வடிவங்கள் என்ன?
A: எங்கள் கருவி JPEG, PNG, GIF, WebP, SVG, BMP, மற்றும் ICO கோப்புகளை உள்ளடக்கிய அனைத்து பொதுவான இணைய படம் வடிவங்களை ஆதரிக்கிறது.
Q: நான் குறியாக்கப்பட்ட Base64 வெளியீட்டை என் குறியீட்டில் எப்படி பயன்படுத்தலாம்?
A: நீங்கள் Base64 வெளியீட்டை நேரடியாக HTML <img>
குறிச்சொற்களில், CSS background-image
பண்புகளில், அல்லது JavaScript இல் தரவாகப் பயன்படுத்தலாம். HTML க்கான வடிவம்: <img src="data:image/jpeg;base64,YOUR_BASE64_STRING">
.
Q: Base64 அல்லது வழக்கமான படம் கோப்புகளைப் பயன்படுத்துவது எது சிறந்தது?
A: சிறிய படங்களுக்கு (10KB க்குள்) Base64 HTTP கோரிக்கைகளை குறைத்து செயல்திறனை மேம்படுத்தலாம். பெரிய படங்களுக்கு, வழக்கமான படம் கோப்புகள் அதிகமாக காஷ் செய்யப்படலாம் மற்றும் உங்கள் HTML/CSS கோப்பின் அளவைக் குறைக்காது.
Base64 ஐ படம் மீட்டெடுக்க கேள்விகள்
Q: நான் எந்த Base64 சரத்தைப் படமாக மாற்ற முடியுமா?
A: வெறும் Base64 சரங்கள் மட்டுமே காணக்கூடிய படங்களாக மாற்றப்படலாம். கருவி படம் வடிவத்தை அடையாளம் காண முயற்சிக்கும், ஆனால் சிறந்த முடிவுகளுக்காக தரவுப் URL முன்னணி (எடுத்துக்காட்டாக, data:image/png;base64,
) உள்ள சரங்களைப் பயன்படுத்தவும்.
Q: நான் செல்லுபடியாகாத Base64 தரவை மீட்டெடுக்க முயற்சிக்கும்போது என்ன ஆகும்?
A: Base64 சரம் செல்லுபடியாகாதது அல்லது படம் தரவாக பிரதிநிதித்துவப்படுத்தப்படாதது என்றால், கருவி பிழை செய்தியை காண்பிக்கும்.
Q: நான் மீட்டெடுக்கப்பட்ட படத்தைத் திருத்த முடியுமா?
A: எங்கள் கருவி மாற்றம் மற்றும் திருத்தம் செய்யும் அம்சங்களை உள்ளடக்கவில்லை. மீட்டெடுக்கப்பட்ட படத்தை எந்த படம் திருத்தும் மென்பொருளுடன் திருத்தலாம்.
பாதுகாப்பு மற்றும் தனியுரிமை
எங்கள் Base64 படம் மாற்றி கருவி உங்கள் உலாவியில் நேரடியாக அனைத்து தரவுகளை செயலாக்குகிறது. இதன் பொருள்:
- உங்கள் படங்கள் மற்றும் Base64 தரவுகள் உங்கள் கணினியிலிருந்து வெளியே செல்லவில்லை
- எங்கள் சேவைகளுக்கு எந்த தரவுகளும் அனுப்பப்படவில்லை
- உங்கள் மாற்றங்கள் தனிப்பட்ட மற்றும் பாதுகாப்பாக உள்ளன
- பக்கம் ஏற்றும் போது (பக்கம் ஏற்றிய பிறகு) ஆஃப்லைனில் கூட கருவி செயல்படுகிறது
Base64 பயன்பாட்டிற்கான திறமைகள்
-
மாற்றுவதற்கு முன் சுருக்கம் செய்யவும்: உங்கள் படங்களை Base64 ஆக மாற்றுவதற்கு முன் சுருக்கம் மற்றும் மறுபரிசீலனை செய்யவும், குறியாக்கப்பட்ட அளவை குறைக்கவும்.
-
சரியான வடிவங்களைப் பயன்படுத்தவும்: உள்ளடக்கத்தின் அடிப்படையில் சரியான படம் வடிவத்தை தேர்ந்தெடுக்கவும்:
- புகைப்படங்களுக்கு JPEG
- வெளிப்படைத்தன்மை தேவைப்படும் படங்களுக்கு PNG
- வெக்டர் கிராஃபிக்ஸ் மற்றும் சின்னங்களுக்கு SVG
-
காஷிங் விளைவுகளைப் பரிசீலிக்கவும்: Base64-குறியாக்கப்பட்ட படங்கள் உலாவிகளில் தனியாக காஷ் செய்ய முடியாது, வெளிப்புற படம் கோப்புகளைப் போல.
-
செயல்திறன் தாக்கத்தை சோதிக்கவும்: Base64 படங்களை உள்ளடக்கிய பிறகு பக்கம் ஏற்றும் நேரத்தை அளவீடு செய்யவும், நீங்கள் உண்மையில் செயல்திறனை மேம்படுத்துகிறீர்களா என்பதை உறுதி செய்யவும்.
-
தரவுப் URL முன்னணிகளைப் பயன்படுத்தவும்: அதிகபட்ச பொருத்தத்திற்காக எப்பொழுதும் சரியான தரவுப் URL முன்னணியை (எடுத்துக்காட்டாக,
data:image/png;base64,
) சேர்க்கவும். -
மற்ற தொழில்நுட்பங்களுடன் இணைக்கவும்: Base64 ஐ மாறுபட்ட தொழில்நுட்பங்களுடன் இணைக்கவும், எவ்வாறு சுருக்கமான படங்களைச் சேர்க்கலாம்.
Base64 குறியாக்கத்தின் வரலாறு
Base64 குறியாக்கம் 1970-ஆம் ஆண்டுகளில் மின்னஞ்சல் அமைப்புகள் உருவாக்குவதில் அதன் அடிப்படையைப் பெற்றது. இது ASCII உரை மட்டுமே கையாளும் அமைப்புகளின் மூலம் பைனரி தரவுகளை அனுப்புவதற்கான சிக்கல்களைத் தீர்க்க வடிவமைக்கப்பட்டது.
இந்த குறியாக்க திட்டம் 1987 இல் RFC 989 இல் வெளியிடப்பட்டது, இது தனியுரிமை மேம்படுத்தப்பட்ட மின்னஞ்சல் (PEM) தரவுத்தொகுப்பை வரையறுத்தது. பின்னர் இது RFC 1421 மற்றும் பிற தொடர்புடைய தரவுத்தொகுப்புகளில் புதுப்பிக்கப்பட்டது. "base64" என்ற சொல் பைனரி தரவுகளை பிரதிநிதித்துவப்படுத்துவதற்காக 64 வெவ்வேறு ASCII எழுத்துக்களைப் பயன்படுத்துவதிலிருந்து வந்தது.
இணைய மேம்பாட்டில் Base64 குறியாக்கம் படங்கள் ஏற்றுமதி செய்யும் போது, தரவுப் URI களின் வருகை 1998 இல் RFC 2397 இல் முதலில் பரிந்துரைக்கப்பட்டது. இது HTML, CSS மற்றும் பிற இணைய ஆவணங்களில் நேரடியாக பைனரி தரவுகளை உள்ளடக்க அனுமதித்தது.
2000-ஆம் ஆண்டுகளின் மத்தியில் Base64-குறியாக்கப்பட்ட படங்களை வலை மேம்பாட்டில் பயன்படுத்துவது பெரிதும் பரவலாகியது, ஏனெனில் மேம்பாட்டாளர்கள் HTTP கோரிக்கைகளை குறைத்து செயல்திறனை மேம்படுத்துவதற்கான வழிகளைத் தேடியனர். மொபைல் வலை மேம்பாட்டின் வளர்ச்சியுடன், HTTP கோரிக்கைகளை குறைக்கவும் மொபைல் இணைப்புகளில் செயல்திறனை மேம்படுத்தவும் Base64-குறியாக்கம் முக்கியமாக ஏற்றுக்கொள்ளப்பட்டது.
இன்று, Base64 குறியாக்கம் வலை மேம்பாட்டில் ஒரு முக்கிய கருவியாக உள்ளது, ஆனால் அதன் பயன்பாடு அதிகமாக குறிக்கோளாக மாறியுள்ளது, ஏனெனில் சிறந்த நடைமுறைகள் வளர்ந்துள்ளன. நவீன அணுகுமுறைகள் பொதுவாக Base64 குறியாக்கத்தை முக்கியமான, சிறிய படங்களுக்கு மட்டுமே பயன்படுத்துகின்றன, மேலும் பெரிய சொத்துகளை வழங்குவதற்கான மேலும் திறமையான முறைகளைப் பயன்படுத்துகின்றன.
மேற்கோள்கள்
- RFC 4648: The Base16, Base32, and Base64 Data Encodings
- RFC 2397: The "data" URL scheme
- MDN Web Docs: data URIs
- CSS-Tricks: Data URIs
- Can I Use: Data URIs
- Web Performance: When to Base64 Encode Images (and When Not To)
- HTTP Archive: State of Images
- Web.dev: Image Optimization
இப்போது எங்கள் Base64 படம் மாற்றியை முயற்சிக்கவும், உங்கள் படங்களை Base64 ஆக விரைவாக குறியாக்கிக்கொள்ளவும் அல்லது Base64 சரங்களை மீண்டும் காணக்கூடிய படங்களாக மீட்டெடுக்கவும். எங்கள் எளிதான இடைமுகத்துடன், நீங்கள் முடிவுகளை நகலெடுக்கவும் அல்லது ஒரே கிளிக்கில் பதிவிறக்கம் செய்யலாம்!
தொடர்புடைய கருவிகள்
உங்கள் பணிப்பாக்கிலுக்கு பயனுள்ள மேலும் பயனுள்ள கருவிகளைக் கண்டறியவும்