core: use blob url for image fetch

This commit is contained in:
Koushik Dutta
2022-01-07 22:56:02 -08:00
parent df8bd3f00b
commit 585b4c6d8b
6 changed files with 17 additions and 29 deletions

View File

@@ -1,12 +1,12 @@
{
"name": "@scrypted/core",
"version": "0.0.168",
"version": "0.0.169",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "@scrypted/core",
"version": "0.0.168",
"version": "0.0.169",
"license": "Apache-2.0",
"dependencies": {
"@koush/wrtc": "^0.5.0",

View File

@@ -1,6 +1,6 @@
{
"name": "@scrypted/core",
"version": "0.0.168",
"version": "0.0.169",
"description": "Scrypted Core plugin. Provides the UI, websocket, and engine.io APIs.",
"author": "Scrypted",
"license": "Apache-2.0",

View File

@@ -1,4 +1,4 @@
import { ScryptedDevice, Camera, ScryptedMimeTypes, RTCAVMessage, MediaManager, VideoCamera, MediaStreamOptions } from '@scrypted/sdk/types';
import { ScryptedDevice, ScryptedMimeTypes, RTCAVMessage, MediaManager, VideoCamera, MediaStreamOptions, MediaObject } from '@scrypted/sdk/types';
export async function streamCamera(mediaManager: MediaManager, device: ScryptedDevice & VideoCamera, getVideo: () => any, createPeerConnection: (configuration: any) => RTCPeerConnection) {
let selectedStream: MediaStreamOptions;
@@ -106,4 +106,10 @@ export async function streamCamera(mediaManager: MediaManager, device: ScryptedD
pc.close();
throw e;
}
}
}
export async function createBlobUrl(mediaManager: MediaManager, mediaObject: MediaObject): Promise<string> {
const buffer = await mediaManager.convertMediaObjectToBuffer(mediaObject, 'image/*');
const blob = new Blob([buffer]);
return URL.createObjectURL(blob);
}

View File

@@ -25,9 +25,7 @@
<script>
import { ScryptedInterface } from "@scrypted/sdk/types";
import DashboardBase from "./DashboardBase";
import { streamCamera } from "../../common/camera";
var currentStream;
import { createBlobUrl, streamCamera } from "../../common/camera";
const scryptedServerVariables = {};
scryptedServerVariables.registrationId = "web:/web/message";
@@ -75,12 +73,7 @@ export default {
} else {
picture = await this.device.getVideoStream();
}
const result = await this.$scrypted.mediaManager.convertMediaObjectToLocalUrl(
picture,
"image/jpeg"
);
const url = new URL(result);
this.src = url.pathname;
this.src = await createBlobUrl(this.$scrypted.mediaManager, picture);
},
},
mounted() {

View File

@@ -50,7 +50,7 @@
<script>
import RPCInterface from "./RPCInterface.vue";
import { streamCamera } from "../common/camera";
import { createBlobUrl, streamCamera } from "../common/camera";
import { ScryptedInterface } from "@scrypted/sdk/types";
import ClipPathEditor from "../components/clippath/ClipPathEditor.vue";
import cloneDeep from "lodash/cloneDeep";
@@ -123,13 +123,7 @@ export default {
},
async refresh() {
const picture = await this.device.takePicture();
this.$scrypted.mediaManager
.convertMediaObjectToLocalUrl(picture, "image/*")
.then((result) => {
this.picture = true;
const url = new URL(result);
this.src = url.pathname;
});
this.src = await createBlobUrl(this.$scrypted.mediaManager, picture);
},
},
watch: {

View File

@@ -1,4 +1,5 @@
<script>
import { createBlobUrl } from '../common/camera';
import Camera from "./Camera.vue";
export default {
@@ -6,13 +7,7 @@ export default {
methods: {
async refresh() {
const videoStream = await this.device.getVideoStream();
this.$scrypted.mediaManager
.convertMediaObjectToLocalUrl(videoStream, "image/jpeg")
.then((result) => {
this.picture = true;
const url = new URL(result);
this.src = url.pathname;
});
this.src = await createBlobUrl(this.$scrypted.mediaManager, videoStream);
},
},
};