记一个JS获取base64编码地址图片传到后台时无法识别的坑
事情是这样的，前端一个DIV用了属性加上图片背景，比如
<div class="posterbox" style="background-image: url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/4gIoSUNDX1BST0ZJTEUAAQEAAAIYAAAAAAQwAABtbnRyUkdCIFhZWiAAAAAAAAAAAAAAAABhY3NwAAAAAAAhIQg//2Q=="); background-position: center center; background-size: cover;"></div>中间一长串的base64编码我就省略不写了
下面用JS来获取这串base64数值
// 获取元素的属性值
var img_base64 = $('.posterbox').css('background-image');
// console.log(img_base64); 显示：url("data:image/jpeg;base64,/9j/4AXXXXXX==")
// split分割取出上面属性中url()中间的base64
img_base64 = img_base64.split('(')[1].split(')')[0];到此时img_base64变量就是这个base64的字符串，POST到后台，发现不是有效的base64字符串无法转储为图片。查看提交的数据，确实是包含此base64字符串的，同时打印出后端所接收到的字符串和前端一致，是合法完整的base64编码：
查了很多百度的资料，说是base64编码在post过程中部分符号会被转义，前端要先urlencode，后端再decode。试过无效。
最后发现，原因竟然是在前端提交控制台所显示的base64字符串前后双引号""，不是代表这是字符串类型，而是真的有这个符号提交到后端。而后端var_dump()打印字符串的时候刚好也带有这个符号，看上去是相同的，这就是最坑的地方……
把双引号去掉，修改上述取url()中间base64部分的代码为：
img_base64 = img_base64.split('("')[1].split('")')[0];最后再次提交，base64字符串没有双引号了，问题解决！
之前在取img标签src为base64字符串的图片地址时无此问题，因为直接获取元素src的地址就可以了，没有双引号问题，这个url()地址是有双引号的，浪费我2个小时时间，我是真的是会谢。
