首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >从远程服务器获取图像的ajax

从远程服务器获取图像的ajax
EN

Stack Overflow用户
提问于 2016-11-01 05:36:21
回答 2查看 21.7K关注 0票数 5

我在这里撞到墙了。我不知道我在做什么,啊!我试图让jquery从远程服务器请求gif映像。我认为它在做它应该做的事情,但我现在不知道该去哪里,因为我已经得到了数据。这是我用来从服务器获取数据的函数:

代码语言:javascript
复制
   function showGetResult(name){
         var result = null;
         var URL = name;
         $.ajax({
            url: URL,
            type: 'get',
            dataType: 'html',
            async: false,
            crossDomain: 'true',
            success: function(data, status) {
                console.log("Status: "+status+"\nData: "+data);
                result = data;
            } 
         });
         return result;
    };

当我得到gif图像数据时,它会把这个扔到我身上.

%$L=5Ķ�4�~|�ʼ$�nTDFT���|eS�չ��s��v���tR<�n]LJCĨ��zdtn\D2<><̰�d^VdRE�°$LbdlWD�ua�~p�zp���|vlLC;4%<2-\N<L2 tnl"$��jD>,,:$T>+�zY���D95,������4BLl~t��̌��435\\���|�|���$,GIF87ad d�T�F$��xtcS�Ǫ$��z <.,dYT�~d��l��wted���TFDԴ����dO::4���T>44:D<)���|ZD�~y�Ƭ�zhܾ��Ҽ̶�����n�©D2-�z\�����|$"lbX��sD7+�����z4+$ lYU��l�vl���lR<4&$D0#\QL��~,��=^P4-,�����u̪�|oalRF��o���|oo$#$���lfd���dI<��t�j\DBD\VTdWL�sdtYDTE<ı�te\�ʴ���\FDԶ�L>D��|L9,,64�ztԾ�|f\���\F<̲�TfdlYLLFD\OD���42,���,jY\J;l^L*,D>:l^U,�zm>,\JD,D��a�.�@B�ڞx�1�A��hg�p.��c��2B@�"5N�a!�q�b��k-�Ċ��F�Hh��P1SΞ1M�L��& /��Y�ɢ̀�4\�����V#�H��v�SF�T�,�'֩eg��ɖm�>>!~�{�O7F$���S�O�l\;�C�/?��*���1&�M�b��4ZӼx!DH���' M��=&�b�<n�7V-�^�ʒ�����⃯�_���Hp��=�<_�cD��q����)K�o���9�-˼,\XUUyp�K1����Bp������S<ڵ�\0��B�x�2&a��|�{�b�M:��B�Tf�z�H‘�;�2���/�E_TTH-�QH�0(��@!r��y����lc��p��1��O?��=�����8&����Pq�Ў/�,p�)M���1�5U\*h@�ń�!��\�{ FH�s�a��E���6M �&:ю6L�&�@�B�\�;�Ԏ�<������.��2�k�qL d�U.�f�0S%R�!!���&!�$�9Qow�IW<{B qp�6�@FOc�X���N>2{��q�/b�AO��c�&��M;"�C��P_͋]�Ņ���=�x�A����U�K��J�S;�#�b���67�VL�Ci�@������K�������&�&;������|8L-{x� ��;:�B�4i4�2� ��F䃱����H&2�kq� {��Y��6Cm���W���0��.D7�S � ��Z�8����ao�T�;!Dn�*{�ю ��'&�p �K1�pM�d-�� ڸ���3� ܞ{l�z��b�.�� ~I�B ��5$�)]�E=�P�%.!����:�� ���9�qN|@0p�<��<��c�0!h�!?8B_�a at�k���%����h!3\0����H@�#��h� �}1�.�H]��q�ax��X� �p��@:D� .D��j�(��P+?� �a�d�WJ���)�� ��Y̘03&M ��0H�$4���lƯxH�p�MG*� �a��8�Ae���1��d�-\���l/��“tѻ�G��01����P�;�+Br�(��lH�b�EZ�%!� A�1�W#���A�0��50�03+8�S�}�_}@���ҡ�7xG;���)<�.�� 1�ڜ���a0I$A�t�ͬ��u��A�<So�t��Qo,Gn l��g �tЋ3CY�����_�� U0=�!����� ���J6�^�?x��G���L!�&�L���V�IL�C1���M$p�)�I��=�$�%��(@V��‘8�wpc��bюю�&h�bqm��i��D-$>ԃ���$Α�>���BP7�%���@,��>�,��K<���a|!��Kl�<��]�������)����Z+x������4Lb��PO̠��E>���!��C1n����P *0 \t��MT"�0�e�Ŕ�����,: ��MLY]��X�@�IL���ja�r�d���sT��~Ā��@.N��8��ʸ����+������Aa&��ƚ��=�2�r����֨�X� ��M�@��!u���0+6�� (c����a�#̀�G+ġ��B�80�3��J��E~a��)�ˠ.�Q4[D�l�B5~� �XH�]��vV m��(�C1t!��aCɘ'���k�qМ ����>�#���-� UhP���6��TA5�Flgj+# u}�^��&8�xJ�����6_�Lq@"���� ����&D� 5��$/�� !xC,聇}���F1�q�v��xw�Z0�3����F,� e�A] U��$��F1,�j��d�!*��|�p��6T��!#�6����T�{�8|Und���QlP]y��䁗�,�y�ȩ���I$����5��H�=|��He=���7V�P��a�A������)TJ�����1�� o�n�0 ��@�� %I1y�Ld@L�I��!9p~�:J��.q\��@{�� (� ��� ��|��p�b�p@�M0T!Ӑg�:p =��B@L�eu7�R&3�P83�D= � ����R��=n�p�����3�1��:�n@7����2b0��ܐ���。u�o�t��dؗ}�t��IG��0XY���E/�D��� , Ѡ ܰ�$�� �Vn�A, 8���?@FP6����� b%�L��O��z]1 }�Hw��W2�c��4�l !?�� �h�V��,�SiA�pU�n� b�ipF�<�p�P ��uo������aNq\��_p��\�V[��H��XfL�hk9��>I��“B bp50 S@Y��0W�}I0�0�y�2c3bJ��@9�E!~R�:@W~@�����p���p(�����S$k‘�)�/4n�8d@6 6pWPg��Pc�Ct{�,pR‘�P.p<�Qڠ�p�4�P?x�s BA�F@n@���� �� j�L�C E�D�i)�Eg��W�_��z~� �$�a� _P,’9��Y��������péx0ڠ�t D�7!���D0?���E7���}|�Z��?p=���tI$Иg��sg�@����9a#�pCV0Y0 1�1���������L��({]��(�}�व�q�֙JEG�~��0�������͐]�y(�oP��@?@��#�i���Еn��P${�G��0�����D:�}��T�����JEZ�}��bzd !��9�}��0p +p )(�A�i���P�{��nP��^ w��,�[���ɟ��� ����DE�P�X��� 80� O��+ �/G � ��p��Ve������:�={��+n�2�“��P,���pi�[4ɰ���ʊ�Y��Q����nP�hak�pe��x�}��Zn@�0�Z�H�#:0_y�;RP�+�:T�P����To��j����ݩ��pM�U���4���}�������@����:��~���p�Z����0 H���%7�j����p J���0F�Ⱥ�E‘���y���<����zp��#zp e��0��S_8��S_(8)发展�Y-�� {��0� ������@� �F���8�pܻ�;�$�7���pP��� �<�����Ee�b� � �����g(�=�*�u#�p��b��p-P+ZP�� o g��)0a�P�R��Pa�0"�%,�9@�~��9��0�b(x=0���“j�����J��) �A��+�h��7�V��~�0��0ʰ��~��נd��?P j�����Q˰��#� в��<�4E���$�}����#�uي�}���(�}���(���7�Ѱn������P]����#��������0���c�Sa���a��!�ZI��c�!ɰ��7Pqp���7Pqp���L9���P b5去往H����#�@I�@aׇW�KI} � u��u�@~�]�LX�Z~ � x��}ܓ$�����%�\�P���;7�*z@� ���7Fp-P&P公司PF0���%�����&mJ]4��y�Ev��t����!p�H��t@����0���p.��׀*��P:�������R?����l��1�$�g,�\!����E�@��޵�ϚZ n�""h-�~�x<���t� �P��oPzh�a�^�KUQ� ZE����E�+�Q�� �P�� � 4�D�(��{o��[�+���r��}���t�U͠ �4���������vb�� �I �� Ѐ���O�@����C0R�\P P ����v@T������+O�~��G��| ���)� � ����0� ��{n��(�ؼ ]�� +�Uq�PW��yP��p��ǠR(/� L@T@��� }P�q�! �� ��g9 +г9@F+@ɀ��aPW��T�X�E�{� �6x@���Vp��~�Q9 0p �J�y�;W"���Š������9���e؆��4�F���1���1��@�b������HԂ3��@ %;R�#Gң�$kF�jC?pn�iv1��U-I����Ց$��5N�O?�qk7 7�X 6���&!M X/N��ť�0h���‘&pHp����;��u�Gb3__`������Y3�9j��c�'U��؋3o�~��86O1�������Dq��V�a�^���>�r�Ǐ,2( 1D�,�4�)�'��j("�8r#�C��F�v�ZRs�6#-LL�����4.���b����R�����u��GB-�a,)__�� ?<��+@B "�j�e#?&|W������� �� �b�Azθ��,�__��V-�p��,(���d�E-��".��hf��LV���o�r��v�BK�U���Lh�>�w�e��.2@ *�HY3�4> c�“萃�i�y$��*?!���蒌�Dl�Y���E*�@�z P�����b!6��7��'fpp�) ^@�B(%"7� *�2�#*��s YJ��H�B��dܠV:B2<�JT�V yK�6d^0EeH�FGj�n��)F��8x���7p�ޠ�^���B;^Rc!X����d���be�Wԃ%�[-18�����D-I%���A.P�P�����w�b��_4�|A�A%�t!�A�U-⑐����R!�yծ!Bj��#�3�B�C����/�B�r�^%�Lr�@�!(5���fL�7������إH�҂��=��b����!�h��[r��1�gpqy�Qd���_KҖz��\���k�“R�z�G��E,b�U�hbn�:4��zs gpqy‘Z0i)T+R n8K-:l!P 1JtЛ+����i�jQ,~�^h�!��C-zG�k�"+@�FP�{^)��;�Ƃ7�m+����|�P 70D�|��U���"CZ\ A��3J��(�X,Q��Y�+H�m!B�u���%R]�V�K�� �;B�+FRwg�@�V��,r���[��DC�Vg�P>��OCB=" .��c 0y�*@�Co8n-B����"D4,3�!(@Bo�s%m�����c��:Go"��0��x�g�pG-f�����(h�P��0P�@�P�?���-�G0�� �)�\@4~��*r�h|�@�>��sզ+h�R�܀t�Tz�t�B|���X-tP ���BZd���=��/��]LBbL�PVP� �L"i"���&b&�l�Â�Ɋ�A-��2$�,��&0j�����[�BB�w���0��5����-B)j�>�BL����M�7�~�����@�($�B�n��f���D:���.m�Mn~�����XC7hӪ[@��{:0�0m��U�����"P�Hyj��vA�+���2hY����T�ah��@���l�-�D�!/�$.���VR�D����P�R\�ٶ�~��、Q、E、E、���、9I、��“�、�、H、���、M、����、D80、?_P������3�?�rC>、��8(�l��n�Ab���F�1;����)Ra��!P�2%����d�� ��d'��+�C�U7�m���U�����0 "�|�8j�P��kp�2��Z��h�h+ ���?(��yH\Ќ�����;p�#�Mh�= �hY��ځ0@h�(Mx�ZH#���p8��J0�%�_�?�� � 3h8(58�����t�X8����7Plh�whfh�}��S؂��-�� ��a�7�H�cЂ2p�K�d���u��h$P�"�a7����#X8��+� K�;� ��8�|hz`���8�@�m�X�t(�w�lP�S0� 0��U� Z�$x ��p((�ɩ��I2M`0Ě��;�"B��b��=���)�C�v �Ʉ'�#0��jȅoІs�6��9�zp�W��"�mX�Z�0��N�zx�� p&8��c\p0��\���)� ����� �x�%���A��R�F�Ћ���3��7�8j�Zk�?��3(I>p����!@<z(@>^���@� �e�C\�X�bx���0 ��8���0?B�#(�#�`Ѝ����F (�,h�z� �Xh��"�J46Ȃ7���8�h�@.H U{jU��#��8��>ȃU�](�y���X��v��x�@ �L��h@蒈d��� � ���A�N�I�w� q��2���V "|p����mH��j{ �7x.P>{��~�j�_X�0��3X�b؂��}��qx�*�7�L�/ �H^�.�M�����4��^��I\�pH2��� ���f�E ^��;��%��}��ڃ.�� ��v�vh1�NX�2�+��,P ��x� ��(��1 �x @.�tܜ��"�0I��i��k��?8 @UЁ���8+a8#�1x�h���2�f&i�3�q�1p�S�qH�~8�\�Qj@�h��8xL��|�z�)��)��@��x�4R���M���J8h��H�?��$�h��Є�Y�b��Jȁ0ȁi�jȁiȁj#en0#q q_0 q_06�Pr�pȁ2�=��s���J�����@�2(��U0?�!��8�w(�J�L�|��#w��bȂ3h�y �c�S��X:|�wP�S�ոF+�N�i�0�\xd4 �;hx�kxZ�+J/F���H����A�^�� 18�ȇq�8�@mP{��!P���[�e��_؇JO���lq� �1�0-h�k8n��?�0�%8�X��j���ȇ����);���H�VQ+r�J����m��PA��|�a�#�B@w�(&����{�=8��#�X08����l�8���fh�th m�mA�K�����3؆v0�,P�I(��X��v�h�J��'�7h$@��)M�!@�%)l��"i4O؃]hl(�7�,0�^��q��) ���_H^�a�\�Myj8l��j�+P�_�@�?(�4���08bw�p��8�k��W�]!˦�PA@��1q�� ��w�;mh�lȂ"��z�e��\x[ ����eP�^����I�@�}x��m���&8�i8�i8���1x-��J�_hP|�|�*��r�' -�9m����F ���ІH�}��7��,���z 8hO�&�O(�z��2h�/P�=�q�+r ���Q��=�ib� 7� "F���� J.��8k-[�h�4���N�^��� �_H��1��[0U����7�nP.�pD��M� n8�A�-�)0z�\ȅs8�y0�~�yNe�p�7xp�j돁�j��!h?�������zh�[p�s�50�|@�݃$8���0�J���h 2H�ц�2&�WqQ�/`>�8�zh�,T7 e���֍e��\H�x�Ё�l���j����p0�H���1�G��[��c�,8���“�n��9�n��9����0����u����xO����xO 1 b”(B)<0 J��h z,h_w_2���֍X_(WPI)X_i X_l_d_d@1_z;

这是什么,我该拿它做什么?谢谢。

EN

回答 2

Stack Overflow用户

发布于 2016-11-01 08:32:13

代码语言:javascript
复制
var data_received = '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';


/* PUT THIS INSIDE AJAX SUCCESS */
var img = $('<img id="image_id">');
img.attr('src', 'data:image/png;base64,' + data_received);
img.appendTo('#image_div');
代码语言:javascript
复制
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="image_div">
  
</div>

不是回答,而是建议。为什么不只获取ajax请求中的图像url (万一图像托管在某个地方),并在src标记中使用这个url作为img属性。

代码语言:javascript
复制
 $.ajax({
        url: URL,
        type: 'get',
        dataType: 'html',
        async: false,
        crossDomain: 'true',
        success: function(data, status) {
            console.log("Status: "+status+"\nData: "+data);
            result = data;

            /* creating image assuming data is the url of image */
            var img = $('<img id="image_id">');
            img.attr('src', data);
            img.appendTo('#id_of_element_where_you_want_to_add_image'); 
        } 
});

或者,如果要在ajax响应中获取编码的映像,可以使用:

代码语言:javascript
复制
$.ajax({
        url: URL,
        type: 'get',
        dataType: 'html',
        async: false,
        crossDomain: 'true',
        success: function(data, status) {
            console.log("Status: "+status+"\nData: "+data);
            result = data;

            /* creating image */
            var img = $('<img id="image_id">');
            img.attr('src', 'data:image/gif;base64,' + data);
            img.appendTo('#id_of_element_where_you_want_to_add_image'); 
        } 
});
票数 8
EN

Stack Overflow用户

发布于 2021-04-08 20:45:14

您可以将此代码用于各种照片格式,只需将png替换为gif,jpeg (只需更改url并复制粘贴代码)。

首先生成原始base64,然后使用jquery从responseBody获取图像的base64原始数据。

代码语言:javascript
复制
$.ajax({
    type: "GET",
    url: "imageURL",
    beforeSend: function (xhr) {
        xhr.overrideMimeType('text/plain; charset=x-user-defined');
    },
    success: function (result, textStatus, jqXHR) {       
        if(result.length < 1){
            alert("The thumbnail doesn't exist");
            $("#thumbnail").attr("src", "data:image/png;base64,");
            return
        }

        var binary = "";
        var responseText = jqXHR.responseText;
        var responseTextLen = responseText.length;

        for ( i = 0; i < responseTextLen; i++ ) {
            binary += String.fromCharCode(responseText.charCodeAt(i) & 255)
        }
        $("#thumbnail").attr("src", "data:image/png;base64,"+);

        /* PUT THIS INSIDE AJAX SUCCESS */
        var img = $('<img id="image_id">');
        img.attr('src', 'data:image/png;base64,' + btoa(binary));
        img.appendTo('#image_div');
    },
    error: function(xhr, textStatus, errorThrown){
        alert("Error in getting document "+textStatus);
    } 
});
代码语言:javascript
复制
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="image_div"></div>
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/40354638

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档