Conflict with Deezer API

Questions
,
1

I want to use ThreeJS together with Deezer API, but after loading this script:

https://e-cdn-files.dzcdn.net/js/min/dz.js

I can’t load any model. Getting this error:

loading error: SyntaxError: Unexpected token 'o', "[object Rea"... is not valid JSON
    at JSON.parse (<anonymous>)
    at GLTFLoader.parse (GLTFLoader.js:344:1)
    at Object.eval [as onLoad] (GLTFLoader.js:239:1)
    at eval (three.module.js:43612:1)
2

Check the network tab in the javascript console to see what file your GLTFLoader is loading, IF the Deezer API is responsible for the issue then you’ll probably see that the file is being loaded from the worng URL.

3

Thank you, I checked the network tab and it the glb model URL is correct. I assume if the problem was at URL, the error could be different, something like “not found”

4

Was it working before you added in the Deezer script?

The error message means you’re getting a result but it’s not a proper GLTF file, what does it look like in the network tab? In the headers, the content type should be model/gltf-binary, and looking at the Response tab could also give you a clue.

GLTFresponse
GLTFresponse753×314 78.5 KB

5

Yes, you’re right!

The content type is application/octet-stream

Is there a way to fix that?

6

I also have checked other version, without Deezer and there is same content type: application/octet-stream and it works fine. How is that possible?

Here you can check working version and here is deezer version

7

Huh the response tab shows the same data on both.

So there are two options:

  • either your code with the Deezer script also does something else that is responsible for the issue
  • or the Deezer script is fully responsible

If it’s the latter option, then I’d file a bug report if possible. And if you want to try fixing it yourself, I’d start by using a modified version of GLTF Loader, where you log whatever arguments are passed to GLTFLoader.parse() and then work from there.

8

I’m fairly certain that the responsibility lies with Deezer’s script because the code related to music is isolated from the ThreeJS code. The only aspect causing disruption is the dz.js.

I would like to send a bug report, but since this is not open-source, that’s not an option. However, they do have a contact for security issues.

What I’m planning to try is loading the Deezer script after the ThreeJS model has already loaded.

9

@athur loading deezer api after threejs solved the poblem… until user proceeds to the next page with threejs :smiley:

We also modified the GLTF Loader file as you suggest, that was relatively easy - but then we got bigger problem with Draco Loader and this issue we couldn’t solve.

Here we reproduced the issue (click open in new window, to check the console log)