By Daniel Du

After a long time waiting, IE11 finally supports WebGL, which enables us viewing our 3D/2D models on Internet Explorer with view and data API if IE is your favorite browser or your only option for whatever reason.

Here are some tips to make it work. Firstly, it should be IE11, previous version does not work, and you are recommended to install the new versions automatically to get the latest patches if there are any.

But you may get “Load Error : 4”, or HTTP 401 error when loading a model. For whatever reason IE does not send the “ads-token” cookie when the web request is made from a web worker thread. “ads-token”  is a session cookie of view and data API, It works fine if the request is made from the main thread. Setting the session cookie toggle works around the problem. Here is how to do it in your IE11 browser setting.

Go to Internet Options, and switch to “Privacy” tab:

Open the Advanced Privacy Settings by clicking “Advanced” button, and check “Override automatic cookie handling” , make sure the two “Accept” options are selected and “Always allow session cookies” are checked:

Click OK to accept the changes, now you should be able to view 3D models in IE11. Here is a test site: http://checkoutmymodel.autodesk.io/ You can drag and drop your models to upload and view, or try this link directly.

Yes, It is not good to ask users to change their browser setting, more investigation is undergoing for this issue. You may want to add a reminder banner to your site, telling your user to change their settings. Here is what I did with JavaScript and Bootstrap. Please note that $('#alert_placeholder') is the element where you want to show the banner, it could be body or other HTML element, a <div> for example.

var _isIE11 = !!navigator.userAgent.match(/Trident\/7\./);
if (_isIE11) {     var message = 'It seems you are using IE11, please refer
to <a href="http://adndevblog.typepad.com/cloud_and_mobile
/2015/04/view-and-data-api-now-support-ie11.html">this
blog post</a> to config your browser to view this sample
correctly.';     $('#alert_placeholder').html('<div id="alertDiv"
class="alert alert-danger">
<button type="button" class="close"
data-dismiss="alert" aria-hidden="true">&times;
</button>' + message + '</div>');
    var alert = $('#alertDiv');
    alert.alert(); }

 

Here is how it looks like when user access the site on IE11, putting a banner refering to this blog post for setting instructions:

View and Data API Now supports IE11 More related articles have been published

  1. Great news ,View and Data API Now it supports Chinese interface

    People often ask , Use View and Data API How to localize the interface , To display Chinese , Now the good news comes , from v1.2.19 rise ,View and Data API Start to support multi language interface . You need to make a version number of v ...

  2. Autodesk View and Data API Secondary development learning guide

    What is? View and Data API? Use View and Data API, You can easily display large 3D models or 2D drawings on the web without installing any plug-ins . adopt View and Data API, You can ...

  3. Using View and Data API with Meteor

    By Daniel Du I have been studying Meteor these days, and find that Meteor is really a mind-blowing f ...

  4. View and Data API Tips: Constrain Viewer Within a div Container

    By Daniel Du When working with View and Data API, you probably want to contain viewer into a <div ...

  5. View and Data API Tips: Hide elements in viewer completely

    By Daniel Du With View and Data API, you can hide some elements in viewer by calling "viewer.hi ...

  6. Use AxisHelper Help you understand View and Data API The coordinate system in

    You use View and Data API Do 3D model development , We must first understand View and Data API Coordinate system of , namely XYZ How are the three axes defined .Three.js There is a AxisHelpe ...

  7. stay View and Data API Change the color of the specified element in

    We are using View and Data API Development process , Often used is to change the color of some elements have been distinguished display . For example, according to some attributes to do different colors of thematic display , Or use different colors to show the construction progress , Or simply use color change as a reminder ...

  8. View and Data API tips: cache Access Token

    For clouds API service , The common way is to follow API Call times charge , some API There are certain limitations to calling , For example, only a specified number of calls are allowed in a specific time to avoid abuse . although Autodesk Of view and Data API Not yet ...

  9. View and Data API Tips: how to make viewer full screen

    By Daniel Du If you have not heard of View and Data API, here is the idea, the View & Data API e ...

Random recommendation

  1. Swift - Simply encapsulate a tool class template

    Create a template class ( Encapsulate a class ) example 1: A new one called Product Class Product.swift File The content of class Product { var name: String var desc ...

  2. Given an array A[0,1,...,n-1], Please build an array B[0,1,...,n-1], among B The elements in B[i]=A[0]*A[1]*...*A[i-1]*A[i+1]*...*A[n-1]. Division cannot be used .

    // test14.cpp : Defines the entry point for the console application . // #include "stdafx.h" #include<iostream> #include< ...

  3. Request obtain url All kinds of information methods

    1.Request obtain url All kinds of information methods The test of url Address :http://www.test.com/testweb/default.aspx, give the result as follows : Request.ApplicationPa ...

  4. ubuntu Switch to super administrator privilege

    By default, it cannot be switched , Need to give root The user sets the password mars@mars-LIFEBOOK-LH531:~$ sudo passwd root[sudo] password for mars: Type in New ...

  5. ( Numbers IC) Introduction to low power design ( 7、 ... and )—— Gate level circuit low power design optimization ( To continue )

    The optimization method of gate level power consumption is explained , Including static, dynamic and overall power consumption . Now let's record the gate level ( Some books say it's at the system level ) A common low-power method -- power gating . ① Overview and principle of power gating Power gating means that the power supply in a certain area of the chip is turned off ...

  6. Advanced website development ( thirty-five )JSP On the page pageEncoding and contentType Two properties

    JSP On the page pageEncoding and contentType Two properties This article introduces in JSP Two properties that are often used in a page , Namely pageEncoding and contentType, I hope it helps you , See together . Turn off ...

  7. SyntaxError: &#39;ascii&#39; codec can&#39;t decode byte 0xe4 in position 7: ordinal not in range(128)

    Problem description : SyntaxError: 'ascii' codec can't decode byte 0xe4 in position 7: ordinal not in range(128) Resolver ...

  8. Handler Implementation and mechanism &amp;&amp; Blocking Queue &amp;&amp; IdleHandler Use

    http://blog.csdn.net/boyupeng/article/details/46685343 IdleHandler Source code for processing messages final Message next() { ... ...

  9. vue.js Work: 02

    2017-09-17 Notes and source code address : https://github.com/wll8/vue_note vue The events in the deep . event : @click/mouseover… Short for the event : @ Such as @cl ...

  10. Knockout: practice CSS The binding and afterkeydown event , Add a red border to highlight the input box that fails the verification ; Use afterkeydown Event automatically converts input to uppercase .

    Purpose : Practice a Knockout Provided CSS Binding function and afterkeydown event . step : First in htm Add .error Of css style , And bind... In the input box css: { error: !firstNam ...