{"record":{"id":"b50a266dd6aaaeb7","repo":"airbnb/lottie-web","slug":"canvas-worker-renderer-cannot-load-animation-from","errorCode":null,"errorMessage":"Canvas worker renderer cannot load animation from url","messagePattern":"Canvas worker renderer cannot load animation from url","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"player/js/animation/AnimationItemWorkerOverride.js","lineNumber":48,"sourceCode":"        || params.loop === undefined\n        || params.loop === true) {\n    this.loop = true;\n  } else if (params.loop === false) {\n    this.loop = false;\n  } else {\n    this.loop = parseInt(params.loop, 10);\n  }\n  this.autoplay = 'autoplay' in params ? params.autoplay : true;\n  this.name = params.name ? params.name : '';\n  this.autoloadSegments = Object.prototype.hasOwnProperty.call(params, 'autoloadSegments') ? params.autoloadSegments : true;\n  this.assetsPath = null;\n  if (params.animationData) {\n    dataManager.completeAnimation(\n      params.animationData,\n      this.configAnimation\n    );\n  } else if (params.path) {\n    throw new Error('Canvas worker renderer cannot load animation from url');\n  }\n};\n\nAnimationItem.prototype.setData = function () {\n  throw new Error('Cannot set data on wrapper for canvas worker renderer');\n};\n\nAnimationItem.prototype.includeLayers = function (data) {\n  if (data.op > this.animationData.op) {\n    this.animationData.op = data.op;\n    this.totalFrames = Math.floor(data.op - this.animationData.ip);\n  }\n  var layers = this.animationData.layers;\n  var i;\n  var len = layers.length;\n  var newLayers = data.layers;\n  var j;\n  var jLen = newLayers.length;","sourceCodeStart":30,"sourceCodeEnd":66,"githubUrl":"https://github.com/airbnb/lottie-web/blob/bede03d25d232826e0c9dca1733d542d8a7754fb/player/js/animation/AnimationItemWorkerOverride.js#L30-L66","documentation":"Thrown by the worker variant of setParams when params.animationData is absent but params.path is present. The worker build has no XHR/fetch path for fetching animation JSON (the worker context here only consumes an already-parsed animationData object). Passing a URL is treated as a programmer error rather than silently failing.","triggerScenarios":"Calling lottie.loadAnimation({ path: 'data.json', renderer: 'canvas' }) with the worker build; passing a path instead of pre-loaded animationData in a worker context; reusing a main-thread config object (which uses path) unchanged inside a worker.","commonSituations":"Migrating to lottie_canvas_worker.js and assuming the path-based loader still works; sending a path string to a worker via postMessage and calling loadAnimation with it; SSR/test setups that rely on path loading.","solutions":["Fetch/parse the JSON on the main thread and pass it as animationData: lottie.loadAnimation({ renderer: 'canvas', animationData: parsedJson }).","If you must drive from a URL, fetch() the JSON yourself (on main thread or in the worker) and hand the parsed object to loadAnimation.","Send the parsed animationData to the worker through postMessage and call loadAnimation with it there."],"exampleFix":"// before (worker build)\nlottie.loadAnimation({ renderer: 'canvas', path: 'anim/data.json' });\n// after\nconst res = await fetch('anim/data.json');\nconst animationData = await res.json();\nlottie.loadAnimation({ renderer: 'canvas', animationData });","handlingStrategy":"validation","validationCode":"function loadInWorker(lottie, params) {\n  if (!params.animationData && params.path) {\n    throw new Error('Worker build needs animationData, not path. Fetch the JSON first.');\n  }\n  return lottie.loadAnimation(params);\n}\n// usage: fetch first, then pass the parsed object\nfetch(params.path).then(r => r.json()).then(data =>\n  loadInWorker(lottie, Object.assign({}, params, { animationData: data, path: undefined }))\n);","typeGuard":"function hasAnimationDataForWorker(params) {\n  const isWorker = (typeof WorkerGlobalScope !== 'undefined') || (typeof document === 'undefined');\n  return !isWorker || (params.animationData != null && !params.path);\n}","tryCatchPattern":null,"preventionTips":["Never pass path to loadAnimation in a worker build; resolve the JSON to an object first.","Standardize on passing animationData everywhere so worker and main-thread code paths agree.","When posting to a worker, transfer the parsed animationData, not the URL."],"tags":["lottie","web-worker","network","animation-data","configuration"],"backgroundTag":null,"analyzedSha":"bede03d25d232826e0c9dca1733d542d8a7754fb","analyzedAt":"2026-08-13T05:40:22.197Z","schemaVersion":2},"datasetVersion":"2026-08-13T09:17:06.757Z"}