C # Как получить растровое изображение из динамического <img>в коде в .aspx - PullRequest
0 голосов
/ 07 марта 2019

Я использую тег видео, чтобы сделать снимок экрана видео на веб-странице и поместить его в элемент img.Затем я хочу опубликовать его в коде, чтобы обработать его растровое изображение.Я использую UpdatePanel для обратной передачи.Когда я запускаю это в отладчике, он захватывает изображение из видео, строит холст, рисует изображение в элемент, правильно отображает изображение, а затем вызывает функцию Decode в коде позади.Тем не менее, img.src пуст в коде функции декодирования.

<asp:UpdatePanel runat="server" UpdateMode="Conditional" EnablePartialRendering="true"/>
<asp:Button runat="server" AutoPostBack="true" OnClientClick="return screenshotButton()" OnClick="Decode" Text="Capture"></asp:Button>
<canvas id="theCanvas" style="display: none;"></canvas>
<img runat="server" Name="theImg" Id="theImg"/>
</asp:UpdatePanel>

...

function screenshotButton() {
    canvas.width = videoElement.videoWidth;
    canvas.height = videoElement.videoHeight;
    canvas.getContext('2d').drawImage(videoElement, 0, 0);
    theImg.src = canvas.toDataURL('image/webp');
    return true;
};

Как я могу получить растровое изображение theIg в коде позади?

Ответы [ 2 ]

1 голос
/ 07 марта 2019

Содержимое изображения не включается в данные обратной передачи.

Поскольку вы используете UpdatePanel, вы можете добавить HiddenField, в который вы также сохраните URI-код Base64.
При обратной передаче вы можете прочитать и проанализировать содержимое этого скрытого поля.

<asp:HiddenField ID="HiddenField" ClientIDMode="Static" runat="server" value=""  />

Включите это в ваш скрипт.

document.getElementById("HiddenField").value = canvas.toDataURL('image/webp');
0 голосов
/ 07 марта 2019

Попробуйте, используя asp: Image. Затем вы можете установить источник программно.

...