Questions tagged [data-uri]

A data URI is a URL whose scheme part is 'data:' and which directly represents a resource, rather than the location of a resource.

The following is an example of a data URI:

data:text/html;base64,PCFkb2N0eXBlIGh0bWw+CjxodG1sPgogIDxoZWFkPg
ogICAgPG1ldGEgY2hhcnNldD11dGYtOD4KICAgIDx0aXRsZT5UaGVyZSBpcyBuby
BzcG9vbi48L3RpdGxlPgogICAgPHN0eWxlPgogICAgICBodG1sIHsgYmFja2dyb3
VuZDogI2ZhNTsgaGVpZ2h0OiAxMDAlIH0KICAgICAgcCB7IGNvbG9yOiAjNWFmOy
B0ZXh0LWFsaWduOiBjZW50ZXI7IG1hcmdpbjogNmVtOyBmb250LXNpemU6IDJlbS
B9CiAgICA8L3N0eWxlPgogIDwvaGVhZD4KICA8Ym9keT4KICAgIDxwPjxhIGhyZW
Y9aHR0cDovL3N0YWNrb3ZlcmZsb3cuY29tL3RhZ3MvZGF0YS11cmkvaW5mbz5CYW
NrPC9hPjwvcD4KICA8L2JvZHk+CjwvaHRtbD4K

That data URI contains a HTML document. If pasted into the address bar of a compliant browser, the document it contains will be displayed without the need to request any external resources.

Data URIs can be used in the href or src attributes of <a> and <img> elements, etc., eliminating the need for additional HTTP requests.

592 questions
-1
votes
1 answer

Can we add some additional information in a file?

I want a file to carry some additional information like a Id of a record. Can we add some additional metadata or anything in a file? Can we add some additional byte stream which do not corrupt the file? Please help me. Thanks
ashishcloud
  • 267
  • 3
  • 16
-1
votes
2 answers

How to find out the image source used in a background image data?

I found out on a website an image which I like very much but when I inspected the source code with firebug i found out that it was not an image, but a div with the following CSS condition: background-image:…
paulalexandru
  • 9,218
  • 7
  • 66
  • 94
-1
votes
1 answer

How can I refer to a Data URI in https?

.bg-img { background-image:url(data:image/png;base64,iVBORw0KGgoAAAA... etc ); } How can I refer to that image with an https prefix? When I go to the CSS that's how I see it. Normally when you have an image src you can do the following:…
ariel
  • 2,962
  • 7
  • 27
  • 31
-2
votes
1 answer

Image paths are getting converted to data URI instead of URL

I have a basic React app set up using the Create-React-App tool. I have an images in my images folder: /src/img/logo.png I am including it in one of my component JS files (let's say it's located at /src/Login.js) like this: import logo from…
Cog
  • 1,545
  • 2
  • 15
  • 27
-2
votes
1 answer

Why 2 identical images have different dataUrls?

I have 2 images both generated via javascript canvas. I want to check if both images are identical. For this I generated a set of images and saved them as png files. I then tried to compare the dataUrls of both, the previously generated image and…
Fuzzyma
  • 7,619
  • 6
  • 28
  • 60
-3
votes
1 answer

How to optimize and serve images in the best format in html?

I have some sort of confusion between the below image formats and html tags. Next-gen image format via and (uses webp and jpeg image) Using data:image/png;base64,blahblahblah (uses svg image) Can you please suggest me the best way. Using…
-3
votes
2 answers

Is it possible to merge Data URIs in JavaScript?

I have an array of Data URIs (PNG Image) and also have an array of their dimension information. Is it possible to merge two data uris into one image? How? I tried Googling for the answer, but can't find a working example. EDIT: Here is a sample…
Shahid Thaika
  • 2,133
  • 5
  • 23
  • 59
1 2 3
39
40