HarmonyOS 实名认证-活体视频录制如何完成?

1.实名认证时,调取摄像头后,页面添加蒙版/文字该如何实现?

2.调取摄像头后如何录制视频及预览视频?

HarmonyOS
1天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
zbw_apple

参考示例:

Index.ets

import abilityAccessCtrl, { Permissions } from '@ohos.abilityAccessCtrl';
import common from '@ohos.app.ability.common';
import router from '@ohos.router'

class routerParams {
  text:string
  data:string

  constructor(str:string, data:string) {
    this.text = str
    this.data = data
  }
}
const TAG: string = 'CAMERA_TAG';
@Entry
@Component
struct Index {
  scroller: Scroller = new Scroller()
  private controller: VideoController | undefined;
  @State videosrc: string = '';
  @State path:string="";
  @State text:string="";
  permissions: Array<Permissions> = [
    'ohos.permission.CAMERA',
    'ohos.permission.MICROPHONE',
    'ohos.permission.WRITE_MEDIA',
    'ohos.permission.READ_MEDIA',
    'ohos.permission.MEDIA_LOCATION',
  ];
  atManager = abilityAccessCtrl.createAtManager();
  onPageShow(){
    try{
      this.path=(router.getParams() as routerParams).data
      console.log(this.path);
    }catch (e){
      return;
    }
  }
  //第1步:请求权限
  async requestPermissions() : Promise<boolean>{
    return await new Promise((resolve: Function) => {
      try {
        let context = getContext() as common.UIAbilityContext;
        this.atManager.requestPermissionsFromUser(context, this.permissions)
          .then(async () => {
            console.info(TAG, "权限请求成功")
            resolve(true)
          }).catch(() => {
          console.info(TAG, "权限请求异常");
          resolve(false)
        });
      } catch (err) {
        console.info(TAG, "权限请求err:" + err)
        resolve(false)
      }
    });
  }
  build() {
    Stack({ alignContent: Alignment.TopStart }) {
      Scroll(this.scroller) {
        Column() {
          if (this.path) {
            Video({
              src: "file://" + this.path,
              controller: this.controller
            }).height('60%').width('60%')
          }
          Button("录制视频")
            .width('90%')
            .height(45)
            .backgroundColor('#0080FF')
            .fontSize(16)
            .fontColor(Color.White)
            .margin({ top: 30 })
            .onClick(async () => {
              let result = await this.requestPermissions();
              if(result) {
                router.pushUrl({ url: "pages/cameraRecord"})
              }
            })

        }.width('100%')
      }
      .scrollable(ScrollDirection.Vertical)
      .scrollBar(BarState.On)
      .scrollBarColor(Color.Gray)
      .scrollBarWidth(20)
    }.width('100%').height('100%').backgroundColor(Color.White)
  }
}

cameraRecord.ets

import camera from '@ohos.multimedia.camera';
import media from '@ohos.multimedia.media';
import { BusinessError } from '@ohos.base';
import common from '@ohos.app.ability.common';
import router from '@ohos.router';
import fileUri from '@ohos.file.fileuri';
import fs from '@ohos.file.fs';
const TAG: string = 'CAMERA_TAG';

/**
 * 视频录制
 */
class routerParams {
  text:string
  data:string
  constructor(str:string, data:string) {
    this.text = str
    this.data = data
  }
}

/**
 * 新建并打开文件
 */
function createOrOpen(path: string) : fs.File{
  let isExist = fs.accessSync(path);
  let file: fs.File;
  if(isExist) {
    file = fs.openSync(path, fs.OpenMode.READ_WRITE);
  }else {
    file = fs.openSync(path, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE)
  }
  return file;
}

@Entry
@Component
struct cameraRecord {
  private mXComponentController: XComponentController = new XComponentController;
  private surfaceId: string = '';
  //预览控件宽高
  @State xComponentWidth: number = 0;
  @State xComponentHeight: number = 0;
  @State videoUri: string = "";
  url: string = "";
  @State recording: boolean = false;//正在录制视频
  @State isPause: boolean = false;//是否暂停录制
  @State isFinished: boolean = false;
  @State path:string ="";
  @State cameraManager: camera.CameraManager | undefined =undefined;
  @State videoOutput: camera.VideoOutput | undefined =undefined;
  @State captureSession: camera.Session | undefined =undefined;
  @State cameraInput: camera.CameraInput | undefined =undefined;
  @State previewOutput: camera.PreviewOutput | undefined =undefined;
  @State avRecorder: media.AVRecorder | undefined =undefined;
  controller: VideoController = new VideoController();

  aboutToAppear() {
    let context = getContext() as common.UIAbilityContext;
    this.path = context.filesDir + "/" + "VIDEO_" + Date.parse(new Date().toString()) + ".mp4";
    let file = createOrOpen(this.path);
    this.url = "fd://" + file.fd;
    this.videoUri = fileUri.getUriFromPath(this.path);
  }

  build() {
    Stack({ alignContent: Alignment.Top }) {
      if (!this.isFinished) {
        XComponent({
          id: 'componentId',
          type: 'surface',
          controller: this.mXComponentController,
        }).onLoad(async () => {
          this.surfaceId = this.mXComponentController.getXComponentSurfaceId();
          let baseContext = getContext() as common.BaseContext;
          await this.initCamera(baseContext, this.surfaceId)
        }).width('100%')
          .height('100%')
        Text('正对屏幕,将人脸完全置于下面圆框内')
          .width(350).height(30).textAlign(TextAlign.Center)
          .position({  y: 100 })
          .fontColor('#afffffff')
        Text('录制开始后依次大声读取上述蓝色数字')
          .width(350).height(30).textAlign(TextAlign.Center)
          .position({ y: '70%' })
          .fontColor('#ffffffff')
      } else {
        Video({
          src: this.videoUri,
          controller: this.controller
        }).autoPlay(true)
      }
      Column() {
        Button("返回", { type: ButtonType.Circle, stateEffect: false })
          .width(80).height(80).fontSize(16).fontColor('#ffffff').margin({ left: 20, top: 20 })
          .onClick(() => {
            this.controller.stop();
            // this.stopRecord();
            let options: router.RouterOptions = {
              url: '',
              params: new routerParams("沙箱路径", this.path)
            }
            router.back(options);
          })
        Blank()
        if (!this.isFinished) {
          Row() {
            Button(this.recording ? "停止录制" : "开始录制", { type: ButtonType.Circle, stateEffect: false })
              .width(120).height(120).fontSize(20).margin({ left: 20 }).fontColor('#ffffff')
              .onClick(() => {
                if(this.recording) {
                  this.stopRecord();
                }else {
                  this.startRecord();
                }
                this.recording = !this.recording;
              })

            Button(this.isPause ? "继续录制" : "暂停录制", { type: ButtonType.Circle, stateEffect: false })
              .width(120).height(120).fontSize(20).margin({ left: 20 }).fontColor('#ffffff')
              .onClick(() => {
                if(!this.isPause) {
                  this.pauseRecordingProcess();
                }else {
                  this.resumeRecordingProcess();
                }
                this.isPause = !this.isPause;
              })
          }
          .width('100%')
          .height(120)
          .margin({ bottom: 60 })
          .justifyContent(FlexAlign.Center)
          .alignItems(VerticalAlign.Center)
        }
      }.width('100%')
      .height('100%')
      .justifyContent(FlexAlign.Start)
      .alignItems(HorizontalAlign.Start)

    }.width('100%')
    .height('100%')
  }

  //第1步:初始化照相机
  async initCamera(baseContext: ESObject, surfaceId: string) {
    this.cameraManager = camera.getCameraManager(baseContext);
    if (!this.cameraManager) {
      console.error(TAG, "camera.getCameraManager error");
      return;
    }

    //监听照相机状态变化
    this.cameraManager.on('cameraStatus', (err: BusinessError, cameraStatusInfo: camera.CameraStatusInfo) => {
      console.info(TAG, `camera : ${cameraStatusInfo.camera.cameraId}`);
      console.info(TAG, `status:  ${cameraStatusInfo.status}`);
    });
    // 获取相机列表
    let cameraArray: Array<camera.CameraDevice> = [];
    try {
      cameraArray = this.cameraManager.getSupportedCameras();
    } catch (error) {
      let err = error as BusinessError;
      console.error(`getSupportedCameras call failed. error code: ${err.code}`);
    }

    if (cameraArray.length <= 0) {
      console.error("cameraManager.getSupportedCameras error");
      return;
    }
    for (let index = 0; index < cameraArray.length; index++) {
      console.info(TAG, 'cameraId : ' + cameraArray[index].cameraId); // 获取相机ID
      console.info(TAG, 'cameraPosition : ' + cameraArray[index].cameraPosition); // 获取相机位置
      console.info(TAG, 'cameraType : ' + cameraArray[index].cameraType); // 获取相机类型
      console.info(TAG, 'connectionType : ' + cameraArray[index].connectionType); // 获取相机连接类型
    }
    let CameraDevice:camera.CameraDevice = cameraArray[1]
    // 获取相机设备支持的输出流能力
    let cameraOutputCap: camera.CameraOutputCapability = this.cameraManager.getSupportedOutputCapability(CameraDevice,camera.SceneMode.NORMAL_VIDEO);
    if (!cameraOutputCap) {
      console.error(TAG, "cameraManager.getSupportedOutputCapability error");
      return;
    }
    console.info(TAG, "outputCapability: " + JSON.stringify(cameraOutputCap));

    //预览流与录像输出流的分辨率的宽高比要保持一致
    let previewProfilesArray: Array<camera.Profile> = cameraOutputCap.previewProfiles;
    let position: number = 0;
    if (previewProfilesArray != null) {
      previewProfilesArray.forEach((value: camera.Profile, index: number) => {
        console.info(TAG, `支持的预览尺寸: [${value.size.width},${value.size.height}]`);
        if (value.size.width === 1920 && value.size.height === 1080) {
          position = index;
        }
      })
    } else {
      console.error(TAG, "createOutput photoProfilesArray == null || undefined");
    }
    let photoProfilesArray: Array<camera.Profile> = cameraOutputCap.photoProfiles;
    if (!photoProfilesArray) {
      console.error(TAG, "createOutput photoProfilesArray == null || undefined");
    }

    this.xComponentWidth = previewProfilesArray[position].size.width;
    this.xComponentHeight = previewProfilesArray[position].size.height;
    this.mXComponentController.setXComponentSurfaceSize({
      surfaceWidth: previewProfilesArray[position].size.width,
      surfaceHeight: previewProfilesArray[position].size.height
    });

    let videoProfilesArray: Array<camera.VideoProfile> = cameraOutputCap.videoProfiles;
    if (!videoProfilesArray) {
      console.error("createOutput videoProfilesArray == null || undefined");
    }

    let metadataObjectTypesArray: Array<camera.MetadataObjectType> = cameraOutputCap.supportedMetadataObjectTypes;
    if (!metadataObjectTypesArray) {
      console.error("createOutput metadataObjectTypesArray == null || undefined");
    }

    // videoProfile的宽高需要与AVRecorderProfile的宽高保持一致,并且需要使用AVRecorderProfile锁支持的宽高
    let videoSize: camera.Size = {
      width: 1920,
      height: 1080
    }
    let videoProfile: undefined | camera.VideoProfile = videoProfilesArray.find((profile: camera.VideoProfile) => {
      return profile.size.width === videoSize.width && profile.size.height === videoSize.height;
    });

    if (!videoProfile) {
      console.error('videoProfile is not found');
      return;
    }

    // 配置参数以实际硬件设备支持的范围为准
    let aVRecorderProfile: media.AVRecorderProfile = {
      audioBitrate: 48000,
      audioChannels: 2,
      audioCodec: media.CodecMimeType.AUDIO_AAC,
      audioSampleRate: 48000,
      fileFormat: media.ContainerFormatType.CFT_MPEG_4,
      videoBitrate: 2000000,
      videoCodec: media.CodecMimeType.VIDEO_AVC,
      videoFrameWidth: videoSize.width,
      videoFrameHeight: videoSize.height,
      videoFrameRate: 30
    };

    let aVRecorderConfig: media.AVRecorderConfig = {
      audioSourceType: media.AudioSourceType.AUDIO_SOURCE_TYPE_MIC,
      videoSourceType: media.VideoSourceType.VIDEO_SOURCE_TYPE_SURFACE_YUV,
      profile: aVRecorderProfile,
      url: this.url, // 文件需先由调用者创建,赋予读写权限,将文件fd传给此参数,eg.fd://45--file:///data/media/01.mp4
      rotation: 270, // 合理值0、90、180、270,非合理值prepare接口将报错
      location: { latitude: 30, longitude: 130 }
    };
    
    try {
      this.avRecorder = await media.createAVRecorder();

    } catch (error) {
      let err = error as BusinessError;
      console.error(`createAVRecorder call failed. error code: ${err.code}`);
    }

    if (this.avRecorder === undefined) {
      return;
    }

    try {
      await this.avRecorder.prepare(aVRecorderConfig);
    } catch (error) {
      let err = error as BusinessError;
      console.error(`prepare call failed. error code: ${err.code}`);
    }

    let videoSurfaceId: string | undefined = undefined; // 该surfaceID用于传递给相机接口创造videoOutput
    try {
      videoSurfaceId = await this.avRecorder.getInputSurface();
    } catch (error) {
      let err = error as BusinessError;
      console.error(`getInputSurface call failed. error code: ${err.code}`);
    }
    if (videoSurfaceId === undefined) {
      return;
    }
    // 创建VideoOutput对象
    try {
      this.videoOutput = this.cameraManager.createVideoOutput(videoProfile, videoSurfaceId);
    } catch (error) {
      let err = error as BusinessError;
      console.error(`Failed to create the videoOutput instance. error: ${JSON.stringify(err)}`);
    }
    if (this.videoOutput === undefined) {
      return;
    }
    this.videoOutput.on('frameStart', () => {
      console.info('Video frame started');
    });
    // 监听视频输出错误信息
    this.videoOutput.on('error', (error: BusinessError) => {
      console.log(`Preview output error code: ${error.code}`);
    });
    
    //创建会话
    try {
      this.captureSession = this.cameraManager.createSession(camera.SceneMode.NORMAL_VIDEO) as camera.VideoSession;;
    } catch (error) {
      let err = error as BusinessError;
      console.error('Failed to create the CaptureSession instance. errorCode = ' + err.code);
    }
    if (this.captureSession === undefined) {
      return;
    }

    // 开始配置会话
    try {
      this.captureSession.beginConfig();
    } catch (error) {
      let err = error as BusinessError;
      console.error(TAG, 'Failed to beginConfig. errorCode = ' + err.code);
    }

    // 创建相机输入流
    let cameraInput: camera.CameraInput | undefined = undefined;
    try {
      cameraInput = this.cameraManager.createCameraInput(CameraDevice);
    } catch (error) {
      let err = error as BusinessError;
      console.error(`Failed to createCameraInput. error: ${JSON.stringify(err)}`);
    }
    if (cameraInput === undefined) {
      return;
    }
    // 监听cameraInput错误信息
    let cameraDevice: camera.CameraDevice = cameraArray[1];
    cameraInput.on('error', cameraDevice, (error: BusinessError) => {
      console.log(`Camera input error code: ${error.code}`);
    });

    // 打开相机
    try {
      await cameraInput.open();
    } catch (error) {
      let err = error as BusinessError;
      console.error(`Failed to open cameraInput. error: ${JSON.stringify(err)}`);
    }

    // 向会话中添加相机输入流
    try {
      this.captureSession.addInput(cameraInput);
    } catch (error) {
      let err = error as BusinessError;
      console.error(`Failed to add cameraInput. error: ${JSON.stringify(err)}`);
    }

    // 创建预览输出流,其中参数 surfaceId 参考下面 XComponent 组件,预览流为XComponent组件提供的surface
    let previewOutput: camera.PreviewOutput | undefined = undefined;
    try {
      previewOutput = this.cameraManager.createPreviewOutput(previewProfilesArray[position], surfaceId);
    } catch (error) {
      let err = error as BusinessError;
      console.error(`Failed to create the PreviewOutput instance. error: ${JSON.stringify(err)}`);
    }

    if (previewOutput === undefined) {
      return;
    }
    // 向会话中添加预览输入流
    try {
      this.captureSession.addOutput(previewOutput);
    } catch (error) {
      let err = error as BusinessError;
      console.error(`Failed to add previewOutput. error: ${JSON.stringify(err)}`);
    }

    // 向会话中添加录像输出流
    try {
      this.captureSession.addOutput(this.videoOutput);
    } catch (error) {
      let err = error as BusinessError;
      console.error(`Failed to add videoOutput. error: ${JSON.stringify(err)}`);
    }

    // 提交会话配置
    try {
      await this.captureSession.commitConfig();
    } catch (error) {
      let err = error as BusinessError;
      console.error(`captureSession commitConfig error: ${JSON.stringify(err)}`);
    }

    // 启动会话
    try {
      await this.captureSession.start();
    } catch (error) {
      let err = error as BusinessError;
      console.error(`captureSession start error: ${JSON.stringify(err)}`);
    }

    // 启动录像输出流
    this.videoOutput.start((err: BusinessError) => {
      if (err) {
        console.error(`Failed to start the video output. error: ${JSON.stringify(err)}`);
        return;
      }
      console.log('Callback invoked to indicate the video output start success.');
    });
  }

  //第2步:录制
  async startRecord() {
    if (this.avRecorder) {
      // 开始录像
      try {
        await this.avRecorder.start();
      } catch (error) {
        let err = error as BusinessError;
        console.error(`avRecorder start error: ${JSON.stringify(err)}`);
      }
    }
  }

  //第3步:停止录像
  async stopRecord() {
    if (this.avRecorder) {
      // 停止录像
      try {
        // 停止录像输出流
        if (this.videoOutput){
          this.videoOutput.stop((err: BusinessError) => {
            if (err) {
              console.error(`Failed to stop the video output. error: ${JSON.stringify(err)}`);
              return;
            }
            console.log('Callback invoked to indicate the video output stop success.');
          });
        }
        // 停止录像
        try {
          await this.avRecorder.stop();
          await this.avRecorder.release();
        } catch (error) {
          let err = error as BusinessError;
          console.error(`avRecorder stop error: ${JSON.stringify(err)}`);
        }
      } catch (error) {
        let err = error as BusinessError;
        console.error(TAG, `avRecorder stop error: ${JSON.stringify(err)}`);
      }
      // 停止当前会话
      try {
        if (this.captureSession ) {
          this.captureSession.stop();
        }
        // fs.closeSync(file);
        // 释放相机输入流
        if (this.cameraInput ) {
          this.cameraInput.close();
        }
        // 释放预览输出流
        if (this.previewOutput) {
          this.previewOutput.release();
        }
        // 释放录像输出流
        if (this.videoOutput) {
          this.videoOutput.release();
        }
        // 释放会话
        if (this.captureSession) {
          this.captureSession.release();
        }
        // 会话置空
        if (this.captureSession) {
          this.captureSession = undefined;
        }

        this.isFinished = true;

      }catch (error) {
        let err = error as BusinessError;
        console.error(TAG, `avRecorder stop error: ${JSON.stringify(err)}`);
      }
    }
  }

  // 暂停录制对应的流程
  async pauseRecordingProcess() {
    if (this.avRecorder != undefined && this.avRecorder.state === 'started') { // 仅在started状态下调用pause为合理状态切换
      await this.avRecorder.pause();
      if (this.videoOutput){
        this.videoOutput.stop((err: BusinessError) => {
          if (err) {
            console.error(`Failed to stop the video output. error: ${JSON.stringify(err)}`);
            return;
          }
          console.log('Callback invoked to indicate the video output stop success.');
        });
      }
    }
  }
  // 恢复录制对应的流程
  async resumeRecordingProcess() {
    if (this.avRecorder != undefined && this.avRecorder.state === 'paused') { // 仅在paused状态下调用resume为合理状态切换

      await this.avRecorder.resume();
      // 启动录像输出流
      if (this.videoOutput) {
        this.videoOutput.start((err: BusinessError) => {
          if (err) {
            console.error(`Failed to start the video output. error: ${JSON.stringify(err)}`);
            return;
          }
          console.log('Callback invoked to indicate the video output start success.');
        });
      }
    }
  }
}
分享
微博
QQ
微信
回复
1天前
相关问题
实名认证Button的实现
400浏览 • 1回复 待解决
HVD Manager登录失败 已实名认证
8309浏览 • 1回复 待解决
如何录制视频并设置最大录制时长?
152浏览 • 0回复 待解决
HarmonyOS 视频录制相关问题
433浏览 • 0回复 待解决
HarmonyOS 启动相机,录制视频问题
462浏览 • 1回复 待解决
HarmonyOS 视频录制报错
37浏览 • 1回复 待解决
HarmonyOS Camera录制视频如何适配竖屏
178浏览 • 0回复 待解决
需要视频录制、压缩的demo
244浏览 • 1回复 待解决
HarmonyOS 活体检测
35浏览 • 1回复 待解决
HarmonyOS 视频抽帧上传的完成链路
587浏览 • 1回复 待解决