"Could not load `xy.hdr`" errors

[hood]

Latest React/drei versions, getting Could not load dikhololo/dikhololo_night_1k.hdr errors breaking my app at runtime. Despite me never mentioning/consuming such asset explicitly in my code, I'm noticing outgoing (failing) HTTP calls to retrieve an asset at https://market-assets.fra1.cdn.digitaloceanspaces.com/market-assets/hdris/dikhololo/dikhololo_night_1k.hdr.

On a simplified level, I'm consuming the library in the following way:

<Canvas
  gl={{ preserveDrawingBuffer: true }}
  shadows
  dpr={[1, 4]}
  camera={{ position: [90, 100, 150], fov: 50 }}
>
  <Suspense fallback={null}>
    <Stage intensity={0.1} shadows adjustCamera>
      <Model />
    </Stage>
  </Suspense>
  <OrbitControls autoRotate />
</Canvas>

With <Model /> looking like:

const MODEL_PATH = '/ligma.gltf';

useGLTF.preload(MODEL_PATH);

const Model = () => {
  const { nodes, materials } = useGLTF(MODEL_PATH);

  return (
    <group dispose={null} scale={1.2}>
      <mesh
        castShadow
        receiveShadow
        geometry={nodes.group826633725.geometry}
        material={materials.mat21}
      />
    </group>
  )
}

My guess is that the HDRI map is being consumed by <Stage /> implicitly.

[tarasyarema]

Happening to me too.

[bnbon]

I also get a similar error;

Could not load potsdamer-platz/potsdamer_platz_1k.hdr: Failed to fetch

This is the URL its trying to load;

https://market-assets.fra1.cdn.digitaloceanspaces.com/market-assets/hdris/potsdamer-platz/potsdamer_platz_1k.hdr

I would imagine its connected, but is there an easy way to host these files independently?

[bnbon]

It appears to be fixed if I update to the very latest 9.77.1 from 9.65.5 but I didn't see that marked as old versions were not supported anymore?

I added an ErrorBoundary to prevent this being so damaging in future, but I still this needs investigated or explained...

[tarasyarema]

Yes, thank you very much for the response. I indeed updated the package and it resolved the issue :)

[hood]

I updated to 9.77.0 a few hours earlier, but it doesn't seem to go away.

[drcmda]

I updated to 9.77.0 a few hours earlier, but it doesn't seem to go away.

what's the url it wants to fetch the hdr from? the old CDN broke down, we moved to another and a drei update must fix it. if you still see the same url it didn't apply the update.

but CDNs are fragile, we are thinking of base64 inlining these assets. using https://github.com/pmndrs/assets

[hood]

I updated to 9.77.0 a few hours earlier, but it doesn't seem to go away.

what's the url it wants to fetch the hdr from? the old CDN broke down, we moved to another and a drei update must fix it. if you still see the same url it didn't apply the update.

but CDNs are fragile, we are thinking of base64 inlining these assets. using https://github.com/pmndrs/assets

The URL for the (failing) asset request is https://market-assets.fra1.cdn.digitaloceanspaces.com/market-assets/hdris/dikhololo/dikhololo_night_1k.hdr, the error I’m getting is: [Error] Failed to load resource: An SSL error has occurred and a secure connection to the server cannot be made. (dikhololo_night_1k.hdr, line 0)

Anyway is there any way for us to avoid automatically consuming those assets? In my case I’m trying to display a really low poly, small sized 3d disc-shaped object, so I don’t think I need a ~20mb hdri map at all for this use-case.

[drcmda]

that's the old url, you are not on drei latest.

the new one is https://raw.githack.com/pmndrs/drei-assets/456060a26bbeb8fdf79326f224b6d99b8bcce736/hdri/

object, so I don’t think I need a ~20mb hdri map at a

they are 1-2mb, the pmndrs/assets hrdi's are 100-200kb. but you can make your own env

<Environment>
  <Lightformer position={[x, y, z]} form="ring" />
</Environment>

[bnbon]

I think it makes sense to bundle the apps so you dont have a dependency on a CDN, its unlikely a user will have loaded those assets from the same CDN for another purpose, so that kinda renders the CDN almost pointless.

Also reduces risk for those using it, and 200kb from a CDN or from the host isnt going to really impair the experience.

+1 for base64 and inlining.

[hood]

that's the old url, you are not on drei latest.

the new one is https://raw.githack.com/pmndrs/drei-assets/456060a26bbeb8fdf79326f224b6d99b8bcce736/hdri/

object, so I don’t think I need a ~20mb hdri map at a

they are 1-2mb, the pmndrs/assets hrdi's are 100-200kb. but you can make your own env

<Environment>
  <Lightformer position={[x, y, z]} form="ring" />
</Environment>

Using Environment > Lightformer the way you suggested causes me type errors on Lightformer:

Type '{ position: number[]; form: string; }' is missing the following properties
 from type 'Pick<Omit<ExtendedColors<Overwrite<THREE.Mesh<THREE.BufferGeometry, any>, NodeProps<THREE.Mesh<THREE.BufferGeometry, any>, any>>>, NonFunctionKeys<{ position?: any; up?: any; scale?: any; rotation?: any; matrix?: any; quaternion?: any; layers?: any; dispose?: () => void; }>> & { ...; } & EventHandlers & { ...; }, "a...’:
 material, geometry, castShadow, receiveShadow, and 70 more.ts(2740)

I’m on version 9.77.4

[drcmda]

might just be a typescript issue, the thing in itself works https://codesandbox.io/s/lwo219

[lttkachenko]

The same issue, no CDN, files a fetched from my local dev project's public folder (Next.JS project). The error is super-strange: No error message, just stack from webpack. drei-latest(v.9.88.17).

[github-actions[bot]]

Thank you for contributing! We’re marking this issue as stale as a gentle reminder to revisit it and give it the attention it needs to move forward.

Any activity, like adding an update or comment, will automatically remove the stale label so it stays on our radar.

Feel free to reach out on Discord if you need support or feedback from the community. This issue will close automatically soon if there’s no further activity. Thank you for understanding and for being part of the project!