To display 3D content in real-time, Sketchfab relies on WebGL, which is a standard rendering library in most modern browsers. You can check if your browser is compatible on https://get.webgl.org/
For more technical details about WebGL on your machine, visit WebGL Report.
Desktop
Sketchfab is compatible with all modern browsers, including:
- Mozilla Firefox
- Google Chrome
- Opera
- Safari
- Microsoft Edge
- Any other Chromium-based browser
Mobile
- iOS 8+
- Android 4.0+
Troubleshooting
WebGL
On older browsers or devices with WebGL disabled, models are displayed with an image-based fallback that gives a 360° turntable view of the model.
If you run into problems, make sure your graphics driver and browser are up-to-date. If that doesn’t help, try one of the other browsers listed above. https://get.webgl.org/ is a good place to start troubleshooting.
Sometimes, your browser may disable WebGL based on your GPU. If you are using a compatible browser, but you see an incompatible warning or the viewer performs very badly, try forcing the browser to use your GPU:
Chrome
-
- Go to System Settings ( chrome://settings/ → Advanced → System ) and make sure Use hardware acceleration when available is enabled.
- Go to chrome://flags/#ignore-gpu-blacklist and enable the Override software rendering list flag.
If you go to WebGL Report and see "SwiftShader" listed as the renderer, the steps above should solve the problem.
Firefox
Type about:config into the address bar and enable webgl.force-enabled.
Edge
Modern versions of Microsoft Edge run in Enhanced security mode by default. This mode does not support WebAssembly (WASM), which is required by the Sketchfab viewer. If models are failing to load in Microsoft Edge, visit Troubleshooting Microsoft Edge to learn how to fix it.
Safari
In Safari 7.1.3 (OS X 10.9) and earlier, WebGL must be enabled manually.
Go to Safari → Preferences → Advanced and check Show Develop menu in menu bar. Go to Develop → Enable WebGL.
Touch Screens / Tablets
Sometimes, navigating a model may not work on a touch screen or tablet device. This is especially common on certain Windows 10 devices. In Chrome, for example, visit chrome://flags/#touch-events and enable the "Touch Events API" flag.
Scripts and Cookies
In order to load correctly, the viewer needs to run various JavaScript scripts. It also needs access to browser cookies for various purposes such as respecting Sound volume and Restricted Content settings. If script execution or cookies are blocked by browser settings, plugins, sandboxing the Sketchfab iframe, or other methods, the viewer will not load. If you must sandbox the iframe for some reason, you must also lift several restrictions to make sure all viewer features work as expected:
- allow-scripts (needed to load the frame whatsoever)
- allow-same-origin (needed to allow the frame to communicate with our servers)
- allow-popups (needed for links within the frame to work)
- allow-forms (needed if the model is password-protected so that you can enter the password)
You will want your iframe HTML code to look something like this (note the sandbox attribute).
<iframe sandbox="allow-scripts allow-same-origin allow-popups allow-forms" frameborder="0" width="xxx" height="xxx" src="https://sketchfab.com/models/xxxxxxxx/embed"></iframe>
You can also remove the sandbox attribute completely if possible.
<iframe frameborder="0" width="xxx" height="xxx" src="https://sketchfab.com/models/xxxxxxxx/embed"></iframe>
WordPress Users
Sketchfab must be added as 'Trusted oEmbed Provider', otherwise WordPress will automatically add sandbox restrictions to Sketchfab iframes.
Adding the following line to a plugin or functions.php in the theme directory solves that:
wp_oembed_add_provider( '#https?://sketchfab\.com/.*#i', 'https://www.sketchfab.com/oembed', true );
It is also added by the JetPack plugin.
Comments
174 comments
Well, I try everything and it still doesn't work on chrome (it's working on Firefox) on desktop... but it's working chrome beta ... really weird ...
@kinggambit You tried different browsers? What version(s)?
@na-kia If it's working in Chrome beta, it sounds like it's a bug on their end. Maybe specific to your particular OS / graphics card.
i had enable the "override software rendering list" but it no use
@ChaosEmperor What Chrome version is that? Did you try Chrome Beta?
@James Firefox works fine. Chrome doesnt however. I just updated Chrome to the latest version today but no success. I have a GTX1080ti. I'll try updating my drivers but I'm guessing it's related to Chrome?
Do you know if there's anyway to let google know about this issue?
@kinggambit I'll see if our 3D team can file a bug report to Google. You're on the latest version of Chrome 63? Can you try Chrome 64 beta? https://www.google.com/chrome/browser/beta.html
If it's already fixed in the next version, there's probably no need to report it to them.
On the page if you wait a little while or twist the model:
before:
after:
model:
https://sketchfab.com/models/e10421d8e60d4b3ba85f1022f66551a6
site:
http://ubnt.ru/
Why is this happening ?
@sirends - I could not reproduce that behavior. What browsers did you try?
hi. i've just update my chrome but i can't edit, it gave me error instead, says that my browser is not compatible, i've tried chrome://flags but it gave me no luck, does this still happening to everyone?
https://www.youtube.com/watch?v=2s7gV6pj4R4&feature=youtu.be i am in Google Chrome v. 63.0.3239.132
@sirends I think it's because the `autospin` feature rotates the model in space, but when you spin the model with your mouse, it moves the camera, not the model.
This causes the environmental lighting to be at a different angle when you move it back to the same place with the mouse after it has auto-rotated. You can check this yourself by using Alt+Click to rotate the lights.
You could try using a different environment with more neutral light direction, or disable the autospin.
@AB_red Did you just update to Chrome 63? Seeing the conversation above, there seems to be some issues with that version on some machines. Can you try Chrome Beta (version 64)?
@jonas_rains_models Can you share what version of Chrome you're running?
Thanks! Like some of the comments above, I think upgrading to version 64 (currently in beta) might fix the problem. https://www.google.com/chrome/browser/beta.html
I tried to do the override software ... on my Chrome Browser and no luck. I still cannot see the 3D video; not compatible. I use a Windows 7 64 bit Dell desktop computer (refurbished) and a Dell display about 10 years old. Out of all of the videos like this that were sent to me to view, I was able to view one, but not the rest. I wonder how that even happened? I am not a computer geek and don't like to do something I can't get myself out of. So the troubleshooting steps didn't work for me.
Desde que eu criei minha conta aqui no Sketchfab,eu sempre usei o modo de edição de 3D e a visualização normalmente,mas hoje não mais funciona a visualização e a edição em 3D
I've been having problems with chrome not willing to display Sketchfab models for a while now. This worked for me:
Hope it could help you guys !"
Thanks stephenk232!
Fixed it with Deryckeredries's suggestion.
Also fixed with Deryckeredries's suggestion...finally. Note, this also fixed a problem I was having watching 360 videos on YouTube using Chrome. The playback was very choppy before allowing Hardware Acceleration, now it works great.
Hello! So, I have a top notch custom built PC and my Chrome is up to date. I did the ignore gpu blacklist thing, and I still can't view my own models in anything but 360 view. :\
EDIT: False alarm, I just had Hardware Acceleration disabled. Because some other site doesn't work as well with it on.
@themugbearer YES! After 1+ year of this not working, enabling Hardware Acceleration got it working finally. Thanks.
@James, if you read this, the article could benefit from adding that instruction. I imagine a lot of users had the same issue as me?
Hi James, really struggling here on a 2010 Intel MacBook running El Capitan (10.11.6) on current versions of both Chrome and Firefox I get the same error when trying to view models:
I think I've tried all the suggestions above, uninstalled and reinstalled Firefox, set everything to accepting all cookie, enabled draft WebGL extensions.
Any suggestions?
That error is related to the way the model is embedded (typically when the site is blocking scripts needed to load the viewer), it's not related to your machine, WebGL, etc.
What page do you see this on? Regular model pages? The model page "popup" in galleries? Or an embed on another site somewhere?
Thanks for the reply! It's embedded in webpage of a DigVentures online cours in Photogrammetry. Itd the secure for every embedded Sketchfan viewer. I'd send you a link but it requires course login. Oddly I'm getting the same error on my tablet (Chrome) as my laptop (Firefox).. I've given every permission I can think of, pop-ups, Javascript etc
I'm also seeing the "it looks like you're blocking some scripts...' error when i try to look at 3dscanexpert page. I've also tried everything but the error occurs on windows 10 chrome + edge and also when I try linux chrome. When I restart I can momentarily see the model but it gets covered by this error message quickly.
On sketchfab itself I can now only see '3D is not available, can only show 360 image instead' with a link here.
This is a new issue - I had no problems up until recently with either embedded images or sketchfab.
Are you able to provide a link to that page?
In both cases, I highly suspect that the iframe is being sandboxed (see explanation above) on your sites. The device and browser you use will not change that, it's being set by the website.
You'll see something like this in the raw HTML of the page:
How are these websites built / configured?
https://3dscanexpert.com/structure-sensor-realsense-sr300-kinect-v2-3d-scanning/
I get this when look at the raw html - does this mean it's not fixable our end?
That's the JavaScript console. If you check inspect the HTML elements of the page, you can see this iframe, for example:
It seems that WordPress is automatically adding the sandbox="allow-scripts" part of that, which breaks the viewer without sandbox="allow-scripts allow-same-origin" (and preferably also "allow-poups allow-forms" to make sure all possible features work).
You might be able to change that manually editing the raw text version of the page in WordPress, but it's not clear to me why WP is adding this automatically. Our blog, for example, uses WP and doesn't do this. Our embeds work fine.
Can you walk me through your procedure for adding an embed to a post? Do you have any WP plugins that might affect this? Any information in general about your WP configuration would be helpful.
I'm just a visitor to the site so no process. I just get about 3 seconds of the underlying model and then this error appears over the top. I've been on this page before with no issue and it's an old post (relatively) so I'm not sure why the encoding of the webpage would be causing this now?
Ok thanks. It's something their WordPress is doing automatically to our iframes. We'll continue investigating.
Please sign in to leave a comment.