|
1 | 1 | # Camera Web Plugin
|
2 | 2 |
|
3 |
| -A Flutter plugin for Web allowing access to the device cameras. |
| 3 | +The web implementation of [`camera`][camera]. |
4 | 4 |
|
5 |
| -*Note*: This plugin is under development. |
| 5 | +*Note*: This plugin is under development. See [missing implementation](#missing-implementation). |
6 | 6 |
|
7 |
| -In order to use this plugin, your app should depend both on `camera` and `camera_web`. This is a temporary solution until a plugin is released. |
| 7 | +## Usage |
| 8 | + |
| 9 | +This package is [endorsed](https://flutter.dev/docs/development/packages-and-plugins/developing-packages#endorsed-federated-plugin), which means you can simply use `camera` normally. This package will be automatically included in your app when you do. |
| 10 | + |
| 11 | +## Example |
| 12 | + |
| 13 | +Find the example in the [`camera` package](https://pub.dev/packages/camera#example). |
| 14 | + |
| 15 | +## Limitations on the web platform |
| 16 | + |
| 17 | +### Camera devices |
| 18 | + |
| 19 | +The camera devices are accessed with [Stream Web API](https://developer.mozilla.org/en-US/docs/Web/API/Media_Streams_API) with the following [browser support](https://caniuse.com/stream): |
| 20 | + |
| 21 | + |
| 22 | + |
| 23 | +Accessing camera devices requires a [secure browsing context](https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts). This means that you might need to serve your web application over HTTPS. For insecure contexts `CameraPlatform.availableCameras` might throw a `CameraException` with the `permissionDenied` error code. |
| 24 | + |
| 25 | +### Device orientation |
| 26 | + |
| 27 | +The device orientation implementation is backed by [`Screen Orientation Web API`](https://www.w3.org/TR/screen-orientation/) with the following [browser support](https://caniuse.com/screen-orientation): |
| 28 | + |
| 29 | + |
| 30 | + |
| 31 | +For the browsers that do not support the device orientation: |
| 32 | +- `CameraPlatform.onDeviceOrientationChanged` returns an empty stream. |
| 33 | +- `CameraPlatform.lockCaptureOrientation` and `CameraPlatform.unlockCaptureOrientation` throw a `PlatformException` with the `orientationNotSupported` error code. |
| 34 | + |
| 35 | +### Flash mode and zoom level |
| 36 | + |
| 37 | +The flash mode and zoom level implementation is backed by [Image Capture Web API](https://w3c.github.io/mediacapture-image/) with the following [browser support](https://caniuse.com/mdn-api_imagecapture) (as of 12 August 2021): |
| 38 | + |
| 39 | + |
| 40 | + |
| 41 | +For the browsers that do not support the flash mode: |
| 42 | +- `CameraPlatform.setFlashMode` throws a `PlatformException` with the `torchModeNotSupported` error code. |
| 43 | + |
| 44 | +For the browsers that do not support the zoom level: |
| 45 | +- `CameraPlatform.getMaxZoomLevel`, `CameraPlatform.getMinZoomLevel` and `CameraPlatform.setZoomLevel` throw a `PlatformException` with the `zoomLevelNotSupported` error code. |
| 46 | + |
| 47 | +### Taking a picture |
| 48 | + |
| 49 | +The image capturing implementation is backed by [`URL.createObjectUrl` Web API](https://developer.mozilla.org/en-US/docs/Web/API/URL/createObjectURL) with the following [browser support](https://caniuse.com/bloburls): |
| 50 | + |
| 51 | + |
| 52 | + |
| 53 | +The web platform does not support `dart:io`. Attempts to display a captured image using `Image.file` will throw an error. The capture image contains a network-accessible URL pointing to a location within the browser and should be displayed using `Image.network` or `Image.memory` after loading the image bytes to memory. |
| 54 | + |
| 55 | +See the example below: |
| 56 | + |
| 57 | +```dart |
| 58 | +if (kIsWeb) { |
| 59 | + Image.network(capturedImage.path); |
| 60 | +} else { |
| 61 | + Image.file(File(capturedImage.path)); |
| 62 | +} |
| 63 | +``` |
| 64 | + |
| 65 | +## Missing implementation |
| 66 | + |
| 67 | +The web implementation of [`camera`][camera] is missing the following features: |
| 68 | +- Video recording |
| 69 | +- Exposure mode, point and offset |
| 70 | +- Focus mode and point |
| 71 | +- Camera closing events |
| 72 | +- Camera sensor orientation |
| 73 | +- Camera image format group |
| 74 | +- Camera image streaming |
| 75 | + |
| 76 | +<!-- Links --> |
| 77 | +[camera]: https://pub.dev/packages/camera |
0 commit comments