Forge-Application BIM 360 viewer dropdown selection of projects

Question

How to get a dropdown selection for all available projects to user in BIM 360 Viewer forge application, NodeJS application.

Answer 1

You can use the Forge SDK in your server-side Node.js application to get a list of all projects for a specific BIM 360 "hub" using this endpoint: https://forge.autodesk.com/en/docs/data/v2/reference/http/hubs-hub_id-projects-GET. The Node.js code could look something like this: https://github.com/petrbroz/forge-hubs-browser-nodejs/blob/develop/services/forge.js#L64-L67. Then, your client-side JavaScript can fetch this list of projects, and populate a <select> element with them.

Alternatively, you could also retrieve the list of projects directly from the client. That's what I'm doing in this demo app: https://forgeextraderivatives.z6.web.core.windows.net. I'm adding the following script to my HTML:

<script src="https://cdn.jsdelivr.net/npm/forge-server-utils/dist/browser/forge-server-utils.js"></script>

And then, after obtaining an access token from the server-side, I do the following:

const bim360Client = new forge.BIM360Client({ token: '...' });
async function updateProjectsDropdown() {
    const $projects = $('#projects');
    $projects.empty();
    const projects = await bim360Client.listProjects($('#hubs').val());
    for (const project of projects) {
        $projects.append(`<option value="${project.id}">${project.name}</option>`);
    }
}