Making a flash video streaming web-app using Actionscript 3's external Api. I am at a very rudimentary phase of the project where we're just experimenting with external interface. Right now i just have a flash object and 3 buttons each to play pause and load a video. The only button that is currently set up to do anything is the load button. My swf and my html file sit on the same file system, and my video files sit on another server with traffic being redirected through a media server.
When i press the load button, which should just give it the path of the video file on it's server. Instead it throws an error that reads "Error: Error Calling method on NPObject".
Without further adieu, here are snippets of relevant code:
ACTIONSCRIPT:
function loadVideo(newVideo){
clearInterval(progressInterval);
videoFile = newVideo;
stream.play(videoFile, 0, 0);
videoPositions = "0,0";
};
ExternalInterface.addCallback( "loadVideo", loadVideo );
JAVSCRIPT: (in the head of my html document)
<head>
<title> External API Test</title>
<script type="text/javascript">
var player = getFlashMovie();
if (typeof MY == 'undefined')
{
MY = {};
}
MY.load = function()
{
console.log('load called');
getFlashMovie().loadVideo("/media/preview/09/04/38833_2_720X405.mp4");
};
function getFlashMovie()
{
var isIE = navigator.appName.indexOf('Microsoft') != -1;
return (isIE) ? window['MYVID'] : document['MYVID'];
}
</script>
</head>
HTML:(in same document as javascript)
<body>
<div> This is a test</div>
<div class='my-media-player'>
<object width="720" height="405" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,16,0" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id='MYVID'>
<param value="as3VideoPlayer.swf" name="movie">
<param value="high" name="quality">
<param value="true" name="play">
<param value="false" name="LOOP">
<param value="transparent" name="wmode">
<param value="always" name="allowScriptAccess">
<embed width="720" height="405" name='MYVID' allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" loop="false" play="true" src="as3VideoPlayer.swf" wmode="transparent">
</object>
<div>
<button type="button" class='play'>Play</button>
<button type='button' class='pause'>Pause</button>
<button type='button' class='load' onclick='MY.load()'>Load</button>
</div>
</div>
</body>
Where is my mistake? I've read in a lot of places that this is an issue with security, but both my swf and html are in the same folder on my local machine. Only the files come from outside, and in any case I think i've set the security settings correctly when i declare my flash player in the object tag, but maybe i'm missing something there.
if you can't solve my question directly can someone please explain what "error calling method on NPObject" means? I'm sure its specific to flash-js communications because i've never seen it before and that's what i have gathered from my googling.
Thank in advanced.
I highly suggest SWFObject. Aside from that, I dare say you need to allow script access:
<script type="text/javascript">
// put your needed vars in the object below
var flashVars = {};
var params = {
allowScriptAccess:"always"
};
swfobject.embedSWF("myswf.swf", "myswf", "500", "400", "10.0.0", "", flashVars, params);
</script>
Can you try setting Security.allowDomain('*'); in your AS3 code right when it starts up?
Related
I have a requirement in a project which has to call an actionscript 3 function from javascript. I read many answers from stackoverflow and adobe and have created a simple test application. In that, I have used ExternalInterface.addCallback to register both the functions and I've also included the security permissions in both actionscript and in html.
Action Script 3 Embedded code
I did not use an external .as file instead i used the action panel to create the code.
import fl.controls.Button
import flash.events.MouseEvent;
flash.system.Security.allowDomain("*")
var butt:Button = new Button();
addChild(butt);
butt.label = "hello";
butt.toggle = true;
butt.move(50, 50);
butt.height = 100;
butt.addEventListener(MouseEvent.CLICK, clickhandle);
function clickhandle(e:MouseEvent)
{
if(butt.height == 100)
butt.height = 200;
else butt.height = 100;
}
ExternalInterface.addCallback("callas", clickhandle);
The test app will display a ac3 button. Upon clicking that button it will toggle the expanding and collapsing of its height through a click handler 'clickhandle'. This is the function i am intended to call from javascript.
HTML Code
<html>
<head>
<script>
function callas() {
var hehe = document.getElementById('cvpanel');
console.log(hehe);
hehe.clickhandle();
}
</script>
</head>
<body>
<p>Test</p>
<object id='cvpanel' name='cvpanel' width="425" height="350" type="application/x-shockwave-flash" data="one.swf">
<param value="one.swf" name="movie">
<param name="allowscriptaccess" value="always"/>
<p>You need Flash to see it.</p>
</object>
</body>
</html>
The application runs under http://localhost through apache and all the files needed are in the same folder. I could run the application and could see the buttons appearing. By clicking it they toggle in height as expected.
When i call the function callas from browser console i get the error in console as
"TypeError: hehe.clickhandle is not a function"
in firefox and similar in Internet Explorer.
Is there anything missing?
In flash you're exposing clickhandle as callas
ExternalInterface.addCallback("callas", clickhandle);
so you're supposed to call callas() from javascript
var hehe = document.getElementById('cvpanel');
hehe.callas();
I am working on a project that is intended to track users using Local Shared Objects. The user first visits page A, which has an embedded .swf that plants a Local Shared Object. I know it works by testing it my own flash cookies.
Upon visiting page B, another embedded .swf will attempt to retrieve the flash cookie and call an AJAX function if the cookie is present. Page B is what I am having trouble with. On this webpage is embedded a .swf object, along with an AJAX function. The following code is the HTML for page B. It includes the AJAX script, along with an embedded .swf.
<!DOCTYPE html>
<html lang="en">
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
function databaseAndemail(){
$.get('http://www.mywebsite.com/databaseAndemail.php');
}
</script>
</head>
<body>
<object width="1" height="1">
<param name="CheckLSO" value="http://www.mywebsite.com/CheckLSO.swf">
<embed src="http://www.mywebsite.com/CheckLSO.swf" width="1" height="1">
</embed>
</object>
</body>
The problem is not with the AJAX function, nor the PHP script, because I know that works. The problem may lie within the .swf script that is meant to check the LSO. This is the AS3 script called CheckLSO.swf:
public function Main():void
{
//Check for a LSO
var myLocalData:SharedObject = SharedObject.getLocal("myData");
if (myLocalData.data.uname != null){ //LSO exists, so call AJAX function to update database and send email.
if (ExternalInterface.available){
ExternalInterface.call("databaseAndemail");
}
};
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}
I'll include the AS3 script that sets the cookies here for your information (again, I've tested this one and it works):
public function Main():void
{
// Create a new SharedObject
var myLocalData:SharedObject = SharedObject.getLocal("myData");
// Save data to the SharedObject
myLocalData.data.uname = "ERE";
myLocalData.flush();
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}
To sum it up, I think for some reason the Javascript function is not being called by External Interface. I know the cookie is set, I know the AJAX works, and I know the PHP script works (I haven't included the PHP, it seems like it would be outside the scope of this question). Both .swf scripts are debugged. I use FlashDevelop with Flex 4. These are really simple scripts, so I can't think of anything else that might be going wrong. Any ideas??
Might be the script access setting. On the embed, try including the param allowscriptaccess: "always". External Interface calls will fail without it.
<object width="1" height="1">
<param name="CheckLSO" value="http://www.mywebsite.com/CheckLSO.swf">
<param name="allowscriptaccess" value="always">
<embed src="http://www.mywebsite.com/CheckLSO.swf" width="1" height="1"></embed>
</object>
Better yet, use swfObject 2 to embed your swf.
SwfObject
I'm trying to call a very simple JavaScript function from ActionScript but I can't seem to make it work. Here is my code:
JavaScript
function alert() {
alert("hi");
}
ActionScript
ExternalInterface.call("alert");
HTML
<object width="500" height="500"
classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
codebase="http://fpdownload.macromedia.com/
pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0">
<param name="SRC" value="FlashApp.swf"/>
<param name="allowScriptAccess" value="always" />
<embed src="FlashApp.swf" width="500" height="500" allowScriptAccess="always">
</embed>
</object>
Maybe it's because there is already an alert function? This works for me.
//js
function myAlert() {
alert("hi");
}
//as3
ExternalInterface.call("myAlert");
The AS3 code :
public class Main extends Sprite
{
public function Main():void
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point
ExternalInterface.call("myAlert");
}
}
Make sure that the javascript is initialized before you call that method. Depends on luck, really, unless you work at it. I suspect Baris Usakli has a fast pc and the js is initialized faster than the swf is.
Use swfobject to embed the swf when the javascript onload event occurs. This way you KNOW the js function exists and you can call it.
Bonus points, swf object embeds it for most if not all browsers, with no fuss and with negligible overhead.
I am using swfobject to pass along flashvars to flash/as3, but i cannot get it to work.
The first code repent my attempt at using swfobject:
<script type="text/javascript" src="../js/swfobject.js"></script>
<script type="text/javascript">
var flashvars = {
testVar:"123"
};
swfobject.embedSWF("falsh.swf", "flashDiv", "990", "600", "10.0.0", false, flashvars);
</script>
<div id="flashDiv"></div>
The second code is my attempt to do the same thin using the tag
<object data="falsh.swf?testVar=123"
width="990" height="600" type="application/x-shockwave-flash">
<param name="quality" value="high" /></object>
For some unknown reason only the second code block successfully sends along the flashvars.
Do anyone have an idea what is wrong? Any help will be much appreciated
swfobject requires the name + id attributes to be set in order to pass the flashvars
I am trying to use the ExternalInterface.call function in my ActionScript(2.0) to get a javascript var value set in the wrapping document. The following seems to work in FireFox and in Chrome but, naturally, it does not work in IE(8). Can anyone suggest another method for getting the value stored at this variable? Thanks!
var linkPath = ExternalInterface.call("function(){return window.customLinkLocation;}", null);
JavaScript:
<head>
<script type="text/javascript">
var customLinkLocation = "http://localhost/file.xml";
</script>
</head>
Could it be the way I am embedding my swf??
<body>
<object width="550" height="400" id="mySwf">
<param name="movie" value="mySwf.swf">
<embed src="mySwf.swf" width="550" height="400">
</embed>
</object>
ExternalInterface.call("window.customLinkLocation.toString");
are you embedding swf with id provided?
http://forums.adobe.com/message/2638459#2638459
From my understanding of the documentation and some (but not too much) previous experience: You need to call a function by supplying its name. You can't execute custom code from ActionScript. In you case you need to create a function in JavaScript that returns the values you need.
function getCustomLinkLocation(){
return customLinkLocation;
}
and call
ExternalInterface.call("getCustomLinkLocation");
I don't know why Firefox and Chrome allow you to call an anonymous function, but the ExternalInterface reference doesn't say anything about it.
From ActionScript, you can do the following on the HTML page:
Call any JavaScript function.
Pass any number of arguments, with any names.
Pass various data types (Boolean, Number, String, and so on).
Receive a return value from the JavaScript function.
Got it. The problem is that IE requires that you use the classid attribute on the 'object' element.
<object width="550" height="400" id="mySwf" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
<param name="movie" value="mySwf.swf">
<embed src="mySwf.swf" width="550" height="400">
</embed>
</object>
Also make sure allowscriptaccess is set to 'always' in your embed code.
You can also do this:
ExternalInterface.call("eval","getVar=function(obj){return obj}");
var yourVar:String = ExternalInterface.call("eval","getVar(JSvar)");