FLASH 调用摄像头 JS中方法触发拍照,并将照片保存到本地文件夹

使用 FLASH CS4 开发

有些方法和实现过程是在网上趴的,经过自己的修改,为自己所用。

建一个文件,不用添加任何控件,直接F9 输入如下代码:

import com.adobe.images.JPGEncoder;
import com.adobe.images.PNGEncoder; 


var vid:Video; 
var cam:Camera = Camera.getCamera(); 
cam.setMode(400,450,15) // 设置相机在长,宽,侦


// 显示文本信息
var tf:TextField = new TextField(); 
tf.x = 480; // 文本显示在起始位置
tf.autoSize = TextFieldAutoSize.LEFT; 
addChild(tf); 


if (cam != null) { 
cam.addEventListener(StatusEvent.STATUS, statusHandler); 
vid = new Video(400,450); 
vid.attachCamera(cam);
// 旋转270度 (因为我的设备上摄像头向左转了90度,所以需要下边在方法)
centerRotate(vid, 270);
} 


function statusHandler(event:StatusEvent):void { 
    if (!cam.muted)  { 
        vid.width = cam.width; 
        vid.height = cam.height;
        addChild(vid); 
    } 
    cam.removeEventListener(StatusEvent.STATUS, statusHandler); 
} 








        
/* 一个测试方法,可以用JS调用的 */
ExternalInterface.addCallback("testAS",testFunc);
function testFunc(txt:String):String{
    tf.appendText("2222:::"+txt+"\n"); 
    ExternalInterface.call("saveBrushCardInfo","");
    return "SUCCESS";
}

// 获得照片信息(该方法被JS调用)
ExternalInterface.addCallback("getImageAS",getImage);
function getImage(url:String):void{
    // 拍照获得照片byte数组
    var bitmapData:BitmapData = new BitmapData(vid.height, vid.width-55, false, 0xFFCC00);
    bitmapData.draw(vid);
    var bytes:ByteArray = PNGEncoder.encode(bitmapData);

    // 将照片byte发送请求到后台处理
    var req:URLRequest = new URLRequest(url);
    req.data = bytes;
    req.method = URLRequestMethod.POST;
    req.contentType = "application/octet-stream";

    var loader:URLLoader = new URLLoader();
    loader.dataFormat = URLLoaderDataFormat.BINARY; 
    loader.load(req);
//tf.appendText("3333333333333:::"+"\n");
    loader.addEventListener(Event.COMPLETE, completeHandler);

}

// 回调函数, 调用JS方法 saveBrushCardInfo
function completeHandler(evt:Event):void {
    // ExternalInterface.call("asCallJS","I,m AS!");
    ExternalInterface.call("saveBrushCardInfo","");
    //    trace(evt.target.data);
}

/** 
 * 绕中心点旋转 
 * @param   mc  元件 
 * @param   angle   角度  360  280
 */  
function centerRotate(mc:DisplayObject,angle:Number):void{  
//获取mc不旋转时候的尺寸  
var currentRotation:Number = mc.rotation;  
//tf.appendText("currentRotation:::"+currentRotation+"\n"); 
mc.rotation = 0;  
var mcWidth:Number = mc.width;  
var mcHeight:Number = mc.height;  
//mc.rotation = currentRotation;  

//获取mc当前中心点坐标  
var pointO:Point = mc.localToGlobal(new Point(mcWidth / 2, mcHeight / 2));  
//tf.appendText("pointO:::"+pointO.x +" --- "+pointO.y +"\n"); 
//旋转mc  
mc.rotation = angle;  

//获取mc旋转后中心点坐标  
var pointO2:Point = mc.localToGlobal(new Point( mcWidth/ 2, mcHeight / 2));
//tf.appendText("pointO2:::"+pointO2.x +" --- "+pointO2.y +"\n"); 

//平移到原来中心点O  
var p3:Point = pointO.subtract(pointO2);  // 减去
//tf.appendText("p3:::"+p3.x +" --- "+p3.y +"\n"); 
var matrix:Matrix = mc.transform.matrix;  
matrix.translate(p3.x, 400);

mc.transform.matrix = matrix;  
 
}

// 向左旋转90
function scaleLeft(bmp:BitmapData):BitmapData{ 
var m:Matrix = new Matrix(); 
m.rotate(-Math.PI/2); 
m.translate(0,bmp.width); 
var bd:BitmapData = new BitmapData(bmp.height, bmp.width,false); 
bd.draw(bmp,m); 
return bd; 
}


保存flash 为webCamera.fla

点击F12 运行 ,导出html文件,生成webCamera.fla, webCamera.html,webCamera.swf及com包。

此时运行webCamera.html是可以调用设备上的摄像头。

处理完FLASH, 就该处理考虑JS调用拍照,并用java保存了。

webCamera.html中javascript 的内容做成js, 取名为AC_RunActiveContent.js,方便放在jsp中使用。

webCamera.html改成webCamera.jsp.jsp中调用AC_RunActiveContent.js,webCamera.html中

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0" 
					width="660" height="580" id="webCamera" align="middle">
				<param name="allowScriptAccess" value="sameDomain" />
				<param name="allowFullScreen" value="false" />
				<param name="movie" value="../../pages/pad/liShiJi/flash/webCamera.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#ffffff" />	
				<embed src="../../pages/pad/liShiJi/flash/webCamera.swf" quality="high" bgcolor="#ffffff" width="550" height="400" name="webCamera" align="middle" 
					allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer_cn" />
				</object>
代码就是实现调用摄像头的功能。

在jsp中增加JS方法

var URL = "http://IP:端口/项目/lishiji/getImgAndSave"; //java 保存图片的方法
	function getImageAS(){
		var swf = window["webCamera"] || document["webCamera"]; // 获得FLASH控件
		swf["getImageAS"](URL); // 这个方法得注意了,是调用flash控件中的 getImageAS方法,并传参数URL. getImageAS方法在控件的代码中有,可以去查看。
	}
其中getImageAS方法如下(此代码已经在flash中了):

// 获得照片信息(该方法被JS调用)
ExternalInterface.addCallback("getImageAS",getImage);   // 设置JS中调用的getImageAS方法对应的着这里的getImage方法
function getImage(url:String):void{
    // 拍照获得照片byte数组
    var bitmapData:BitmapData = new BitmapData(vid.height, vid.width-55, false, 0xFFCC00);
    bitmapData.draw(vid);
    var bytes:ByteArray = PNGEncoder.encode(bitmapData);

    // 将照片byte发送请求到后台处理
    var req:URLRequest = new URLRequest(url);
    req.data = bytes;
    req.method = URLRequestMethod.POST;
    req.contentType = "application/octet-stream";

    var loader:URLLoader = new URLLoader();
    loader.dataFormat = URLLoaderDataFormat.BINARY; 
    loader.load(req);
    // 当处理完图片后,再调用JS的方法,将照片在页面中展示出来(此方法可以根据需要,要或者不要的)
    loader.addEventListener(Event.COMPLETE, completeHandler);

}
// 回调函数, 调用JS方法 saveBrushCardInfo
function completeHandler(evt:Event):void {
    ExternalInterface.call("saveBrushCardInfo","");
}


java接收图片的方法是

		if ("application/octet-stream".equals(request.getContentType())) {
			try {
				int i = request.getContentLength();
				byte buffer[] = new byte[i];
				int j = 0;
				while (j < i) { // 获取表单的上传文件
					int k = request.getInputStream().read(buffer, j, i - j);
					j += k;
				}

				if (buffer.length >= 0) { // 文件是否为空
					File file = new File("D\\:/flash/newImg.png");
					OutputStream out = new BufferedOutputStream(
							new FileOutputStream(file, true));
					out.write(buffer);
					out.close();
				}
			} catch (Exception e) {
				e.printStackTrace();
			}

		}

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值