Data URI scheme(与上传图片有关)

2017-03-18  本文已影响0人  EdisonDong

Data URI scheme是一种协议,允许用一种既定格式的字符串表示图片(实际上,我在这里的说法并不是十分准确,但是对于图片来说,说法比较确切),这意味着,以前在浏览器中表示图片,src可以用字符串表示。

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJAQMAAADaX5RTAAAAA3NCSVQICAjb4U/gAAAABlBMVEX///+ZmZmOUEqyAAAAAnRSTlMA/1uRIrUAAAAJcEhZcwAACusAAArrAYKLDVoAAAAWdEVYdENyZWF0aW9uIFRpbWUAMDkvMjAvMTIGkKG+AAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAAB1JREFUCJljONjA8LiBoZyBwY6BQQZMAtlAkYMNAF1fBs/zPvcnAAAAAElFTkSuQmCC" />

现代浏览器对data URI scheme支持非常好,我们可以利用这个特性做实现图片的无刷新上传,具体的方法是:
图片用uri scheme格式表示->上传字符串->后台对字符串解码->保存到文件中。
我们来看一个具体的例子:

function img_type($str){
    if(preg_match('/data:image\/(.+)/i',$str,$arr)){
        return $arr[1];
    }else{
        return false;
    }
}
function base64_to_img($base64){
    if(($index = stripos($base64,'base64,')) > -1){
        $content = substr($base64,$index + 7);
        $content = base64_decode($content);
        $type = img_type(substr($base64,0));
        $file_name = uniqid().'.'.$type;
        if(file_put_contents($file_name,$content)){
            return $file_name;
        }else{
            trigger_error('Write file fail!');
        }
    }else{
        trigger_error('Not Image!');
    }
}

更多请参考这里

上一篇下一篇

猜你喜欢

热点阅读