search

chrisben / imgcache.js

JS library based on the File API to cache images for offline recovery (target: cordova/phonegap & chrome)
Other
826 stars 216 forks source link

cache for background images not working with error messages if I use linear-gradient #181

Closed almothafar closed 7 years ago

almothafar commented 7 years ago

I'm using the linear-gradient() with background-image the problem is I get a lot of error messages in the console, and seems cache not working as well.

.image-bg { background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.60)), url('img-url-here') center center no-repeat; }

not sure if there is another properties for this, but currently I have with linear-gradient, I get the following prints in the console: 

INFO: Background image URL: rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(/api/image/2
imgcache.js:468 GET http://localhost:8100/rgba(0,%200,%200,%200.6),%20rgba(0,%200,%200,%200.6)),%20url(/api/image/2 404 (Not Found)Private.FileTransferWrapper.download @ imgcache.js:468ImgCache.cacheFile @ imgcache.js:640ImgCache.cacheBackground @ imgcache.js:838(anonymous function) @ ionic-img-cache.js:113(anonymous function) @ imgcache.js:820(anonymous function) @ imgcache.js:710
imgcache.js:46 ERROR: Image rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(/api/image/2 could not be downloaded - status: 404
imgcache.js:46 ERROR: Download error source: rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(/api/image/2
imgcache.js:46 ERROR: Download error target: /ionic-img-cache/9d04e5c7c904a9f0de5ecd3e4809340bd5c42a60.2
imgcache.js:46 ERROR: Download error code: 0
vitaliy-bobrov commented 7 years ago

I think the issue is in RegExp that parses background-image property to get image url in Private.getBackgroundImageURL - var regexp = /\((.+)\)/;

I've created PR to fix this RegExp to take only url https://github.com/chrisben/imgcache.js/pull/182

chrisben commented 7 years ago

@vitaliy-bobrov is right, it's a bug with the background image url parser. I've merged his fix.

Thanks to you guys!