ajax从远程服务器获取图像

Question

我在这里撞墙了。我不知道我在做什么，呸！我正在尝试使用 jquery ajax 从远程服务器请求 gif 图像。我认为它正在做它应该做的事情，但是我现在得到了数据，不知道该去哪里。这是我用来从服务器获取数据的函数：

   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 图像数据时，它会向我抛出这个......

GIF87ad d ? T?|F$??xtcS??$??z <.,dYT?~d??l??wted???TFD???dO:TNC,%$L=5??4?~ |??$?nTDFT???|eS????s??v???tR<?n]LJC \D2<><??d^VdRE?°$LbdlWD?ua?~p?zp???|vlLC;4%<2-\N<L2 tnl"$??jD>,,:$T>+?zY???D95,??????4BLl~t?????435\\??? zdtn ???|?|???$,$\fldJL?¼t^? ?????dbl?????tjeTJE0JD???L>+,: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>,|je\JD, dd ? /? ??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 ?;????=??q???????U ?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;?d?-\???l/? 在？"?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??G??01? ???P?;???Zx?lP ^??f \??? 它？？？？?+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=?!??G？？？L！？&?L???V?IL?C1???M$p?)C?N? ?LF???T ???p???/Z? 米？？??? ???J6?^??x??? ？？？UT???y?%?)?Ih?p?,?,??-?!?I??=?$?%??(@V??'8?wpc??b?i? &h? bqm??i??D-$>????$??>???BP7?%???@,??>?,??K<???a|!??Kl?<? ?]???????)????Z+x????? ?4Lb??PO???E>???!??C1n????P *0 \t??MT"?0?e???????,: ??MLY]??X?@?IL?? ？罐？???<? 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? ?$?sf?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 =?Lp ?B@L?eu 7?R&3?P83?D= ? ????R??=n?p? ？？？3?1??:?n@7??2b0?????? . ？乙？：？bp50 S@Y？?0W?}I0?0?y?2c3bJ? ?@9?E!~R?:@W~@?????p?? ?p(?????S$k'?(3??????2(??WB??Jd 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??"?/4n ?8d@6pWPg? ?Pc?C[t{?,?p???????b&?? RP1?PK5?? } ?D??W?4aN??h1b??u:3??Y????????pé x0? ?t D?7!???D0??&?)??}?@? ??? E7?}pR'!9? ?H?J 1?@!?L!??9?? ?Pp<?Q??p?4?P?x? s BA?F@n@???? ?? j?L?C E?D?i)?Eg??W?_??z~? ?$?a? _P,]?tI$?g?? sg |?Z???p=?? ?@? ???9,??0?1?? a#?pCV0Y0 ??? ??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?;??pM?U???4???}???????@??? ?:??~ ???p?Z????0 H? ??%7?j? RP?+?:T?P????To??j????? p J ???0F???E'???y???<??Hp ??ZP??#zp e?? 0?S?8?P?J??~????9??0?b{|0? ??"j ?Y-?? {??0? ??????@? ?F???8?p??;?$?7???pP??? ?<?????Ee?b? ? ?????g(?=?*?u#?p??b??p-P+ZP?? o g??)0a?P?R??Pa?0"?%,?9@?~??J??

?A??+?h??7?V??~?0? ?0???~???d? ?? ?P j?????Q??? #?

?/???你?? ???<?4E???$?}???(?I??7??n? ???? ?P]????#? |???????0??? c?Sa???a? ?!?ZI??c?!???7Pqp??? 70?e?? ?@ ?? ?l9??P b5?re?H?? @I?@a?W?KI} ? u??u?@~?]?LX?Z~ ? x??}?$?????%?\?P???;7?*z@? ???7?Fp-p&? P?PF0???%?????&mJ]4??y?Ev??t????!p?H t??t@????0???p.???* ? ?P:?? ??bpky=? ???????R?????l??1?$?g,??q??I??8? ?{A??????0J?u?7?Z?? k:d]??{]0?n?1&cq ?!W? ?\!????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?{? ?6 x@??? Vp? ?~?q9 0p

?J?y?;W"??????????9???e???4 ????? ? ?F??? 1??T|@?b?? ?? ??＆S ???? 9＆??？ ？P27?(adF???}?G0? 0.?Zp?????{?? +???|@inp 8?\N :h?k?p?O\n&p#?P\???(????YV??P?？@4???h&?K=,N??e???X?G (？？？????2??p??8?k?pb=??? ?Y2?????????-Uv?@??Ub FIsO?)?9X,??x|1???l?d@?????P(???C??C2?/???????G?????+??*?U0?R 5我？2?x??!(U4 J'-〜JS4 ?? ??? ??? H 3 ?? @〜％;？？？？·R U-我?????$??5n? O??qk7?Xm6???&!MX/N????0h???'&pHp????? ?#G?? $kF?jC?pn ?iv1?;??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,?? V--?p?? ?<??+@B "?j?e#?&|W??????? ?? ?b?Az?,? ?,?)?+?a?I?e???H@????H?T ?a ???d?E-??".??hf??<L?B?.??a?&"??k?7??A?w??G_??g?y???b^P???(&?a?&B8???j??h&(N??.?#P ? ????.?(L?b?^?t?=p+w@r???G?}?H?4??p?C???h?#t?t8?n?(@ \Y $??q??!C}?? CA????^??j??&~p? ??? ?v?y??&Fp??hA???p? dY?x??2 &?j?=??!Õx?q#5??G?$???????"#RK? S??)~?????? 7??%?y*??+ *8%??p?=^??[2???V?e ? ????Y?Zx ?? ?|?q^??[???Bô???!~@??V ?P?[??3?Q?G1??x6"? |X??V??J7B"f?T?/H?$???#?h??L?:,R?#???d??ø??! Z?!.n@?q ???v?m????if?x???_G???J?S/$c?!??>LV???o?r??v?BK?U???Lh ? >?w?e?? . 2@???@)? *?HY3?4> c?” ??i?y$?F? *? ！????? 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?????DI%?AP?P?? ?w?b??_4?|A?A%?t!?A? U-?????R!?y?!Bj??#?3?B?C????/? B?r?^%?Lr?@?!??8D?=?cZ?(W? 9,?)5???fL?7?????H??=??b ？？？？！? h??[r??1?gpqy?Qd???|K?z??\?? ?k?"R?z? G??E,b?U?hbn ?:4???zs?\?P?Z0i"??T+??D?n8K-?:L！??[?t?? 1Jt?+????i? jq？？？,~?^h?!??C-zG?k?"+@?FP?{^)??;?P 70D?|]??U???"CZ\ A??3J? ??7?m+????|(?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???9I??"? ?+w# ????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 ?=?l?5|?OY?? J8h??H????$?h??Y?b??J?0?I?j??&0?q???q0?6?J???@?2(? ?U0??!?Pr?p?2?=??s????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?? ?xq?f?H??K??W?b??7??+h?????=??7??}?[@?w?qY$R??ymC?Xp??zh ?[p?s?50?|@?? $8???0?J???h 2H???2&?WqQ?/`>?8?zh?,? ???e??\H?X??? l???j????P0?H???1?G??[??c?,8???"t7" |?8?n??9? ???0?u ????xO? 1？<0J ???hz??h?w??) ? ??2?X??wPI??X??? l?d@1？？？?z?? ;

这是什么，我该怎么办？？谢谢。

Answer 1

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');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="image_div">
  
</div>

不是答案而是建议。为什么不只获取 ajax 请求中的图像 url（以防图像托管在某处）并使用此 url 作为标签中的src属性img。

 $.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 响应中获取编码图像，则可以使用：

$.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'); 
        } 
});