I just followed the startup tutorial to load up a model.
Firstly I have a exsiting client_id and client_secret from autodesk developer, and then built up a express based application with client_id and client_secret in order retrieve the access token such as
var config ={
credentials: {
client_id: 'xxxxxxxx',
client_secret: 'xxxxxxx',
grant_type: 'client_credentials',
scope:'data:read data:write data:create bucket:create bucket:read'
},
BaseEndPoint: 'https://developer.api.autodesk.com',
Version: 'v1'
} ;
config.AuthenticateEndPoint =config.BaseEndPoint + '/authentication/' + config.Version + '/authenticate' ;
unirest.post (config.AuthenticateEndPoint)
.header ('Accept', 'application/json')
.send (config.credentials)
.end (function (response) {
}
{"access_token":"ruTBP6POxlpcy8HK2KlWzoFu61oE","token_type":"Bearer","expires_in":86399}
This access token is then sent back to a simple html client.
<!DOCTYPE html>
<html>
<head>
<title>Very Basic 3D Viewer</title>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=no" />
<meta charset="utf-8">
<script src="js/jquery-3.1.1.min.js" ></script>
<!-- The Viewer CSS -->
<link rel="stylesheet" href="https://developer.api.autodesk.com/viewingservice/v1/viewers/style.min.css" type="text/css">
<link rel="stylesheet" href="https://developer.api.autodesk.com/viewingservice/v1/viewers/A360.css" type="text/css">
</head>
<body>
<div id="viewer"></div>
<!-- The Viewer JS -->
<script src="https://developer.api.autodesk.com/viewingservice/v1/viewers/three.min.js?v=v1.2.22"></script>
<script src="https://developer.api.autodesk.com/viewingservice/v1/viewers/viewer3D.min.js?v=v1.2.22"></script>
<script src="https://developer.api.autodesk.com/viewingservice/v1/viewers/Autodesk360App.js"></script>
<!-- Developer JS -->
<script>
$(document).ready(function () {
var viewerApp;
var options = {
env: 'AutodeskProduction',
accessToken: 'YOUR ACCESS TOKEN'
};
var documentId = 'YOUR BASE 64 ENCODED URN';
$.getJSON( 'http://'+window.location.host+ "/gettoken", function( data ) {
console.log(data);
options.accessToken = data.accessToken;
documentId = data.urn;
options.document = data.urn;
});
console.log(options.accessToken, documentId);
Autodesk.Viewing.Initializer(options, function onInitialized(){
viewerApp = new Autodesk.A360ViewingApplication('viewer');
//viewerApp.registerViewer(viewerApp.k3D, Autodesk.Viewing.Private.GuiViewer3D);
//viewerApp.loadDocumentWithItemAndObject(documentId);
});
});
</script>
</body>
</html>
The problem occurred on the client-side, which can successfully get the access token. However this gave me a error
'POST https://developer.api.autodesk.com/utility/v1/settoken 401 (Unauthorized)'
Autodesk.Viewing.Initializer(options, function onInitialized(){
viewerApp = new Autodesk.A360ViewingApplication('viewer');
//viewerApp.registerViewer(viewerApp.k3D, Autodesk.Viewing.Private.GuiViewer3D);
//viewerApp.loadDocumentWithItemAndObject(documentId);
});
i can't figure out what is the problem, something wrong with api or client side or server side?
Note: on registering the developer api, i simply named callback as http://localhost:3000 because currently i am testing it on the local environment, is that the problem ?
The code here
is correct. You get a valid access token, and I assume you run this code from your node.js server. On your server you implement an endpoint, i.e /gettoken, which your client app will call to get the access token returned to your page which initialize the viewer. So far so good.
However, when you consider the calling sequence on your client, there is an issue.
means that your code will execute when the DOM is ready - this is fine. Here, you initialize your variables:
until here it is still ok, but note that both the accessToken and documentId have invalid valid.
Next, you query the access token using $.getJSON() which is an asynchronous way of calling an endpoint. That means this function returns immediatelly before you read the reply.
So the next code executed is not the one in the callback function, but this one:
at this time, the accessToken and documentId still got invalid values, which will cause your code to fail. In short you need to initialize the Viewer from the callback to wait for the /gettoken response to come back.