{"id":7399,"date":"2019-05-05T18:22:06","date_gmt":"2019-05-05T10:22:06","guid":{"rendered":"https:\/\/sdeno.com\/?p=7399"},"modified":"2019-05-05T19:10:19","modified_gmt":"2019-05-05T11:10:19","slug":"%e9%a2%84%e8%a7%88%e4%b8%8a%e4%bc%a0%e5%9b%be%e7%89%87%e3%80%81%e8%a7%86%e9%a2%91","status":"publish","type":"post","link":"https:\/\/sdeno.com\/?p=7399","title":{"rendered":"\u9884\u89c8\u4e0a\u4f20\u56fe\u7247\u3001\u89c6\u9891\u2014\u2014createObjectURL"},"content":{"rendered":"<p>\u9884\u89c8 \u4e0a\u4f20\u56fe\u7247 \u89c6\u9891\u00a0\u9884\u89c8<\/p>\n<p>html:<\/p>\n<pre>&lt;video src=\"\" id=\"video0\" controls=\"controls\"&gt;&lt;\/video&gt;\r\n\r\n&lt;input type=\"file\" id=\"video\" name=\"video\"\/&gt;<\/pre>\n<p>&nbsp;<\/p>\n<p>js\u4ee3\u7801\uff1a<\/p>\n<pre>\/\/ hTML5\u5b9e\u73b0\u8868\u5355\u5185\u7684\u4e0a\u4f20\u6587\u4ef6\u6846\uff0c\u4e0a\u4f20\u524d\u9884\u89c8\u89c6\u9891\uff0c\u5237\u65b0\u9884\u89c8video\uff0c\u4f7f\u7528HTML5 \u7684File API,\r\n\/\/ \u5efa\u7acb\u4e00\u4e2a\u53ef\u5b58\u53d6\u5230\u8be5file\u7684url\uff0c\u4e00\u4e2a\u7a7a\u7684video\u6807\u7b7e\uff0cID\u4e3avideo0,\u628a\u9009\u62e9\u7684\u6587\u4ef6\u663e\u793a\u5728video\u6807\u7b7e\u4e2d\uff0c\u5b9e\u73b0\u89c6\u9891\u9884\u89c8\u529f\u80fd\u3002\r\n\/\/ \u9700\u8981\u9009\u62e9\u652f\u6301HTML API\u7684\u6d4f\u89c8\u5668\u3002\r\n$(\"#video\").change(function(){\r\n   var objUrl = getObjectURL(this.files[0]) ;\r\n\r\n   if (objUrl) {\r\n      $(\"#video0\").attr(\"src\", objUrl) ;\r\n      \/\/img.src=objUrl ,\u56fe\u7247\u9884\u89c8\u4e5f\u7c7b\u4f3c\r\n   }\r\n}) ;\r\n\r\n\r\n\/\/\u5efa\u7acb\u4e00\u4e2a\u53ef\u5b58\u53d6\u5230\u8be5file\u7684url,  createObjectURL\u517c\u5bb9\u5904\u7406\r\nfunction getObjectURL(file) {\r\n  var url = null ;\r\n  if (window.createObjectURL!=undefined) { \/\/ basic\r\n    url = window.createObjectURL(file) ;\r\n  } else if (window.URL!=undefined) { \/\/ mozilla(firefox)\r\n    url = window.URL.createObjectURL(file) ;\r\n  } else if (window.webkitURL!=undefined) { \/\/ webkit or chrome\r\n    url = window.webkitURL.createObjectURL(file) ;\r\n  }\r\n  return url ;  \/\/\u8f93\u51fa\u683c\u5f0f blob:http:\/\/localhost:8082\/dd56dfec-12ef-4532-ae88-f1a2e6802f2c\r\n}<\/pre>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>\u4e0a\u4f20 blob\u683c\u5f0f\u7684\u5185\u5bb9<\/p>\n<pre>var formData = new FormData();\r\nformData.append(\"type\",\"2\");  \/\/\u63d0\u4ea4type=2\u7684\u503c\u7ed9\u540e\u53f0\r\nformData.append(\"file\",blob,\"recorder.mp3\");  \/\/\u63d0\u4ea4blob\u6570\u636e\u7ed9\u540e\u53f0\r\n\r\n\/\/ console.log(formData.values());\r\nfor (var value of formData.values()) {\r\nconsole.log(value);\r\n}\r\n\r\n\r\n$.ajax({\r\n url:\"xxx\" \/\/\u4e0a\u4f20\u63a5\u53e3\u5730\u5740\r\n ,type:\"POST\"\r\n ,contentType:false \/\/\u8ba9xhr\u81ea\u52a8\u5904\u7406Content-Type header\uff0cmultipart\/form-data\u9700\u8981\u751f\u6210\u968f\u673a\u7684boundary\r\n ,processData:false \/\/\u4e0d\u8981\u5904\u7406data\uff0c\u8ba9xhr\u81ea\u52a8\u5904\u7406\r\n ,data:formData\r\n ,success:function(v){\r\n    console.log(\"\u4e0a\u4f20\u6210\u529f\",v);\r\n }\r\n ,error:function(s){\r\n   console.error(\"\u4e0a\u4f20\u5931\u8d25\",s);\r\n }\r\n});<\/pre>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p><audio style=\"display: none;\" controls=\"controls\"><\/audio><\/p>\n<p><audio style=\"display: none;\" controls=\"controls\"><\/audio><\/p>\n<p><audio style=\"display: none;\" controls=\"controls\"><\/audio><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u9884\u89c8 \u4e0a\u4f20\u56fe\u7247 \u89c6\u9891\u00a0\u9884\u89c8 html: &lt;video src=&#8221;&#8221; id=&#8221;video0&#8243; contro [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11],"tags":[],"class_list":["post-7399","post","type-post","status-publish","format-standard","hentry","category-11"],"_links":{"self":[{"href":"https:\/\/sdeno.com\/index.php?rest_route=\/wp\/v2\/posts\/7399","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sdeno.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sdeno.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sdeno.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sdeno.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=7399"}],"version-history":[{"count":0,"href":"https:\/\/sdeno.com\/index.php?rest_route=\/wp\/v2\/posts\/7399\/revisions"}],"wp:attachment":[{"href":"https:\/\/sdeno.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=7399"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sdeno.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=7399"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sdeno.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=7399"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}