Unable to Load 3D Models from Private Speckle Projects: Auth Token Issue

Help Developers
,
1

Hi everyone,

I’m building Spleckle demo WebApp but encountering an issue with fetching 3D models from my private Speckle projects in my Viewer. While everything works fine for projects with public access, I cannot load models from private projects. I always receive the following console error:

client.js:575 Viewer: no auth token present. Requests to non-public stream objects will fail.

Here’s the code and configuration that I have so far, along with the specific steps I’ve tried to resolve the issue:

Current Configuration:

Viewer Initialization:

I’m setting up the Speckle 3D viewer in the initViewer() method as follows:

async initViewer() {
  try {
    const container = document.getElementById('viewer')
    const params = DefaultViewerParams
    params.showStats = true
    params.verbose = true
    params.authToken = this.$store.state.speckleToken // Trying to pass the token here

    this.viewer = new Viewer(container, params)
    await this.viewer.init()

    this.viewer.createExtension(CameraController)
    this.viewer.createExtension(SelectionExtension)

    const objectUrl = `${this.$config.speckleServerUrl}/projects/${projectId}/models/${latestVersion.referencedObject}`

    const authToken = this.$store.state.speckleToken // Getting the auth token from Vuex

    // Attempt 1: Trying to pass auth token using UrlHelper
    const urls = await UrlHelper.getResourceUrls(objectUrl, authToken)
    for (const url of urls) {
      const loader = new SpeckleLoader(this.viewer.getWorldTree(), url, '')
      loader.authToken = authToken // Trying to assign the token here

      // Loading the Speckle object
      await this.viewer.loadObject(loader, true)
    }
  } catch (error) {
    console.error('Error in initViewer:', error)
    this.error = `Failed to load the 3D viewer: ${error.message}`
  }
}

Steps I’ve Tried So Far:

  1. Passing the auth token directly in the viewer parameters:
params.authToken = this.$store.state.speckleToken

I attempted to include the auth token directly in the viewer initialization parameters, but I still get the error Viewer: no auth token present.

  1. Setting the auth token with UrlHelper**:**
2

Hi @Rodrigo_Medina

Both UrlHelper and SpeckleLoader need an auth token to be passed in. SpeckleLoader takes the auth token as it’s third argument. This means that you’d have to do something like

const urls = await UrlHelper.getResourceUrls(objectUrl, authToken)
for (const url of urls) {
  const loader = new SpeckleLoader(this.viewer.getWorldTree(), url, authToken)
  // Loading the Speckle object
  await this.viewer.loadObject(loader, true)
}

I’ve checked and indeed this information is missing from the viewer docs. Thanks for pointing this out! We’ll be sure to add this missing information in!

Cheers

1 Like
3

Hi Alex thanks so much!! that was the issue. It was the last thing I was missing to try.
Now I can load my 3d models that are under my private projects.

1 Like