CameraContext

The CameraContext instance can be obtained via wx.createCameraContext.

CameraContext is bound to the unique camera component on the page to use the camera component.

Reference

Methods

startRecord

Starts video recording.

Reference

(option: StartRecordOption) => void

Property	Type
option	StartRecordOption

API Support

API	WeChat Mini-Program	H5	React Native
CameraContext.startRecord	✔️		✔️

stopRecord

Stops video recording.

Reference

(option?: StopRecordOption) => void

Property	Type
option	StopRecordOption

API Support

API	WeChat Mini-Program	H5	React Native
CameraContext.stopRecord	✔️		✔️

takePhoto

Takes a photo.

Reference

(option: TakePhotoOption) => void

Property	Type
option	TakePhotoOption

API Support

API	WeChat Mini-Program	H5	React Native
CameraContext.takePhoto	✔️		✔️

onCameraFrame

Gets the Camera real-time frame data.

Note: To use this API, you must specify frame-size in the camera component property.

Reference

(callback: OnCameraFrameCallback) => CameraFrameListener

Property	Type	Description
callback	OnCameraFrameCallback	Callback function

Sample Code

const context = wx.createCameraContext()
const listener = context.onCameraFrame((frame) => {
  console.log(frame.data instanceof ArrayBuffer, frame.width, frame.height)
})
listener.start()

API Support

API	WeChat Mini-Program	H5	React Native
CameraContext.onCameraFrame	✔️

Parameters

StartRecordOption

Property	Type	Required	Description
timeoutCallback	StartRecordTimeoutCallback	No	Video recording will end after 30 sec or the page is onHide.
complete	(res: any) => void	No	The callback function used when the API call completed (always executed whether the call succeeds or fails)
fail	(res: any) => void	No	The callback function for a failed API call
success	(res: Result) => void	No	The callback function for a successful API call

StartRecordTimeoutCallback

Video recording will end after 30 sec or the page is onHide.

(result: StartRecordTimeoutCallbackResult) => void

Property	Type
result	StartRecordTimeoutCallbackResult

StartRecordTimeoutCallbackResult

Property	Type	Description
tempThumbPath	string	The temporary path to cover images files
tempVideoPath	string	The temporary path to video files

StopRecordOption

Property	Type	Required	Description
complete	(res: any) => void	No	The callback function used when the API call completed (always executed whether the call succeeds or fails)
fail	(res: any) => void	No	The callback function for a failed API call
success	(res: Result) => void	No	The callback function for a successful API call

StopRecordSuccessCallbackResult

Property	Type	Description
tempThumbPath	string	The temporary path to cover images files
tempVideoPath	string	The temporary path to video files
errMsg	string	Call result

TakePhotoOption

Property	Type	Required	Description
quality	"high" | "normal" | "low"	No	Image quality
complete	(res: any) => void	No	The callback function used when the API call completed (always executed whether the call succeeds or fails)
fail	(res: any) => void	No	The callback function for a failed API call
success	(res: Result) => void	No	The callback function for a successful API call

TakePhotoSuccessCallbackResult

Property	Type	Description
tempImagePath	string	The temporary path to photo files (jpg for Android and png for iOS).
errMsg	string	Call result

OnCameraFrameCallback

Callback function

(result: OnCameraFrameCallbackResult) => void

Property	Type
result	OnCameraFrameCallbackResult

OnCameraFrameCallbackResult

Property	Type	Description
data	ArrayBuffer	The image pixel data, which is a one-dimensional array in which every four items express the RGBA color of one pixel.
height	number	The height of the image data rectangle
width	number	The width of the image data rectangle

quality

Property	Description
high	High quality
normal	Normal quality
low	Low quality

API Support

API	WeChat Mini-Program	H5	React Native
CameraContext.startRecord	✔️		✔️
CameraContext.stopRecord	✔️		✔️
CameraContext.takePhoto	✔️		✔️
CameraContext.onCameraFrame	✔️