# GLTF Loader Issue: Invalid typed array length 4

**URL:** <https://discourse.threejs.org/t/gltf-loader-issue-invalid-typed-array-length-4/13442>\
**Category:** Questions\
**Tags:** loaders\
**Created:** [March 11, 2020, 10:09pm UTC](https://discourse.threejs.org/t/gltf-loader-issue-invalid-typed-array-length-4/13442 "2020-03-11T22:09:40Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![jeremy](https://avatars.discourse-cdn.com/v4/letter/j/82dd89/32.png) [@jeremy](https://discourse.threejs.org/u/jeremy)\
**Post date:** [March 11, 2020, 10:09pm UTC](https://discourse.threejs.org/t/gltf-loader-issue-invalid-typed-array-length-4/13442/1 "2020-03-11T22:09:40Z")

</div>

Hey guys,

I’ve been building a front-end with vue which pings an API acting as a model server.

This has been working fine up until I added authorization to the API and for whatever reason i’m getting the error below when I try to load a model based of the api url.

> RangeError: Invalid typed array length: 4  
> at new Uint8Array ()  
> at GLTFLoader.parse (GLTFLoader.js?34ad:187)  
> at Object.eval [as onLoad] (GLTFLoader.js?34ad:144)  
> at XMLHttpRequest.eval (three.module.js?5a89:35704)

I have pinged the api using the same url and authorization token and the model returns fine. I also checked the model at [glTF Validator](http://github.khronos.org/glTF-Validator/) and it comes up as valid. The model is attached.

On the front end, this is the code i’m using to load the model:

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/f/f8aaec9eab6df5af57b22f01d6c092dfd9ea719c.png)

Can’t figure out why i’m getting the error on the loader, any help appreciated.

Model download: [response2.glb](https://discourse.threejs.org/uploads/short-url/p6w9KOEwxCmnADyxtqF6SF3rtdi.glb) (148.6 KB)

---

<div class="post-metadata">

**Author:** ![jeremy](https://avatars.discourse-cdn.com/v4/letter/j/82dd89/32.png) [@jeremy](https://discourse.threejs.org/u/jeremy)\
**Post date:** [March 11, 2020, 11:09pm UTC](https://discourse.threejs.org/t/gltf-loader-issue-invalid-typed-array-length-4/13442/2 "2020-03-11T23:09:49Z")

</div>

I"m guessing it is because i need to add in authorization token to url get request used by loader. Does anyone know of way to add header to gltf loader?

---

<div class="post-metadata">

**Author:** ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)\
**Post date:** [March 12, 2020, 12:08am UTC](https://discourse.threejs.org/t/gltf-loader-issue-invalid-typed-array-length-4/13442/3 "2020-03-12T00:08:34Z")

</div>

For now I think you would have to fetch the `.glb` first — either [using FileLoader](https://github.com/mrdoob/three.js/issues/10609) or with your JS HTTP request method of choice — and then pass the ArrayBuffer into GLTFLoader’s `loader.parse(...)` method.

An unfinished proposal for a one-step method is in [https://github.com/mrdoob/three.js/pull/18662](https://github.com/mrdoob/three.js/pull/18662).

---

<div class="post-metadata">

**Author:** ![jeremy](https://avatars.discourse-cdn.com/v4/letter/j/82dd89/32.png) [@jeremy](https://discourse.threejs.org/u/jeremy)\
**Post date:** [March 12, 2020, 1:15am UTC](https://discourse.threejs.org/t/gltf-loader-issue-invalid-typed-array-length-4/13442/4 "2020-03-12T01:15:27Z")

</div>

Thanks for the suggestion don.

I tried setting up http request and passing response to the parse method as suggestion. I get the error “Unexpected token g in JSON at position 0” when I try to do so which I’ve had an issue with before. Seems to happen when it trys to load from gltf string rather than glb directly from url.

Good to know headers will be included with r115, hopefully that will resolve a few issues.

thanks again.

---

<div class="post-metadata">

**Author:** ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)\
**Post date:** [March 12, 2020, 2:24am UTC](https://discourse.threejs.org/t/gltf-loader-issue-invalid-typed-array-length-4/13442/5 "2020-03-12T02:24:50Z")

</div>

> [@jeremy](#):
>
> I get the error “Unexpected token g in JSON at position 0

This data shouldn’t be JSON, so something sounds wrong here… for example try:

```js
fetch(url, {credentials: 'include', headers: {...}})
  .then((response) => response.arrayBuffer())
  .then((arrayBuffer) => {
    loader.parse(arrayBuffer, '', (gltf) => { ... });
  });

```

> Good to know headers will be included with r115, hopefully that will resolve a few issues.

Hopefully it makes it into r115, but it could be a few releases out too.

---

<div class="post-metadata">

**Author:** ![jeremy](https://avatars.discourse-cdn.com/v4/letter/j/82dd89/32.png) [@jeremy](https://discourse.threejs.org/u/jeremy)\
**Post date:** [March 12, 2020, 3:06am UTC](https://discourse.threejs.org/t/gltf-loader-issue-invalid-typed-array-length-4/13442/6 "2020-03-12T03:06:55Z")

</div>

I’ve tried what you suggested but getting arrayBuffer is not a method based on:

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/b/bf46369f05a95093acfcaa699f25b019c525b818.png)

here’s the response data i’m getting too:

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/0/091130486013dac0bb13904126ed4b3f18c81641.png)

As i said in original post. If I remove authorisation and add url directly into GLFTloader.load, it works just fine. The api is return a .glb.

thanks again mate

---

<div class="post-metadata">

**Author:** ![jeremy](https://avatars.discourse-cdn.com/v4/letter/j/82dd89/32.png) [@jeremy](https://discourse.threejs.org/u/jeremy)\
**Post date:** [March 12, 2020, 5:37am UTC](https://discourse.threejs.org/t/gltf-loader-issue-invalid-typed-array-length-4/13442/7 "2020-03-12T05:37:03Z")

</div>

Thanks again for your help mate. The issue was with getting arraybuffer from response data while using axios… Seems i’m not the only one with the issue [https://github.com/axios/axios/issues/1392](https://github.com/axios/axios/issues/1392)

I switched to fetch api and now works a charm 👍