Autodesk Forge serves as a hub for hosting dependencies on a nearby server

Our company has implemented an Angular/TypeScript version of the Forge Viewer, currently loading dependencies from Autodesk's server. To ensure these files are always accessible to our customers, we want to host them on our own servers. However, attempting to host a package extracted using the Autodesk Forge Extractor tool locally revealed it only functions with version 2.10, causing some functionality issues as we require version 2.13.

Moreover, each extracted package contains models and textures, but since we load our models from our servers, we prefer hosting packages containing only specific files, without creating references to the full model or utilizing the extract tool for all our models.

Is there a reliable method to host the dependencies listed below without storing the complete model or mentioning the exact model?

<link rel="stylesheet" type="text/css" href="https://developer.api.autodesk.com/viewingservice/v1/viewers/style.css" />
<script src="https://developer.api.autodesk.com/viewingservice/v1/viewers/three.min.js?v=2.13.*"></script>
<script src="https://developer.api.autodesk.com/viewingservice/v1/viewers/viewer3D.min.js?v=2.13.*"></script>
angulartypescriptautodesk-forgeautodesk-viewer

Answer №1

The latest version of the Forge Viewer is 3.1.1 and I recommend using it as there have been significant changes since Version 2.13 and even more from 2.10.

Always make sure to check the Changelogs on the Viewer Developer page here

For a detailed overview of the changes, check out these blog posts:

  • Viewer Release Notes V2.15

  • Viewer Release Notes V2.16

  • Viewer Release Notes V2.17

  • Viewer Release Notes V3.11

Another option would be to download and host the JS and CSS files locally on your server. This way, you can reference them in your project easily.

Copy the source code from the following links and name them appropriately for future reference:

CSS

CSS Stylesheet

JS

Three.js Library Viewer3D.js Library

If needed, you can also retrieve minified versions of the js files by adding "min" before the .js extension. Keep in mind that these files will not update automatically, so manual updating will be required.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The Angular Karma tests are failing because the custom tag is not recognized as a known element

I've recently started learning Angular and encountered an issue with my first Karma test. The error message I received is as follows: AppComponent should create component Error: Template parse errors: 'ereturn-form' is not a known element: ...

angularkarma-jasmine

Ways to assign unpredictable values (such as ids, dates, or random numbers) to a Domain Entity or Aggregate Root when it has been injected as dependencies

I am currently developing a frontend repository that follows an innovative hexagonal architecture approach with domain-driven design principles, and it utilizes Redux Toolkit. The development process involves Test-Driven Development (TDD) where I employ c ...

typescriptdomain-driven-designtddin-memorynon-deterministic

Include a bank account for connecting to Stripe custom accounts

Currently, I am implementing Stripe Connect using Node.js and TypeScript for a platform that facilitates payments for third-party services referred to as "partners." Our decision to utilize Stripe Connect's custom accounts gives us complete control ov ...

node.jstypescriptstripe-payments

The function you are trying to call is not valid... the specified type does not have any call signatures [ts 2349

Having some trouble using functions from Observable Plot example with a marimekko chart in my TypeScript project. I encountered an error on this particular line: setXz(I.map((i) => sum.get(X[i]))) The code snippet causing the issue is as follows: fu ...

javascripttypescript

What are the best practices for handling dynamic content internationalization in Angular?

According to Angular.io, the i18n tag is used to mark translatable content. It should be placed on every element tag that requires translation of fixed text. Now, what if we have an element with dynamic content? For example, consider a table displaying a ...

javascriptangulartypescriptinternationalizationangular-i18n

When attempting to incorporate a third-party library into Angular2 using the CLI, the process did not go as smoothly as anticipated

Trying to integrate a third party JavaScript library sockJS into my Angular2 project... system.config.ts: /** Mapping relative paths to URLs. */ const map: any = { 'sockjs-client': 'vendor/sockjs-client/' }; /** Configuration for use ...

angular

the quickest method to apply font-weight:bold; to the text within the component

Is there a way to apply font-weight: bold; only to the inner content of a component in a scss file while avoiding affecting the component tag itself? :host { font-weight: bold; } Although this code works, it also affects the component tag itself. What ...

cssangularsass

Oops! The program encountered an issue: Unable to retrieve information from an undefined property

I am completely new to using Angular and MongoDB. I am currently attempting to retrieve data from a MongoDB database and display it in an Angular Material Table. However, I encountered an error that reads: "ERROR TypeError: Cannot read property 'data ...

angularmongodb

`Mapping child routes in Angular using basic components`

I am encountering an issue with Angular 8 routes. The problem lies in the child routes not functioning properly. Here are my defined routes: const routes: Routes = [ { path: 'admin', component: MainComponent, children: [ { path: &apo ...

angulartypescript

Display a list of records retrieved from a Firebase query using ngFor to iterate through each instance

I'm currently using firebase and angular to work on a billing list project. The list contains data showing information for a specific month, you can refer to the imagehttps://i.stack.imgur.com/ZR4BE.png While querying the list was smooth, I encounte ...

javascriptangularfirebase

Using Typescript to define the type for React's useState() setter function whenever

I'm working on setting up a React Context to handle parameters mode and setMode, which act as getter and setter for a React state. This is necessary in order to update the CSS mode (light / dark) from child components. I'm encountering a Typescr ...

javascriptreactjstypescripttypesreact-hooks

How can I uniquely combine a code with an existing CSS class and make modifications to it?

I am using ngx-skeleton-loader and I would like to change the color, but I am facing some difficulties. Here is an image that illustrates the issue. When looking at the developer tools, you can see the styles action in the styles action bar. .loader ...

javascriptnode.jsangulartypescript

What is the best way to set up the --public-host for operating an Angular universal app in conjunction with an Ngin

Looking to implement HMR for a universal app, I want to confirm if it is possible. I have successfully set up and run an Angular 8 application using the default "ng new" command. To run it behind a reverse proxy, I modified npm start as follows: e.g. { " ...

node.jsangularexpress

What is the reason for TypeScript not throwing an error when an interface is not implemented correctly?

In my current scenario, I have a class that implements an interface. Surprisingly, the TypeScript compiler does not throw an error if the class fails to include the required method specified by the interface; instead, it executes with an error. Is there a ...

typescripttypescript-typingstypescript-generics

Expanding the table to display additional rows using pagination in an Angular application

I have implemented a table in Angular that displays data fetched from an API. The requirement is to initially display only the first 5 rows and provide an option for users to view more rows (in groups of 5) with pagination support. Below is the code snipp ...

htmlangulartypescript

pressing the switch will adjust the size of the container

I am looking to implement a feature where clicking on an icon will resize a div to full screen in the browser. Below is the HTML code I have set up for this functionality, and I am open to suggestions on how to achieve this. <div> <a (click)= ...

javascriptcssangulariframe

Angular Dialog Component: Passing and Populating an Array with Mat-Dialog

Here's the situation: I will enter a value in the QTY text field. A Mat dialog will appear, showing how many quantities I have entered. My question is, how can I iterate an object or data in the afterclosed function and populate it to the setItem? Cur ...

angulartypescriptrxjs

There seems to be an issue with Material-UI and TypeScript where a parameter of type 'string' does not have an index signature in the type 'ClassNameMap<"container" | "navBar" | "section0">'

My current project is encountering a TS Error stating "(No index signature with a parameter of type 'string' was found on type 'ClassNameMap<"container" | "navBar" | "section0">'.)" The code below is used to assign styles to vari ...

reactjstypescriptmaterial-ui

Is it possible to dynamically close the parent modal based on input from the child component?

As I follow a tutorial, I am working on importing the stripe function from two js files. The goal is to display my stripe payment in a modal. However, I am unsure how to close the modal once I receive a successful payment message in the child. Below are s ...

javascriptreactjstypescript

I encountered an error in my Node.js application stating that it could not find the name 'Userdetailshistory' array. I am puzzled as to why this error is occurring and I suspect it may be due to my

import { Component, OnInit } from '@angular/core'; import { UserdetailshistoryService } from '../../services'; @Component({ selector: 'my-userdetailshistory', templateUrl: './userdetails-history.component.html', ...

angularjsangulartypescript