Cocos Creator 动态加载远程图片资源

这个问题折腾了我一个下午，很难受，想通过客户端加载远程服务器中的用户头像图片。

var url = "http://localhost:8080/pic/10001.png";//图片路径
var container = this.user_photo.getComponent(cc.Sprite);//图片呈现位置
this.loadImg(container,url);

//动态加载图片的方法
loadImg: function(container,url){
    cc.loader.load(url, function (err, texture) {
        var sprite  = new cc.SpriteFrame(texture);
        container.spriteFrame = sprite;
    });
} ,

到这里还没有结束，获取图片资源的过程中，浏览器又抛出了“已拦截跨源请求：同源策略禁止读取位于http….的远程资源。（原因：CORS头缺少‘Access-Control-Allow-Origin’)。

由于测试时图片放到了tomcat的web服务器中，这时需要对tomcat进行配置。

1、下载 cors-filter-2.4.jar和 java-property-utils-1.9.1.jar ,放到tomcat的lib中。

2、在tomcat的web.xml中添加CorsFilter过滤器

<filter>
    <filter-name>CorsFilter</filter-name>
    <filter-class>com.thetransactioncompany.cors.CORSFilter</filter-class>
</filter>
<filter-mapping>
    <filter-name>CorsFilter</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>

3、重启Tomcat