相关疑难解决方法(0)

JS:如何将image.png编码为base64代码进行数据URI嵌入?

我有几个不同维度的.png位图,例如./img/dog.png./img/cat.png.如何base64通过JS 加载我的图像的字符串?我的预期数据是那样的(但更长):

 data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAB9AAAAfQCAYAAACaOMR5AAAgAElEQ…ECBAgQIECAAAECBAgQIECAAAECBAgQIECAAAECBAicCwy83crEe3e04AAAAABJRU5ErkJggg==
Run Code Online (Sandbox Code Playgroud)

注意:我希望找回这个字符串,这是我的文件,只是我的文件,没有剪裁,也没有更大.然后我将它嵌入到SVG <image>元素中:

<image href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAB9AYAAACaOMR5AAAgAElyuiRTYUdG
EQVR4XuydB5RdZfW3nZlk0gukk4QUQiCQEEil994RFBCkigpir4j+7V2xgygiIIgggoBUQTqkQIAACQktCamk90m
yfc8492u1/PdqSlMwslaWTNz7zlv2W/d+7f3b5e8r4H/fvzjH+/3pS996akGvva+b37zm4d27Nhx5Wc+85mxNb3r
7xhtvdFi3bl1VWVnZ2ptuumldVVXVIS+88MLAo4466tlPfOIT459//vmOe+2115L61E07D1i2bFmL7373uw/V5/n
GPEOfSs8666zmq1atasa/dbvvvvva73znOwffeOONp5SXl1e89NJLX37xxRfb3HHHHatbtmy5//XXX3/yRz7ykds
+//nPP92Y+nzntddea8+PNchi/Qc/+MHKb33rW4d84xvfeMR62rdvXzl+/Ph1yKjZzjvvvMZnly5duvquu+46sHX
r1mtow7pDDjnk5aFDh64s1F/Czw3+/tvf/nakMq5Pu1555ZW29HXFF7/4xWNffvnl/s2bN6/s1q3bwj/84Q+3xhh
6EMfOmf58uVtqb/9+vXrmz399NPftey33367Ve/evVc7Hxjnqu23336l9X7qU5866Ve/+tWdH/7whz80e/bs7vvo
t9+LyLXlxz72sYfWrl274Z133qlq165dyT//+c8D7r333gN22GGHOdQ1as6cOfvy/Y4DBgy4AXncMWPGDGHsdfgW
...
...
...
vf/nakMq5Pu1555ZW29HXFF7/4xdfgvf/nakMq5Pu1sfgW29HXFF7/4xW">
</image>
Run Code Online (Sandbox Code Playgroud)

我的最终项目看起来会像那样:)

在此输入图像描述

另请参阅:https://rugger-demast.codio.io/front/_location_map-en-wikiatlas.html,您可以在其中下载SVG,但png目前只是一个链接,不会下载.

javascript base64 uri image jqxhr

3
推荐指数
1
解决办法
8516
查看次数

标签 统计

base64 ×1

image ×1

javascript ×1

jqxhr ×1

uri ×1