图片的本地存储和读取问题

Creator 2.x
#1

游戏中在线加载一张图片（比如玩家头像），想保存在本地，并为这张图片生成一个唯一ID或MD5，下次启动的时候，就可以从本地读取数据生成对应的精灵。
目前只想到用cc.sys.localStorage实现，但是它只能存取字符串，这就涉及到图片跟字符串的互转难题。
不知道各位大神有没有可行的办法::confused:

3赞
#2

图片可以用 base64 字符串来存储，但是非常不建议用 localStorage 存储这种数据，因为它的设计不适合这么做。

建议不要在本地保存任何大尺寸数据，存储在服务器上更适合。

2赞
#3

存储在本地主要是为了节省带宽，以及提高加载速度，增强游戏体验。

#4

除了localStorage ，有没有别的方式存储在本地

#5

浏览器本身是有缓存的，只要 url 保持不变，其实并不会每次加载都下载所有内容，个人觉得过于极端的优化意义不大

#6

如果是浏览器端的话，的确问题不大，然而原生平台上，我记得应该是没有缓存的吧。:joy_cat:
想这么极端的优化，一方面是因为项目功能需要，支持玩家间聊天互传图片，而且项目会发布到原生平台；
另一方面是个人的强迫症:sweat_smile:，能做的更好的就会尽力去实现……

#7

本地存储完全没问题

loadNative = function(url, callback){
    var dirpath =  jsb.fileUtils.getWritablePath() + 'img/';
    var filepath = dirpath + MD5(url) + '.png';

    function loadEnd(){
        cc.loader.load(filepath, function(err, tex){
            if( err ){
                cc.error(err);
            }else{
                var spriteFrame = new cc.SpriteFrame(tex);
                if( spriteFrame ){
                    spriteFrame.retain();
                    callback(spriteFrame);
                }
            }
        });

    }

    if( jsb.fileUtils.isFileExist(filepath) ){
        cc.log('Remote is find' + filepath);
        loadEnd();
        return;
    }

    var saveFile = function(data){
        if( typeof data !== 'undefined' ){
            if( !jsb.fileUtils.isDirectoryExist(dirpath) ){
                jsb.fileUtils.createDirectory(dirpath);
            }

            if( jsb.fileUtils.writeDataToFile(  new Uint8Array(data) , filepath) ){
                cc.log('Remote write file succeed.');
                loadEnd();
            }else{
                cc.log('Remote write file failed.');
            }
        }else{
            cc.log('Remote download file failed.');
        }
    };
    
    var xhr = new XMLHttpRequest();

    xhr.onreadystatechange = function () {
        cc.log("xhr.readyState  " +xhr.readyState);
        cc.log("xhr.status  " +xhr.status);
        if (xhr.readyState === 4 ) {
            if(xhr.status === 200){
                xhr.responseType = 'arraybuffer';
                saveFile(xhr.response);
            }else{
                saveFile(null);
            }
        }
    }.bind(this);
    xhr.open("GET", url, true);
    xhr.send();
};
22赞
#8

真心赞！:blush:
请你吃:hamburger::watermelon::poultry_leg:

#9

您解决了吗？我现在也遇到这个问题。要把远程的图片保存到本地文件，方便下次读取

#10

你好，我用你这个方法，提示失败Remote write file failed，是怎么个情况呢。

#11

你好，我在js代码中发现jsb.fileUtils的函数都没有实现，是什么情况？

QQ图片20160827125031.png582×1017 49.1 KB

#12

看了这段注释，有点明白了。
/**

  • ATTENTION: USE jsb.fileUtils INSTEAD OF jsb.FileUtils.
  • jsb.fileUtils is the native file utils’ singleton object,
  • please refer to Cocos2d-x’s API to know how to use it.
  • Only available in JSB
  • @class
  • @name jsb.fileUtils
  • @extend cc._Class
    /
    jsb.fileUtils = /    * @lends jsb.fileUtils# */{
#13

确保你下载的文件是正确的，当然也可能和某些机型有关。

#14

为什么我的提示 Uncaught ReferenceError: jsb is not defined

#15

你可能用浏览器运行的，Web环境下没有jsb

#16

非常感谢！方案可行，解决了大问题!

#17

非常感谢，方案可行，解决了大问题

#18

jsb能做web上用？

#19

能设置想要的图的分辨率么 保存到本地的图的分辨率不高 有什么办法解决么

#20

用本地存储做图片存储确实不明智，其实使用云服务的图床效果也不差，也不贵，还带鉴黄功能