Изображение не отображается при большом размере URL-адреса данных: net :: ERR_CONNECTION_RESET - PullRequest
3 голосов
/ 12 февраля 2020

У меня есть изображение, закодированное в формате base64, и я пытаюсь отобразить его следующим образом.

<div class="card-body p-3 with-bottom-buttons">
    <div class="row h-100">
        <perfect-scrollbar>
            <div class="col">
                <img [src]="imageString" style="width:100%;height: auto;" class="cursor-pointer">
            </div>
        </perfect-scrollbar>
    </div>
</div>

Когда изображение не слишком большое, оно работает нормально, но для больших изображений оно не отображается. здесь есть ссылка для закодированного изображения.

https://stackblitz.com/edit/angular-9ub83l?file=image

Я попытался расшифровать это с помощью онлайн-инструментов, и это работает. Кажется, с кодировкой проблем нет.

image

И в консоли произошла ошибка.

net :: ERR_CONNECTION_RESET

Error Есть предложения?

1 Ответ

6 голосов
/ 13 февраля 2020

Я нашел решение для моей проблемы. Когда вы кодируете изображение, вам нужно передать дополнительный аргумент, прежде чем отправить его на сервер.

imgString = "data:image/jpeg;base64," + Base64.encodeToString(buffer, 0, length, Base64.NO_WRAP);

Надеюсь, это поможет, если кто-то та же проблема, что и у меня.

...