Виджет расчёта 3D-печати для вашего сайта

Обзор

Виджет Quote3D Embed – это решение без кода/с минимальным кодированием, которое позволяет вам предоставлять мгновенные расчеты стоимости 3D-печати вашим клиентам на любом веб-сайте. Независимо от того, используете ли вы собственный сайт, WordPress или Shopify, вы можете беспрепятственно соединить просмотр 3D-модели и размещение заказа.

Ключевые особенности

• Просмотрщик 3D-моделей: Интерактивный предварительный просмотр загруженных файлов STL, OBJ, 3MF и STEP.
• Мгновенный расчет цены: Автоматический расчет стоимости на основе ваших собственных профилей материалов и принтеров.
• Мультитехнологичность: поддерживаются FDM, SLA, SLS, SLM и MJF, каждая со своей логикой расчёта.
• Пользовательские темы: настройте внешний вид в соответствии с фирменным стилем, используя glassmorphism и собственные цветовые палитры.
• Нулевая конфигурация для клиентов: Вашим клиентам не нужно знать технические детали слайсинга; всем этим управляет Quote3D.
• Плагины для платформ: устанавливаемые пакеты для WooCommerce, PrestaShop, OpenCart, Magento и Wix, а также готовый код для Shopify, Webflow и Framer.
• Простая и расширенная формы: спрашивайте только качество печати и прочность вместо настроек слайсера, показывайте все параметры печати или дайте каждому клиенту переключаться между ними. Настраивается в редакторе виджета или опцией mode в SDK.

Что вы можете сделать

• Синхронизация с интернет-магазином в реальном времени: используйте события «Добавить в корзину», чтобы напрямую связать расчеты со корзиной вашего магазина.
• Автоматизированный сбор лидов: Автоматически собирайте требования клиентов и данные модели.
• Автоматическая генерация эскизов: автоматически захватывайте и сохраняйте скриншоты моделей для отслеживания производства.
• Гибкие перенаправления: отправляйте клиентов на нужную страницу после успешного расчёта. Адрес перенаправления должен быть URL с http или https.

Интеграции с платформами: WooCommerce, Shopify, PrestaShop, OpenCart, Magento и другие

Виджет работает на любом сайте. Для этих платформ мы предлагаем устанавливаемые пакеты или готовый код; что происходит с корзиной, зависит от платформы:

• Quote3D для WooCommerce
• Quote3D для PrestaShop
• Quote3D для OpenCart
• Quote3D для Magento
• Quote3D для Wix
• Quote3D для Shopify

Другие платформы и собственные стеки

• Wix: пакет Velo, который проверяет цену расчёта в бэкенде вашего сайта и добавляет её в корзину Wix Stores (тариф Premium; используется service plugin eCommerce Catalog от Wix, сейчас в бета-версии). В строке корзины отображается изображение товара-носителя, а не миниатюра модели: Wix принимает только изображения из своего Media Manager.
• Squarespace: встраивайте виджет с помощью Code Block. У Squarespace нет API корзины, поэтому заказы проходят через запрос расчёта, счёт или ссылку на оплату.
• PrestaShop 8: устанавливаемый модуль, который проверяет цену расчёта на вашем сервере и добавляет его в корзину, с панелью управления Quote3D в разделе Sell: расчёты, очередь печати, запасы цветов, отчёты, загрузка моделей и настройки.
• OpenCart 3.0, 4.0.2.2+ и 4.1: устанавливаемое расширение, которое проверяет цену расчёта на вашем сервере и добавляет его в корзину, с меню Quote3D в админ-панели: расчёты, очередь печати, запасы цветов, отчёты, загрузка моделей и настройки.
• Magento Open Source / Adobe Commerce 2.4: модуль, который проверяет цену расчёта на вашем сервере и добавляет его в корзину, с меню Quote3D в админ-панели: расчёты, очередь печати, запасы цветов, отчёты, загрузка моделей и настройки.
• Webflow: встраивайте виджет с помощью элемента Code Embed. Расчёты нельзя добавить в корзину Webflow Ecommerce.
• Framer: React-компонент для виджета. Во Framer нет встроенной корзины.
• Пользовательское программное обеспечение: Может быть интегрировано в любой React, Vue или Vanilla JS проект с помощью JS SDK.

Технический принцип работы

Виджет Quote3D работает как высокопроизводительный Iframe или современный JS SDK. Вот как это работает:

• Изолированная работа: Виджет работает в своей защищенной зоне (Iframe), поэтому он не нарушает стиль вашего сайта.
• Обмен в реальном времени: виджет передаёт результаты расчёта на вашу страницу через API 'postMessage'. При использовании SDK события доставляются только источнику, встроившему виджет, а не рассылаются всем слушателям.
• Автоматическое изменение размера: При использовании SDK виджет автоматически регулирует свою высоту в зависимости от контента.

Работа с API вместе с виджетом

Виджет обрабатывает свой трафик API внутри себя — эти маршруты вы не вызываете сами. Когда нужно прочитать или обработать те же данные из собственного кода, используйте публичные эндпоинты v2, описанные в основных понятиях, обращаясь к https://api.quote3d.com/v2 с настоящим Bearer-токеном API, а не с идентификатором токена. Чтобы реагировать на добавление настроенной детали в корзину, подпишитесь на вебхук widget.added_to_cart вместо прямых вызовов.

Безопасность и верификация

Виджет обращается к Quote3D из браузера, поэтому его токен виден каждому, кто откроет исходный код страницы. Создайте отдельный токен виджета, ограничьте его областью виджета и привяжите к источникам вашей витрины. Обновление сохраняет оба ограничения, поэтому обновлённый токен виджета никогда не станет токеном с полным доступом.

Загруженные файлы и превью

Файлы, загруженные через виджет, хранятся в зашифрованном виде и не доступны публично. В payload при добавлении в корзину передается thumbnailUrl — абсолютная ссылка, которая отображается в вашем магазине: сохраняйте её именно в том виде, в котором она была получена. Изменение ссылки, удаление параметров запроса или размещение на вашем домене приведет к ошибке отображения изображения.

Цены, которым может доверять ваш магазин

• Токен с областью виджета не может задать цену. Расчёт, запрошенный с ним, учитывает только параметры, которые покупатель выбрал в форме; цены материалов, оборудования и сборов всегда берутся из ваших собственных профилей.
• Вебхук widget.added_to_cart сообщает цену, валюту, количество и материал, сохранённые вместе с расчётом, а не то, что отправил браузер, и отправляется один раз на расчёт.
• Сообщение QUOTE3D_ADD_TO_CART, которое получает ваша страница, приходит из браузера покупателя и может быть там изменено. Перед списанием оплаты проверьте цену по вебхуку или через GET https://api.quote3d.com/v2/quotes/{quote_id}.

Область токена виджета

Токен, созданный с областью виджета, достигает только тех эндпоинтов, которые действительно нужны встроенному интерфейсу. Всё остальное в API запрещено, поэтому токен, извлечённый из исходного кода страницы, нельзя обратить против вашего аккаунта.

Область виджета разрешает:

• Читать конфигурацию принтеров и материалов, чтобы форма расчёта могла показать ваши варианты.
• Запрашивать идентификатор загрузки и загружать файл модели.
• Читать и удалять загруженный им файл.
• Запускать асинхронный расчёт для этого файла и опрашивать созданное задание.
• Читать расчёт по идентификатору, сохранять его миниатюру и отправлять событие добавления в корзину.

Область виджета запрещает:

• Управление вебхуками, чтобы украденный токен не смог перенаправить ваш поток событий на другой сервер.
• Данные аккаунта, историю загрузок, списки расчётов, аналитику, использование и лимиты.
• Активацию лицензии и все прочие эндпоинты, не перечисленные выше.

Привязка к источнику

Перечислите магазины, которым разрешено использовать токен, например https://shop.example.com. Токену виджета нужен хотя бы один: при загрузке iframe Quote3D проверяет страницу, встраивающую виджет, и отказывается отображаться на любом сайте не из списка.

Что привязка к источнику требует от вашей страницы

• Проверка читает реферер, который браузер отправляет при загрузке iframe виджета. Это поведение по умолчанию, поэтому от обычной страницы ничего не требуется.
• Если страница задаёт referrer-policy: no-referrer, origin нельзя проверить и виджет не загрузится. На страницах с виджетом используйте значение браузера по умолчанию (strict-origin-when-cross-origin) или origin.
• Прямые вызовы API проверяются отдельно: запрос из браузера на сайте вне списка отклоняется, а вызовы сервер-сервер, которые не отправляют заголовок Origin, не затрагиваются.

Что токен виджета прочитать не может

Эндпоинт конфигурации возвращает только то, что отображает форма расчёта, — названия принтеров, области построения, материалы, цвета и ограничения по слоям. Ваша себестоимость (цена материала за килограмм, стоимость машино-часа, множитель стоимости поддержек, потребляемая мощность) в браузер не передаётся; цена рассчитывается на сервере.

Сеансы посетителей

Токен виджета публичен, поэтому лимит, считаемый по токену, делили бы все покупатели вашего магазина, и один скрипт мог бы исчерпать его и заблокировать всех остальных. Поэтому виджет открывает короткий сеанс посетителя, когда покупатель впервые загружает файл, а затратные шаги считаются по сеансу.

• Встроенный виджет делает это сам. Стандартный код встраивания менять не нужно.
• Загрузка файла, запуск расчёта, сохранение миниатюры и событие добавления в корзину требуют сеанса. Чтение вашей конфигурации, опрос задания и получение расчёта — нет, поэтому долгий расчёт никогда не оставит покупателя ни с чем.
• Сеанс действует 30 минут. В рамках одного сеанса покупатель может в час выполнить до 30 загрузок, 15 расчётов, 30 сохранений миниатюр и 20 событий добавления в корзину. Один IP-адрес может открыть до 20 сеансов в час для одного токена.
• Эти правила действуют только для токенов с областью виджета. Токен без области считается серверной интеграцией и не получает ни одной из этих защит, поэтому токен в вашем магазине всегда должен иметь область виджета.
• Если вы сами вызываете эти эндпоинты с токеном с областью виджета, сначала откройте сеанс: получите задачу через GET https://api.quote3d.com/v2/widget/challenge, найдите число от 0 до maxnumber, для которого SHA-256 от соли с этим числом в конце совпадает с задачей, и отправьте его в POST https://api.quote3d.com/v2/widget/session. Передавайте полученное значение в заголовке X-Widget-Session. На отсутствующий или истёкший сеанс сервер отвечает 401 с кодом ошибки AUTH_005; откройте новый сеанс и повторите запрос.
• У трафика виджета есть собственная почасовая квота, отдельная от квоты вашей серверной интеграции, поэтому загруженный магазин и ваш собственный бэкенд не мешают друг другу. Кроме того, в панели управления можно задать дневной лимит расчётов для виджета; когда он исчерпан, покупателям предлагают попробовать на следующий день, а вы получаете письмо.

Токены, созданные без области, сохраняют полный доступ, поэтому существующие интеграции продолжают работать без изменений. Добавление области — это и есть способ включить для токена ограничение.