Advanced For Website
Integration Guide
Requirements
Fittingbox Virtual Try-On Advanced For Website (ex FitMix)
REQUIREMENTS
API Key
Advanced For Website API requires a unique apiKey.
If we did not provide you with your apiKey, please contact our customer support.
In the meantime, you can test our API with this demo apiKey and the following demo glasses id :
-
demo apiKey : 'TBVAcXitApiZPVH791yxdHbAc8AKzBwtCnjtv6Xn'
-
demo glassesId :
-
'1703-433490'
-
'1703-433486'
-
'1702-432979'
-
'1702-432988'
-
Glasses id
A glassesId represents a unique reference for a specific frame.
The glassesId is used to load glasses.
Two frames of the same model, but with different colors, materials or sizes, must have two distinct glasses id.
HTTPS protocol required
The website must be HTTPS to be able to use the live mode
HTTPS protocol is required by some browsers (in particular Google Chrome and Opera) to allow access to the user camera and other features.
If your website does not provide HTTPS support, the Live mode technology won't be available to all your visitors.
See https://developers.google.com/web/fundamentals/security/encrypt-in-transit/why-https
OS minimum requirements
Windows, mac and Linux are all fully compatible with the Advanced For Website experience.
OS must be up to date with the latest public version (Windows, MacOS, iOS, Android)
Older OS might work but comes with no warranties.
Portable devices minimum requirements
In order to access the live try-on feature on Advanced For Website, the user must be on one of the following devices:
-
iOs: iPhone 6 and above
-
iPad: all versions
-
Android: Samsung S7 and above / Galaxy Note 7 and above
-
Windows: Windows 10
-
macOS: Last major
Browsers compatibility
|
OS |
Browser |
Live mode |
Photo mode |
|
Windows
|
Chrome (latest version*) |
|
|
|
Firefox (latest version*) |
|
|
|
|
Edge (latest version*) |
|
|
|
|
macOS
|
Safari (latest version*) |
|
|
|
Chrome (latest version*) |
|
|
|
|
Firefox (latest version*) |
|
|
|
|
Android |
Chrome |
|
|
|
Embedded app browser - instagram app - twitter app - facebook app - snapchat app |
Compatibility not guaranteed
(Android limitation)
|
 |
|
| IOS (iPhone, iPad) | Safari | |
|
| Chrome / Firefox | Compatibility not guaranteed |
Local photo only |
|
|
Embedded app - instagram app - twitter app - facebook app - snapchat app |
Compatibility not guaranteed
(IOS limitation)
|
Local photo only |
Versions of modern browsers from up to one year would also work, but with no guarantees.
* Since new versions are released monthly for all browsers, and most of their users are kept updated, we do not suggest a specific browser version to ensure the proper functioning of Advanced For Website. We do, however, test and validate every new version of the listed browsers.
Bandwidth recommendations
There is no bandwidth limitation. Despite a low connection demanding a longer loading time for both the Advanced For Website module and the 3D glasses, the experience would still be accessible.
The minimal bandwidth recommended would nonetheless be at 4mbps. A stable 3G connection would ensure a smooth experience.
Integration in an external iframe
This is not a common case to have Advanced For Website inside another iframe.
If the Advanced For Website is used inside an <iframe> element, all the parent iframe must use the following attribute: allow="camera"
<iframe allow="camera" ></iframe>
This will grant access to the camera for the live mode.
Never use server cache for Fittingbox Virtual Try-On Advanced For Website
Advanced For Website files (fitmix.js and fitmix.bundle.js) must not be cached on your server in order to work properly.
Social network application limitation on mobile
Advanced For Website will not be able to access camera through social network mobile application.
If a user click a shared link from an application like Twitter Instagram Facebook the user will not be able to use his camera due to Android and IOS limitations.
In order to have the complete experience with Advanced For Website, the user must use a compatible browser (see Requirements > Browser compatibility)
This apply to all applications on IOS and Android.
Fittingbox Virtual Try-On Advanced For Website in non browser third party native application (IOS / Android)
Browser embedded in application will not be allowed to access the camera. (see Requirements > Browser compatibility)
Minimal container size
Advanced For Website widgets automatically adapt their sizes to fit the html element container dimensions.
This allows to support responsive layouts for different screens or devices.
In order to behave correctly it is recommended to use a container with a minimal size of 300px width and 300px height.
Useful Links
Corporate
Follow Us
© FITTINGBOX 2024 • Terms of use • Privacy & Legal