I've put a Soundcloud HTML5 player on my website and am generally quite pleased with it.
However, while browser testing in IE9 on Windows 7, The player is not loading, and I am seeing the following error in the debugging console:
SCRIPT429: Automation server can't create object
widget-b8220e90.js, line 2 character 1738
The poking around that I have been able to do suggests that this has something to do with the IE9 security settings and/or ActiveX, which makes me shudder. I have IE9 running on its default security settings.
Is there anything that can be done to get the HTML5 player to show in this situation, or will I need to fallback to the flash player?
EDIT: The problem also occurs in IE8, which isn't surprising but I add for completeness' sake
EDIT: I am seeing the problem using the Win7/IE9 Virtual Machine provided by Microsoft at their new Modern IE site, and using the default security settings in IE9
I used the same code you specified above to try to reproduce, but it works fine for me in IE9. In compatibility mode it just falls back to the old Flash widget. Can you have a look here and say if it still doesn’t work for you?
http://jsbin.com/otulas
This is indeed a problem in IE, testing on IE8 and this is what I have found:
The Widget API Playground doesn't work.
URLs with "/favorites" doesn't work, as in the Widget API Playground.
Getting this error:
"Webpage error details
Message: Object doesn't support this property or method
Line: 1
Char: 6061
Code: 0
URI: https://w.soundcloud.com/player/api.js
So I did unminify the JS file and got that it's talking about this line of code:
return r && r.instance ? r.instance : (i = a.indexOf(S(e)) > -1, s = new p(e), f.push(new d(s, e, i)), s)
It is important to mention that the player works fine without any API and without including the API script.
Hope this can be helpful for the dev team.
IE9 and 10 don't like third party cookies. SoundCloud's HTML5 widget uses those.
More from SoundCloud: http://help.soundcloud.com/customer/portal/articles/1331463-why-is-my-widget-not-showing-up-in-internet-explorer-
More from Microsoft: http://answers.microsoft.com/en-us/ie/forum/ie10-windows_8/soundcloud-html5-widget-wont-display-in-ie-9-or-10/79aaab55-44d8-414f-9d06-939bbdf25676
Related
I've used this code (reference to source code) where I try to show a stream of video for the user and allow him to take a snapshot, this is working fine on Chrome for example but does not work on Microsoft Edge at all and no errors are shown. Any idea why this is not working and maybe reference a different approach I should take?
I'm pretty sure it does not work on Safari either...
Even the Microsoft's Demo page is not working! here is a screenshot of the error I get:
And my device manager:
EDIT (3 Sep 15): I have turned on "Let apps use my Camera" in my Windows Settings and now this demo works well on all browsers but Safari. Anyone know what is the best approach to capturing an image from a webcam stream in Safari?
You need to open Privacy Settings. Enable Camera and Microphone for Edge, otherwise you will get a permission error.
I tried the Photo Capture using webcam demo on Edge and it is working quite fine. you can check the below screenshot.
You need to use navigator.mediaDevices.getUserMedia. Even though Chrome 45 has navigator.mediaDevices and a getUserMedia function which returns a Promise, it does not accept spec-style constraints.
Note: Make sure to turn on the Camera setting "Let apps use my
camera" and from the list of apps that can use your camera turn on Microsoft Edge as well.
for me #Michael Wanyoike hit it on the head. You have to enable camera permissions. The weird thing is that no prompt requesting permission appeared, simply a black screen. It could be that previously I had click deny but still not a smooth flow.
I'm creating a Audio Player with HTML5, using the MediaSource Object.
My code is similar to MediaSource API Demo
But when executing the line
var ms = new MediaSource();
And exception is throwed on Firefox and Internet Explorer
ReferenceError: MediaSource is not defined
In Firefox Support says that this feature is only enabled to Youtube and Netflix.
There is a way to handle this restriction?
In Chrome, I have not problem!
At time of writing, IE11 only has support when run on Windows 8.1 or above.
Firefox will only enable MSE when about:config param media.mediasource.enabled = true (this restriction will be removed eventually, once the FF implementation is globally stable). There is no way around this, so unless you are YouTube or Netflix, consider Firefox MSE as coming soon.
Firefox has been lagging behind quite badly when it comes to MSE support in their browser. Firefox Nightly build however now seems to be pretty close to working properly. It still has to go through nightly build and beta phase before it's released to the public, so expect a few months.
Hi I am creating an angularjs app . I made $locationProvider.html5Mode as true. Now I am getting pretty url without # . It is working fine in chrome and firefox. But when I tried to open it in IE 9 , it is reloading continuously.
Bad news. IE9 do not support HTML5 History API. That is what angular html5Mode uses. If you need your app to run on IE9 you need to switch back or add code to detect if History API is available the use is or default to the hash
function supports_history_api() {
return !!(window.history && history.pushState);
}
I know. Stupid IE. It should die a painful dead.
$location Documentation
See "Hashband and HTML5 modes"
Basically, html5 mode uses History API when the browser supports it, and falls back to hashbang(#) when it is not supported.
You cannot "just" remove "#" in a browser without History API. Because when you change the url, the browser would then try to force a reload, breaking the flow.
I am doing this tutorial here
I simply copied and pasted the code below.
var XFoo = document.register('x-foo');
document.body.appendChild(new XFoo());
I immediatly get an error saying that:
Uncaught TypeError: Object #<HTMLDocument> has no method 'register'
I do not know why nor what I am doing wrong. I am using the Chrome browser.
I implemented Custom Elements in Chrome so I might be able to help.
Starting with Chrome 33, document.register has been renamed document.registerElement.
Up to Chrome 32, the most likely reason you would get that error is if the Experimental Web Platform Features flag is not enabled. Cut and paste chrome://flags into the Omnibox and hit enter to check. After changing flags, you have to restart your browser for the changes to take effect.
HTH!
Only firefox and chrome are known to support it yet. If you are trying it in IE, Safari or Opera then you are out of luck.
For all other browsers that I've tried in both Windows and MacOSX (including Chrome under Windows) using an "iframe shim" works fine. However, I have not been able to get iframe shims to work over our plugin in Chrome on the Mac.
Having Googled the problem, and done some testing, it appears to depend upon the object. I've found an example using StreetView (a flash object) which works, and another example using a Java Applet which does not work.
Some links:
Here's a description of the method: http://www.oratransplant.nl/2007/10/26/using-iframe-shim-to-partly-cover-a-java-applet/
This example using a Java Applet is from the above article: http://www.oratransplant.nl/files/iframe_shim.html
And here's the working version using Streetview: http://gmaps-samples.googlecode.com/svn/trunk/streetview/iframeshim.html
By inspecting (and editing) elements in Chrome and copying the objects between the two example pages, it appears to be that the flash object just allows iframe shims (in Chrome on the Mac), but that the Java Applet does not.
In our case we are using a custom plugin, built with Firebreath.
It may be that I need to implement extra functionality into our plugin, mimicking whatever flash is doing, but this could well be caused by a bug in the Mac build of Chrome.
Can anyone help? We really do want to be able to show HTML elements over our plugin, and the iframe shim works on almost all browser/OS combinations!
The lack of compositing is a known bug in Mac Chrome with any plugin using Core Animation or Invalidating Core Animation. It will be resolved in some future version--in theory, you should never need an iframe hack on the Mac, and plugins should always composite correctly. If you are interested, you can detect whether compositing of Core Animation is supported dynamically in your plugin using NPN_GetValue with the value 74656 (see WKNVSupportsCompositingCoreAnimationPluginsBool in the WebKit source; this should be added to the formal NPAPI spec soon, but the value won't change, so you can hard-code it now and when Chrome supports it that will start returning true).
In general the iframe hack should work in recent versions of Chrome (what version are you testing?), but there are some bugs where it doesn't get noticed until the page gets a re-layout, so you might want to play with forcing that.
Note that your Streetview example isn't a valid test on Mac Chrome, because it's using wmode=opaque, which means it's using the CG mode, not CA mode, and thus compositing works completely regardless of the iframe hack.
What drawing method are you using? You shouldn't need to use an iframe over a plugin on Mac because all drawing is windowless, unless you're doing strange things that I wouldn't expect to be possible with Chrome (i.e. creating an opengl context over a coregraphics or quickdraw context). If you were doing something like that there would probably not be anything you could do.
One easy setting would be to just resize the plugin to 1x1 to effectively "hide" it.