使用base64格式字符串播放音频

使⽤base64格式字符串播放⾳频使⽤base64格式字符串播放⾳频前端框架：React平台：Node.js现有需求：使⽤base64格式字符串播放⾳频遇到的坑：现在的前端发展迅速，⽹上很多以前的代码⽆法使⽤，都已经过时，⽽且找不到最新⽂档，这个是当前能够⽤的代码。base64格式⾳频播放前端控制台报错如下：DOMException:Failedtoloadbecausenosupportedsourcewasfound.解决⽅案：letsnd=newAudio(`data:audio/x-wav;base64,${response.data}`);snd.play();/*response.data如下：UklGRsq9AABXQVZFZm10IBIAAAABAAEAIlYAAESsAAACABAAAABkYXRhpL0AAAAAAAAA....*/注意点：不同格式的⽂件需要加上不同的前缀此处使⽤的是mp3格式⽂件，因此前缀是data:audio/x-wav;base64,如果是wav格式考虑使⽤data:audio/wav;base64,更多格式:123application/vnd.lotus-1-2-33gpvideo/3gppaabapplication/x-authoware-binaamapplication/x-authoware-mapaasapplication/x-authoware-segaiapplication/postscriptaifaudio/x-aiffaifcaudio/x-aiffaiffaudio/x-aiffalsaudio/X-Alpha5amcapplication/x-mpeganiapplication/octet-streamasctext/plainasdapplication/astoundasfvideo/x-ms-asfasnapplication/astoundaspapplication/x-asapasxvideo/x-ms-asfauaudio/basicavbapplication/octet-streamavivideo/x-msvideoawbaudio/amr-wbbcpioapplication/x-bcpiobinapplication/octet-streambldapplication/bldbld2application/bld2bld2application/bld2bmpapplication/x-MS-bmpbpkapplication/octet-streambz2application/x-bzip2calimage/x-calsccnapplication/x-cncccoapplication/x-cocoacdfapplication/x-netcdfcgimagnus-internal/cgichatapplication/x-chatclassapplication/octet-streamclpapplication/x-msclipcmxapplication/x-cmxcoapplication/x-cult3d-objectcodimage/cis-codcpioapplication/x-cpiocptapplication/mac-compactprocrdapplication/x-mscardfilecshapplication/x-cshcsmchemical/x-csmlcsmlchemical/x-csmlcsstext/csscurapplication/octet-streamdcmx-lml/x-evmdcrapplication/x-directordcximage/x-dcxdhtmltext/htmldirapplication/x-directordllapplication/octet-streamdmgapplication/octet-streamdmsapplication/octet-streamdocapplication/msworddotapplication/x-dotdviapplication/x-dvidwfdrawing/x-dwfdwgapplication/x-autocaddxfapplication/x-autocaddxrapplication/x-directorebkapplication/x-expandedbookembchemical/x-embl-dl-nucleotideemblchemical/x-embl-dl-nucleotideepsapplication/postscripteriimage/x-eriesaudio/echospeecheslaudio/echospeechetcapplication/x-earthtimeetxtext/x-setextevmx-lml/x-evmevyapplication/x-envoyexeapplication/octet-streamfh4image/x-freehandfh5image/x-freehandfhcimage/x-freehandfifimage/fiffmapplication/x-makerfpximage/x-fpx

fpximage/x-fpxfvivideo/isivideogauchemical/x-gaussian-inputgcaapplication/x-gca-compressedgdbx-lml/x-gdbgifimage/gifgpsapplication/x-gpsgtarapplication/x-gtargzapplication/x-gziphdfapplication/x-hdfhdmtext/x-hdmlhdmltext/x-hdmlhlpapplication/winhlphqxapplication/mac-binhex40htmtext/htmlhtmltext/htmlhtstext/htmlicex-conference/x-cooltalkicoapplication/octet-streamiefimage/iefifmimage/gififsimage/ifsimyaudio/melodyinsapplication/x-NET-Installipsapplication/x-ipscriptipxapplication/x-ipixitaudio/x-moditzaudio/x-modivri-world/i-vrmlj2kimage/j2kjadtext/vnd.sun.j2me.app-descriptorjamapplication/x-jamjarapplication/java-archivejnlpapplication/x-java-jnlp-filejpeimage/jpegjpegimage/jpegjpgimage/jpegjpzimage/jpegjsapplication/x-javascriptjwcapplication/jwckjxapplication/x-kjxlakx-lml/x-laklatexapplication/x-latexlccapplication/fastmanlclapplication/x-digitallocalcrapplication/x-digitallocalghapplication/lghlhaapplication/octet-streamlmlx-lml/x-lmllmlpackx-lml/x-lmlpacklsfvideo/x-ms-asflsxvideo/x-ms-asflzhapplication/x-lzhm13application/x-msmediaviewm14application/x-msmediaviewm15audio/x-mod

m15audio/x-modm3uaudio/x-mpegurlm3urlaudio/x-mpegurlma1audio/ma1ma2audio/ma2ma3audio/ma3ma5audio/ma5manapplication/x-troff-manmapmagnus-internal/imagemapmbdapplication/mbedletmctapplication/x-mascotmdbapplication/x-msaccessmdzaudio/x-modmeapplication/x-troff-memeltext/x-vmelmiapplication/x-mifmidaudio/midimidiaudio/midimifapplication/x-mifmilimage/x-calsmioaudio/x-miommfapplication/x-skt-lbsmngvideo/x-mngmnyapplication/x-msmoneymocapplication/x-mochamochaapplication/x-mochamodaudio/x-modmofapplication/x-yumekaramolchemical/x-mdl-molfilemopchemical/x-mopac-inputmovvideo/quicktimemovievideo/x-sgi-moviemp2audio/x-mpegmp3audio/x-mpegmp4video/mp4mpcapplication/vnd.mpohun.certificatempevideo/mpegmpegvideo/mpegmpgvideo/mpegmpg4video/mp4mpgaaudio/mpegmpnapplication/vnd.mophun.applicationmppapplication/vnd.ms-projectmpsapplication/x-mapservermrltext/x-mrmlmrmapplication/x-mrmmsapplication/x-troff-msmtsapplication/metastreammtxapplication/metastreammtzapplication/metastreammzvapplication/metastreamnarapplication/zipnbmpimage/nbmpncapplication/x-netcdfndbx-lml/x-ndbndwnapplication/ndwn

ndwnapplication/ndwnnifapplication/x-nifnmzapplication/x-screamnokia-op-logoimage/vnd.nok-oplogo-colornpxapplication/x-netfpxnsndaudio/nsndnvaapplication/x-neva1odaapplication/odaoomapplication/x-AtlasMate-Pluginpacaudio/x-pacpaeaudio/x-epacpanapplication/x-panpbmimage/x-portable-bitmappcximage/x-pcxpdaimage/x-pdapdbchemical/x-pdbpdfapplication/pdfpfrapplication/font-tdpfrpgmimage/x-portable-graymappictimage/x-pictpmapplication/x-perlpmdapplication/x-pmdpngimage/pngpnmimage/x-portable-anymappnzimage/pngpotapplication/vnd.ms-powerpointppmimage/x-portable-pixmapppsapplication/vnd.ms-powerpointpptapplication/vnd.ms-powerpointpqfapplication/x-cprplayerpqiapplication/cprplayerprcapplication/x-prcproxyapplication/x-ns-proxy-autoconfigpsapplication/postscriptptlkapplication/listenuppubapplication/x-mspublisherpvxvideo/x-pv-pvxqcpaudio/vnd.qcelpqtvideo/quicktimeqtiimage/x-quicktimeqtifimage/x-quicktimer3ttext/vnd.rn-realtext3draaudio/x-pn-realaudioramaudio/x-pn-realaudiorarapplication/x-rar-compressedrasimage/x-cmu-rasterrdfapplication/rdf+xmlrfimage/vnd.rn-realflashrgbimage/x-rgbrlfapplication/x-richlinkrmaudio/x-pn-realaudiormfaudio/x-rmfrmmaudio/x-pn-realaudiormvbaudio/x-pn-realaudiornxapplication/vnd.rn-realplayerroffapplication/x-troff

roffapplication/x-troffrpimage/vnd.rn-realpixrpmaudio/x-pn-realaudio-pluginrttext/vnd.rn-realtextrtex-lml/x-gpsrtfapplication/rtfrtgapplication/metastreamrtxtext/richtextrvvideo/vnd.rn-realvideorwcapplication/x-rogerwilcos3maudio/x-mods3zaudio/x-modscaapplication/x-supercardscdapplication/x-msschedulesdfapplication/e-scoreseaapplication/x-stuffitsgmtext/x-sgmlsgmltext/x-sgmlshapplication/x-shsharapplication/x-sharshtmlmagnus-internal/parsed-htmlshwapplication/presentationssi6image/si6si7image/vnd.stiwap.sissi9image/vnd.lgtwap.sissisapplication/vnd.symbian.installsitapplication/x-stuffitskdapplication/x-Koanskmapplication/x-Koanskpapplication/x-Koansktapplication/x-Koanslcapplication/x-salsasmdaudio/x-smdsmiapplication/smilsmilapplication/smilsmpapplication/studiomsmzaudio/x-smdsndaudio/basicspctext/x-speechsplapplication/futuresplashsprapplication/x-spritespriteapplication/x-spritesptapplication/x-sptsrcapplication/x-wais-sourcestkapplication/hyperstudiostmaudio/x-modsv4cpioapplication/x-sv4cpiosv4crcapplication/x-sv4crcsvfimage/vndsvgimage/svg-xmlsvhimage/svhsvrx-world/x-svrswfapplication/x-shockwave-flashswflapplication/x-shockwave-flashtapplication/x-trofftadapplication/octet-stream

tadapplication/octet-streamtalktext/x-speechtarapplication/x-tartazapplication/x-tartbpapplication/x-timbuktutbtapplication/x-timbuktutclapplication/x-tcltexapplication/x-textexiapplication/x-texinfotexinfoapplication/x-texinfotgzapplication/x-tarthmapplication/vnd.eri.thmtifimage/tifftiffimage/tifftkiapplication/x-tkinedtkinedapplication/x-tkinedtocapplication/toctoyimage/toytrapplication/x-trofftrkx-lml/x-gpstrmapplication/x-msterminaltsiaudio/tsplayertspapplication/dsptypetsvtext/tab-separated-valuestsvtext/tab-separated-valuesttfapplication/octet-streamttzapplication/t-timetxttext/plainultaudio/x-modustarapplication/x-ustaruuapplication/x-uuencodeuueapplication/x-uuencodevcdapplication/x-cdlinkvcftext/x-vcardvdovideo/vdovibaudio/vibvivvideo/vivovivovideo/vivovmdapplication/vocaltec-media-descvmfapplication/vocaltec-media-filevmiapplication/x-dreamcast-vms-infovmsapplication/x-dreamcast-vmsvoxaudio/voxwarevqeaudio/x-twinvq-pluginvqfaudio/x-twinvqvqlaudio/x-twinvqvrex-world/x-vreamvrmlx-world/x-vrmlvrtx-world/x-vrtvrwx-world/x-vreamvtsworkbook/formulaonewavaudio/x-wavwaxaudio/x-ms-waxwbmpimage/vnd.wap.wbmpwebapplication/vnd.xarawiimage/wavelet

wiimage/waveletwisapplication/x-InstallShieldwmvideo/x-ms-wmwmaaudio/x-ms-wmawmdapplication/x-ms-wmdwmfapplication/x-msmetafilewmltext/vnd.wap.wmlwmlcapplication/vnd.wap.wmlcwmlstext/vnd.wap.wmlscriptwmlscapplication/vnd.wap.wmlscriptcwmlscriptte