Girder javascript client


I have some confusion between different options for girder web clients and servers. Here is my findings and questions:

  • external-web-clients documentation
    • is it the entry point for girder web client solutions ?
    • is it up to date ?
  • girder :
    • no npm documentation
    • no UMD module
    • Works with girder 2.5. Does it work with girder 3 ?
    • no need for window :slight_smile:
  • @girder/core :
    • no npm documentation
    • no UMD module
    • works with girder 3. Does it work with girder 2 ?
    • requires a defined window
  • @girder/components:
    • no npm documentation
    • with UMD module :slight_smile:
    • Works with girder 3. Does it work with girder 2 ?
    • requires a defined window
  • js-girder-client:
    • obsolete ?
    • with UMD module :slight_smile:
    • Works with girder 2.5 (does it work with girder 3?)
    • no need for “window” :slight_smile:
  • paraviewweb:
    • no UMD module
    • I did not tested
    • no need for “window” ?
    • Works with girder 2.5 (does it work with girder 3?)

Did I miss other clients ?

Indeed, I have a nodejs server (paraviewweb related) and I would like to query a girder server.
What is your recommended way to fix the “window is not defined” error to get @girder/core and @girder/components working ?

As of now, the simplest solution working out of the box is for me:

npm install js-girder-client
node .\node_modules\js-girder-client\bin\girder-cli.js --command login my-login my-password

I would love some getting started examples…

p.s. please bear with my poor JS skills :slight_smile:

Your confusion is understandable. The answer really depends on what you are looking to do with a javascript client. Here is a gentle introduction to what some of these packages are.

  • girder: This is the main Girder application source code for pre 3.0. Modern Girder includes all the JS sources inside the python package. This isn’t really designed to be used in downstream projects.
  • @girder/core: This contains the components that make up the Girder application without the build system and testing infrastructure. If you are just looking to include a widget from Girder into a custom application this would be what you want.
  • @girder/components: This is a Vue replacement of the old Backbone client. You could understand it as the new version of @girder/core. It is being developed parallel to Girder 3, but will work just fine with a Girder 2.x server.

I don’t know much about the other packages.

If what you are looking for is just a way to interact with a Girder API server through javascript, you can try looking at rest.js from girder_web_components. It is just a thin authentication layer on top of axios. With an axios instance, you can perform REST requests directly to Girder’s API just as you would with python’s “requests” library.

Hopefully this helps. Maybe if you can describe what you want to do, we can offer some more targeted advice.

Thanks Jonathan for your answer.

Is girder_web_components the same as @girder/components ? (-> there is no github link on :slight_smile: )

If so, I can’t use rest.js because it requires a “window”, but my nodejs server does not have one.

My goal: I have a paraviewweb JS server that instantiates a paraview instance when a client requires a session. My js server also needs to interrogate and pull data from girder in order for them to be processed by paraview and the result sent to the client.


Yes, I’ll make a PR to add the link.

I see. Nothing in the @girder org was design for server side use.

If js-girder-client does what you need, it should be safe for you to use. Only some very trivial changes were made to the REST API going from Girder 2 to 3, so there should not be any problems there.

What I would probably do is just instantiate an Axios instance myself like this:

const axios = require('axios');
const rest = axios.create({baseURL: ''});

You can then hit any REST endpoint using this object. For example,

  'folder', {params: {parentId: '579787098d777f1268277a27', parentType: 'collection'}}
).then((resp) => console.log(

Thanks Jonathan