![]() I encountered this real-world example recently while building a feature for the Ionifits demo app. ![]() What about reversing the conversion, from a blob to a base64 string? Unfortunately, this is a bit more complicated (though if you know of a better approach, let me know in the comments!). Bonus: Converting a blob to a base64 string ![]() That’s it! From here, you can upload it to a server, display it on the screen, and more. Next, convert the response to a blob: const blob = await base64Response.blob() For example, a JPEG image: const base64Response = await fetch(`data:image/jpeg base64,$`) Easy as one, twoįirst, pass a base64 string to fetch: const base64Data = "aGV5IHRoZXJl" ĭepending on the format of the base64 string, you might need to prepend content type data. As it turns out, it can convert data into more than just JSON, it can also return array buffers, form data, and blobs. It’s a powerful feature built into all web browsers that is commonly used to fetch resources across the network, like making HTTP requests to your backend APIs.įetch returns a Response object. Fortunately, there’s an easier, modern approach available thanks to the Fetch API. What do you do?Īccording to various solutions around the Internet, conversion appears to be complex. However, the available API accepts the image in blob format only. Suppose you have an image in string format that needs to be uploaded to a server. A blob represents binary data in the form of files, such as images or video. One such example is converting a base64 string to a blob using JavaScript. However, using them correctly and effectively can be confusing. Web browsers provide a variety of data primitives that web developers use to manage, manipulate, and store data – from plain text, to files, images, videos and more.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |