ミルビィの機能利用例について、
今回はAJAXタイプのダイレクトフォームアップロードの利用例を取り上げます。
ダイレクトフォームアップロードについては下記サポートサイトをご参照ください。
http://support.miovp.com/direct_form_upload.html
下記にAJAXタイプを利用した単純なサンプルを示します。
PHP部
<?php $clientid = "CLIENTID"; $id_user = X; $expire = time() + (30 * 60 * 60); $secretkey = "SECRETKEY"; $sign = sha1("{$clientid}/{$id_user}/{$expire}/{$secretkey}"); $accesskey = "v1,{$clientid},{$id_user},{$expire},{$sign}"; ?>サポートサイトにもあるAccesskey発行手順です。
secretkey が含まれるためPHPにて記載しております。
注意点としては id_user はユーザー名ではなく、
動画登録権限を持ったユーザーのIDを指定してください。
Javascript部<script type="text/javascript"> $( document ).ready( function(){ $('#testForm').submit(function(event) { event.preventDefault(); var $form = $(this); var postData = new FormData($("#testForm").get(0)); postData.append( "accesskey", "<?php echo $accesskey ?>" ); postData.append( "parent_id_contents", "1" ); postData.append( "common_id_recipe", "1" ); postData.append( "common_pc_nt", "1" ); postData.append( "common_sp_nt", "1" ); postData.append( "name", "movie_title" ); $.ajax({ // 送信 url: $form.attr('action'), type: $form.attr('method'), dataType: "json", data: postData, processData: false, contentType: false }); }); }); </script>jQueryを利用しているため、予めjQueryを読み込んでいるものとします。
下記HTMLフォームにて受け取ったファイルと共に
postDataへと必要なクエリを入力しています。
ajaxを利用し送信しています。
HTML部<form id="testForm" method="post" enctype="multipart/form-data" action="https://ccs.miovp.com/create_video" > <input type="file" name="file" /> <button>送信</button> </form>単純なフォームにてファイルを受け取ります。
受け取ったファイルを上記jQueryにて必要な情報と共に送信しています。
おおまかな流れとして
– ファイル受け取り
– json配列の作成(+phpでのaccesskey発行)
– ajaxでの送信
を行っています。
適宜必要なエラー処理などを加えることで簡単なアップロードフォームが作成できます。
※ 記事投稿時点でのサンプルのため、常に動作を保証するものではありません。<< 安定した動画配信なら「millvi(ミルビィ)」へおまかせ >>
導入実績700社を誇る、国産のクラウド型動画配信システム「millvi(ミルビィ)」。 ITに詳しくない方にも分かりやすいUI・UXや、日本語でのサポート対応があり、ご導入が初めての方にも安心してご利用いただけます。 会員向けの動画共有ポータルサイト「millviポータル」や動画販売ECサイト「millviポータルEC」など、さまざまなニーズにご対応。詳しくは、サービスページまで。
関連記事