Electron: Как я могу запросить изображение с URL-адреса и вернуться к процессу визуализации?

#node.js #image #http #electron #frontend

Вопрос:

Кто-нибудь может сказать мне, как получить изображение с помощью electron net.request ? Моя пробная версия возвращает некоторые неизвестные данные кодировки, и когда я возвращаю их в атрибут «src» тега «img» в процессе визуализации, я не могу получить изображение.

 let netInfo = {}
netInfo.host = "***"
netInfo.protocol = "***"
netInfo.method = 'GET'
netInfo.path = "***"

const request = net.request(netInfo)

request.on('response', (response) => {
    response.on('data', (chunk) => {
        console.log(`BODY: ${chunk}`)

        let replyData = {}
        replyData.apiName = 'get-verify-code-image'
        replyData.status = 'SUCCESS'

        replyData.data = `${chunk}`

        e.reply('api-request-reply', replyData)
        return
    })
    response.on('end', () => {
            console.log('No more data in response.')
    })
})
 

То, что я получаю от сервера, выглядит так:

 src="�PNG


IHDRP(i`}�IDATx��YohE_ܽKP)�H���EDTD��R�"*ED ZT����?�PB�BP(����?T%�����I ��
j)J�5���Pù�|ovvovo�v�v��!�v���ߛ���5�RJ)��RJ)�<�����,��d��k  V�
�yX��>e�5�^tZ��amp;xv։��   ]hS�����amp;��Þ��죊K�7Ż̘.�o:�   c'��X�ˣ��amp;~h�n��-�ܡյ�1h�d^�ˡg�gs9�;�t�*�[���.{~�9��"l���Ki֍C�#�z��*.q��p�ᤁS�O�m�y��bq�QQl030J��׽�[D8$�a%������|�8E�C��'Ê� ��^���lz�!�%{��lq�ϡ_%
��b����
#�5�"� O�ö#h�{�,����5 rR־(xPȊ�c7xx�a���Ne���%{���H�]�37���КV^�[r~����Bo.�Z��<���HW��^�oOk-��//;%��v���uwL��� 2ؗX��B"�U7���5٢I�GÓ���amp;����(]D���2���2|r�B��4�Ӏ� �ѩ(@LЕŐ�� �I��qU�2����Ꮡ�Ί?�$�*�2{%��@2W�Blӕamp;V}]5E��s�P���C)�GU$�P����OA�޽@!=I�[U�ݤb�|ޱ�O�ߣ_��_`���Dx�vMamp;�������p�t�E�oj��6�,����]�%�w�h�gxH�.7�amp;�<�=�P��(��[-�}�1v�q@��f���{ �����98�c� ������9��c�b�o���r��j�`��O_�}� 0`V]%�]�
��]Uuȫ���"�(�.ځ�T�G��]R�!}�Ӟ�M�"�T���y/���I�]�!����g���z�
rQ����cA��vRy��S9�^��1k'"�ۃa�τ��0{K)��g���������]�e�͚  O ��'#b��D��RE ��"����SB�Ґ�uJ#�8ӭmn�`X�̠�4��/�w���RoNlԩ������1�R�Ι�T#��<�%B�:JoT�����zg�amp;�h$N�x�~Í�'xRi�*���*�  x��[�6�#V��E$ ��3j�s4ڣ{��Uh��sS�t{a��e��Сo(�%��p�J�a5!L�u"�Y?]y��   '�q_����jȲf����Ů��-g4`�W޴Ӗq
��k� >��8�����3�g!UJ��T]r3�3�7U,x��;� pE�����(��w,{�������Ԇl��_Ӗ?a�ݻ���1��$�"����W
(����I�bt)�ݦ�,
r��HA0w��
�p�ƂRԣ ]�~�:��X��r?t��w�[
�]*%)��"ĿK�K��H]*걿NХ�ʜ�3� �r�ʿ��6���IEND�B`�"
 

Комментарии:

1. Возможно, вам захочется просмотреть URL-адреса данных , с помощью которых вы можете установить src атрибут для данных изображения (хотя это не необработанные данные, а закодированные-скорее всего, с использованием Base64). Может быть, это то, что вы ищете? Значение src атрибута в любом случае должно быть URL-адресом; простая установка его в исходные данные изображения не сработает (как вы видели).

2. @AlexanderLeithner Я добавил заголовки URL-адресов данных, такие как данные: изображение/png;base64,…, но это все еще не работает.

3. Ну, это, вероятно, потому, что данные не являются базовыми 64. Это необработанные данные изображения. Внимательно ознакомьтесь с документацией.

4. Чтобы превратить данные в Base64, вы можете использовать window.btoa(