9 - 2015

Возможности Autodesk View and Data API для разработки web-приложений

Александр Стремнев, к.т.н., доцент кафедры информационных технологий Белгородского государственного технологического университета им. В.Г. Шухова (окончил БГТУ им. В.Г. Шухова в 2002 году (специальность «Механическое оборудование промышленности строительных материалов»), защита диссертации в 2004 году (тема: «Разработка математических моделей для автоматизированного проектирования шаровых барабанных мельниц»)
Александр Стремнев,
к.т.н., доцент кафедры информационных технологий Белгородского государственного технологического университета им. В.Г. Шухова (окончил БГТУ им. В.Г. Шухова в 2002 году (специальность «Механическое оборудование промышленности строительных материалов»), защита диссертации в 2004 году (тема: «Разработка математических моделей для автоматизированного проектирования шаровых барабанных мельниц»)

В статье рассказывается об online-сервисе Autodesk для публикации моделей САПР, включая их трехмерное отображение. Даются рекомендации по созданию пользовательских web-приложений с применением Autodesk View and Data API. Рассмотрены вопросы организации отправки и хранения моделей в online-хранилище, интерфейса хранилища и web-приложения, а также встраивания соответствующего просмотрщика в разметку страниц.

Современный уровень развития Интернета дает возможность пользователям публиковать в сети контент практически любого типа. Разнообразие сервисов для размещения в сети текста, изображений, аудио­ и видеоданных практически всегда позволяет выбрать инструментарий с наиболее подходящим функционалом. Пожалуй, лишь такой тип содержимого, как трехмерные модели, до недавнего времени был незаслуженно лишен поддержки во Всемирной сети. Хотя потребность публиковать и просматривать 3D несомненно существует — это обширнейшая область интернет­коммерции, сфера образования, познавательные и развлекательные ресурсы. К традиционным сложностям на пути широкого использования 3D в Интернете принято относить высокие требования к полосе пропускания и аппаратным возможностям на стороне клиента, а также «извечную» проблему форматов и вытекающие отсюда сложности, связанные с программным обес­печением (плееры, кодеки, надстройки и т. п.).

Фирма Autodesk, будучи одним из лидеров в области разработки программного обеспечения для трехмерной графики, естественно, не могла долго оставаться в стороне от потребности пользователей работать с данными в облаке. Такие сервисы Autodesk, как A360 и AutoCAD360, позволили не только хранить модели и управлять доступом к ним, но и выполнять их редактирование.

Рис. 1

Рис. 1

Рис. 2

Рис. 2

Оценить возможность пуб­ликации 3D во Всемирной паутине с помощью сервисов Autodesk можно, обратившись к странице online­просмотрщика (https://360.autodesk.com/viewer). Для начала работы необходимо пройти регистрацию, щелкнув по кнопке Sign Up for Free (рис. 1).

Далее на первом шаге публикации нужно перетащить в окно загрузки файл модели в одном из 50 форматов, поддерживаемых сервисом (это могут быть модели деталей, сборок, чертежей). При этом в случае указания файла сборки сервис потребует подгрузить также и файлы ее компонентов (деталей и узлов) — рис. 2.

После выполнения копирования файлов модели на сервис она отображается в окне браузера посредством просмотрщика, состоящего из рабочей области и панели структуры. В рабочей области имеются необходимые инструменты для управления точкой наблюдения и параметрами просмотра (рис. 3).

На следующем шаге публикации для получения ссылки на модель необходимо щелкнуть по кнопке Общий доступ, расположенной над рабочей областью просмотрщика. Ссылку можно передать адресатам или разместить на каком­либо Интернет­ресурсе (рис. 4).

Рис. 3

Рис. 3

Рис. 4

Рис. 4

Рис. 5

Рис. 5

Рис. 6

Рис. 6

Пользователь, обратившийся к предоставленной ссылке, сможет ознакомиться с моделью в «браузерном» просмотрщике. При этом проходить регистрацию или устанавливать какое­либо дополнительное ПО (плагины или дополнения) не понадобится.

Рассмотренный функционал достаточно удобен, но для web­разработчиков требуется нечто большее. Например, возможность загрузки файлов моделей в контексте приложений, динамическое управление ссылками, размещение просмотрщика в структуре разметки страниц. Для решения этих и многих других задач Autodesk предлагает специальную программную библиотеку View and Data API, работу с которой следует начать с посещения ресурса https://developer.autodesk.com. Здесь содержатся необходимые инструменты для управления приложениями и справочные материалы (в разделе Support). После регистрации на сайте (можно пользоваться единой учетной записью Autodesk) предлагается создать новое пользовательское приложение, щелкнув по кнопке Create an App (рис. 5).

При создании приложения требуется выбрать его тип (View and Data API), дать ему имя и ввести описание (рис. 6).

После создания приложения ему будет присвоен «ключ» (Consumer Key) и «пароль» (Consumer Secret). Эти параметры будут необходимы для обращения к проекту приложения из программного кода (рис. 7).

Для непосредственной реализации web­приложения с применением Autodesk View and Data API разработчик может использовать привычную среду, например Visual Studio. В процессе реализации приложения для задействования функциональных возможностей View and Data API необходимо будет выполнять запросы к соотвествующему web­сервису, для чего к создаваемому проекту следует подлючить библиотеку RestSharp.

Рис. 7

Рис. 7

Рис. 8

Рис. 8

В листинге 1 представлен код с процедурой­запросом для генерации ключа­токена (переменная token), который будет контролироваться сервисом аутентификации при выполнении таких операций, как загрузка файлов моделей в приложение. В коде для подготовленного объекта myclient типа RestSharp­клиент (RestClient) выполняется RestSharp­запрос (объект authReq типа RestRequest) для аутентификации и получения ключа­токена. В качестве параметров запроса в код следует ввести «ключ» и «пароль», полученные на сайте https://developer.autodesk.com. Результат запроса записывается в объект типа IRestResponse, из которого можно считать необходимое содержимое (access_token), задействуя метод Content.

Листинг 1

Public myclient = New RestClient(“https://developer.api.autodesk.com”)

Public token As String

Sub Authentication()

Dim strConsumerKey As String = “<ключ>”

Dim strConsumerSecret As String = “<пароль>”

Dim authReq As RestRequest = New RestRequest()

authReq.Resource = “authentication/v1/authenticate”

authReq.Method = Method.POST

authReq.AddHeader(“Content­Type”, “application/x­www­form­urlencoded”)

authReq.AddParameter(“client_id”, strConsumerKey)

authReq.AddParameter(“client_secret”, strConsumerSecret)

authReq.AddParameter(“grant_type”, “client_credentials”)

Dim result As IRestResponse = myclient.Execute(authReq)

Dim responseString As String = result.Content

Dim pos As Integer

pos = InStr(responseString, “access_token”) + 3 + “access_token”.Length

token = Mid(responseString, pos, responseString.Length — pos — 3)

End Sub

Хранение моделей на сервисе Autodesk View and Data API осуществляется в объектах­«корзинах» (Buckets). В листинге 2 приведен код процедуры, создающей «корзину» на сервисе Autodesk с помощью RestSharp­запроса bucketReq. Следует обратить внимание на то, что при определении параметра Authorization используется переменная token, корректное значение которой обеспечивается функцией Authentication. Передаваемая в процедуру строка (имя корзины) может представлять любую последовательность символов, единственное — Autodesk рекомендует включать в него «ключ» приложения, полученный на сайте.

Листинг 2

Sub CreateBucket(bucket As String)

Authentication()

Dim bucketReq As RestRequest = New RestRequest()

bucketReq.Resource = “oss/v1/buckets”

bucketReq.Method = Method.POST

bucketReq.AddParameter(“Authorization”, “Bearer “ + token, ParameterType.HttpHeader)

bucketReq.AddParameter(“Content­Type”, “application/json”, ParameterType.HttpHeader)

Dim mybody As String = “{“”” & “bucketKey” & “””” & “:” & “””” & bucket & “””” & “,” & “””” & “servicesAllowed” & “””” & “:{},” & “””” & “policy” & “””” & “:” & “””” & “persistent” & “””” & “}”

bucketReq.AddParameter(“application/json”, mybody, ParameterType.RequestBody)

Dim resp As IRestResponse = myclient.Execute(bucketReq)

End Sub

Листинг 3

Sub UploadFile() as String

Authentication()

Dim uploadedFile As HttpPostedFile = FileUpload1.PostedFile

‘objectKey <­ uploadedFile

‘nlength <­ uploadedFile

‘fileData <­ uploadedFile

Dim uploadReq As RestRequest = New RestRequest()

uploadReq.Resource = “oss/v1/buckets/” & bucket.ToLower() & “/objects/” & objectKey

uploadReq.Method = Method.PUT

uploadReq.AddParameter(“Authorization”, “Bearer “ & token, ParameterType.HttpHeader)

uploadReq.AddParameter(“Content­Type”, “application/stream”)

uploadReq.AddParameter(“Content­Length”, nlength)

uploadReq.AddParameter(“requestBody”, fileData, ParameterType.RequestBody)

Dim resp As IRestResponse = myclient.Execute(uploadReq)

Dim responseString As String = resp.Content

‘urn <­ responseString

UploadFile= urn

End Sub

Отправку файла модели в созданную «корзину» можно осуществить, например, считав содержимое из элемента управления типа FileUpload. В листинге 3 данные отправляемого файла служат основой для формирования RestSharp­запроса uploadReq к сервису Autodesk View and Data API разрабатываемого приложения. После выполнения запроса его результат — объект resp типа IRestResponse — служит для считывания сетевого адреса файла модели в формате URN. Этот адрес будет использоваться для передачи в просмотрщик на странице web­приложения.

Для размещения просмотрщика на web­странице следует в HTML­разметке сформировать соответствующий блочный контейнер с необходимыми идентификаторами, а в раздел объявлений поместить ссылку на таблицу стилей сервиса Autodesk View and Data API. В качестве инициатора начала работы просмотрщика в приведенном в листинге 4 фрагменте разметки используется кнопка btnViewModel.

Далее в связанном со страницей модуле JavaScript необходимо инициализировать просмотрщик, связав соответствующую функцию (initialize) с объектом­инициатором (кнопкой btnViewModel) и контейнером (блоком viewer) — листинг 5.

Листинг 4

<link type=”text/css” rel=”stylesheet” href=”https://viewing.api.autodesk.com/viewingservice/v1/viewers/../../../../styles/directorinfo.css?v=v1.2.15” />

<button id=”btnViewModel”>Просмотреть модель</button>

<div id=”viewerContainer” class=”text­center”style=””>

<div id=”viewer3d” style=”height: 480px; width: 900px; position:absolute;”>

<div id=”viewer” class=”adsk­viewing­viewer notouch” style=”height: 100%; width: 100%; overflow: hidden;”>

</div></div></div>

Листинг 5

$(‘#btnViewModel’).click(function () {initialize();});

function initialize() {

//var urn <­ источник адресов (элемент управления или база данных)

//var token <­ функция аутентификации на сервисе Autodesk View and Data API

var options = {‘document’: urn, ‘getAccessToken’: token, ‘refreshToken’: token};

var viewerElement = document.getElementById(‘viewer’);

viewer = new Autodesk.Viewing.Private.GuiViewer3D(viewerElement, {

extensions: [‘BasicExtension’]});

Autodesk.Viewing.Initializer(options, function () {

viewer.start();

Autodesk.Viewing.Document.load(urn, function (doc) {

var geometryItems = [];   

geometryItems = Autodesk.Viewing.Document.getSubItemsWithProperties(doc.getRootItem(), {

‘type’: ‘geometry’, ‘role’: ‘3d’}, true);

if (geometryItems.length > 0) {viewer.load(doc.getViewablePath(geometryItems[0]));}

}, function (errorMsg) {alert(“Load Error: “ + errorMsg);});

});}

С тестовым проектом автора (рис. 8), представляющим собой несложный пополняемый каталог моделей, можно ознакомиться по адресу http://sid246.somee.com/.

Множество других примеров применения Autodesk View and Data API с исходными кодами доступны на сайте http://developer­autodesk.github.io/.

В заключение следует упомянуть о некоторых сложностях, связанных с использованием online­сервисов Autodesk для работы с 3D.

Во­первых, представление графики на этих сервисах базируется на технологии WebGL. Следовательно, на компьютере клиента должна быть установлена видеокарта и браузер, поддерживающие этот стандарт.

Во­вторых, интерфейс Autodesk View and Data API на данный момент не поддерживает ряд важных функций для эффективного управления содержимым хранилища. Это относится, например, к чтению содержимого «корзины» и удалению файлов из нее.

Что касается первого замечания, то большинство компьютеров во Всемирной сети и применяемых браузеров соответсвует спецификации WebGL. Ограничения же функционала View and Data API можно списать на неизбежные «болезни роста». Подытоживая всё вышесказанное, нужно отдать должное фирме Autodesk, предоставившей пользователям и разработчикам набор достаточно интересных инструментов для интеграции трехмерных моделей в web­ресурсы. 

Список источников:

https://360.autodesk.com/viewer

https://developer.autodesk.com

http://sid246.somee.com/

http://developer­autodesk.github.io/

САПР и графика 9`2015