@niftyビデオ共有のAPI－JavaScriptラッパークラス　ウェブサービス：@nifty

ステップ1) NVideoクラスの読み込み

上記のscriptタグで必ずJavaScriptのラッパークラスを読み込んで利用します。

ステップ2) NVideoクラスの初期設定

ビデオの検索条件を設定してから、データを取得するメソッドを呼んでください。

パラメータ	項目名	説明	必須	値	デフォルト値
NVideo.uid	ユーザーID	ユーザーのID ※ユーザーIDの確認方法についてはこちらをご覧ください。	-	文字列	-
NVideo.sid	サイトID	サイトのID ※サイトIDの発行については、こちらをご覧下さい。	-	文字列	-
NVideo.srt	ソート順	以下のソート順を選択できます。新着順：new 再生回数順：access 評価順：evaluation ランダム：random ※タグ検索の場合、「new」のみ有効となります。	-	文字列	new
NVideo.pgcnf	最大取得件数	以下の最大取得件数の中から選択できます。 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 30, 40, 50, 60, 70, 80, 90, 100	-	数値	100
NVideo.ccl	CCライセンス	以下のCCライセンスの中から選択できます。表示(by)：6 表示－継承(by-sa)：5 表示－改変禁止(by-nd)：4 表示－非営利(by-nc)：3 表示－非営利－継承(by-nc-sa)：2 表示－非営利－改変禁止(by-nc-nd)：1	-	数値	-
NVideo.s1	キーワード検索文字列	タイトル、もしくは説明コメントに含まれる文字列を指定してください。例：NVideo.s1="ねこ";	-	文字列	-
NVideo.tags	タグ検索文字列	タグ名を指定してください。例：NVideo.tags=["ねこ","いぬ"];	-	文字列	-

メソッド名(パラメータ)	説明	返却値
NVideo.getData()	ビデオリスト取得API(JSON形式)よりデータを取得します。	なし

STEP3.NVideoクラスのAPIでページを作る

データ取得後には、NVideoクラスで以下のデータとAPIを利用することができます。
いろいろとカスタマイズしてみてくださいね。

プロパティ名	説明	返却値
NVideo.videoList	ビデオオブジェクトのリスト	リスト
NVideo.videoList[i].id	ビデオのID	文字列
NVideo.videoList[i].title	ビデオのタイトル	文字列
NVideo.videoList[i].user_id	ユーザーID	文字列
NVideo.videoList[i].user_name	ユーザー名	文字列
NVideo.videoList[i].site_id	サイトID	文字列
NVideo.videoList[i].upload_time	公開日時	日時
NVideo.videoList[i].duration	再生時間（秒）	数値
NVideo.videoList[i].view_count	再生回数	数値
NVideo.videoList[i].rating_avg	評価平均点	数値
NVideo.videoList[i].rating_sum	評価合計	数値
NVideo.videoList[i].rating_count	評価回数	数値
NVideo.videoList[i].description	説明コメント	文字列
NVideo.videoList[i].credit	クレジット	文字列
NVideo.videoList[i].license	CCライセンス名	文字列
NVideo.videoList[i].download_url	ダウンロードURL	URL
NVideo.videoList[i].category_id	カテゴリID	数値
NVideo.videoList[i].category_name	カテゴリ名	文字列
NVideo.videoList[i].iroha_genre_id	イロハジャンルID	数値
NVideo.videoList[i].iroha_genre_name	イロハジャンル名	文字列
NVideo.videoList[i].recommend	おすすめフラグ	真偽値
NVideo.videoList[i].thumbnail_url_medium	サムネイル画像(中)のURL 160 × 120 ピクセル	URL
NVideo.videoList[i].thumbnail_url_small	サムネイル画像(小)のURL 80 × 60 ピクセル	URL
NVideo.videoList[i].thumbnail_url_large	サムネイル画像(大)のURL 480 × 360 ピクセル	URL
NVideo.videoList[i].url	@niftyビデオ共有のビデオURL	URL
NVideo.videoList[i].p_url	プレーヤーのみの画面のURL	URL
NVideo.videoList[i].tags	タグオブジェクトのリスト	リスト
NVideo.videoList[i].tags[j].name	タグ名	文字列
NVideo.videoList[i].tags[j].url	タグURL	URL

メソッド名	説明	返却値	例外
NVideo.getMoreViewLink()	最大取得件数以上を「もっとみる」ためのURLを返却します。	URL	-
NVideo.getUploadLink()	ビデオ投稿を行うためのURLを返却します。	URL	-
NVideo.getPlayerTag( user_id , id )	指定したユーザーIDとビデオIDの再生プレーヤー貼り付けタグを返却します。	文字列	invalid user_id or id 不正なユーザーID、あるいはビデオIDが指定されています。
NVideo.getUserLink( user_id )	指定したユーザーIDのユーザーページのURLを返却します。	URL	invalid user_id 不正なユーザーIDが指定されています。
NVideo.getFormatMMSS(duration)	再生時間(秒)をmm:ss形式に変換します。	文字列	invalid duration 不正な再生期間が指定されています。
NVideo. getFormatYYYYMMDD(upload_time)	公開日時をYYYY/MM/DD形式に変換します。	文字列	invalid upload_time 不正な公開日時が指定されています。
NVideo.trimString(str,n)	文字列(str>の文字数が指定された数値(n)以上の場合、「...」を末尾に付加します。	文字列	invalid String or Number 不正な文字、あるいは数値が指定されています。

サンプルHTML-自分の投稿したビデオだけを取得したい

「uid=0000001774」で投稿されたビデオリストをランダム「srt=random」に3件「pgcnf=3」取得するページを作るためのHTMLは以下の通りです。

<!-- Start of NVideo Badge -->
<style type="text/css">
#nvideo_badge_source_txt {text-align:center; padding:0; font: 11px Arial, Helvetica, Sans serif; color:#666666;}
#nvideo_badge_wrapper {width:200px;background-color:#ffffff;border: solid 1px #000000;padding:5px 5px 5px 5px !important;}
#nvideo_badge_wrapper a:hover,
#nvideo_badge_wrapper a:link,
#nvideo_badge_wrapper a:active,
#nvideo_badge_wrapper a:visited {text-decoration:none !important; background:inherit !important;color:#3993ff;}
#nvideo_www {display:block; text-align:center; padding:0 10px 0 10px !important; font: 11px Arial, Helvetica, Sans serif !important; color:#3993ff !important;}

.nvideo_badge_image {text-align:center !important;}
.nvideo_badge_image img {border: 1px solid black !important;}
</style>


<div id="nvideo_badge_wrapper">
<dl><dt id="nvideo_badge_source_txt">powered by <a href="http://video.nifty.com" id="nvideo_www">video.nifty.com</a></dt></dl>

<!-- ステップ1) NVideoクラスの読み込み -->
<script type"text/javascript" src="http://api.video.nifty.com/js/jsapi-v1.js" charset="Shift_JIS"></script>

<!-- ステップ2) NVideoクラスの初期設定 -->
<script type="text/javascript">

//NVideo.sid = "";                // your SiteID
NVideo.uid = "0000001774";		　// your UserID
NVideo.srt = "random";		// [new|recommend|access|evaluation|random]
NVideo.pgcnf = 3;		// maximum items per page
NVideo.getData();		// get video Data

</script>

<!-- STEP3.NVideoクラスのAPIでページを作る -->
<script type="text/javascript">

for(var i=0; i<NVideo.videoList.length; i++) {
  with(NVideo.videoList[i]) {

    document.write('<dl style="text-align:center;">');
    document.write('<dt id="nvideo_badge_source_txt">');

　　//ビデオタイトルの表示
    document.write('<b><a href="' + url + '" target="_blank">' + title + '</a></b> ['+ NVideo.getFormatMMSS(duration) +']<br/> by '+ '<a href=\"'+NVideo.getUserLink(user_id) +'\">'+user_name+'</a>さん<br/>');

    
    //サムネイルの表示
    document.write('<a href="' + p_url + '" class="nvideo_badge_image" target="Nvideo" onclick="window.open(\'' + p_url + '\', \'Nvideo\', \'resizable=yes,status=yes,scrollbars=yes,location=yes,top=0,left=0,width=530,height=530\');">');
    document.write('<img src="' + thumbnail_url_small + '" width="80" height="60" border="0" alt="' + title + '" title="' + title + '" /></a><br>');

    //タグの表示
    for(var j=0; j<tags.length; j++ ) {
    	document.write(' <a href="' + tags[j].url + '" target="_blank">');
    	document.write( tags[j].name );
    	document.write('</a> ');
    }

    //評価の表示
    document.write('<br/>');
    for(var k=0; k<rating_avg; k++){
		document.write('<img src="http://video.nifty.com/images/ico_star_s.gif" class="icoSter">');
    }

    document.write('</dt>');
    document.write('</dl>');
  }
}


document.write('<dl style="text-align:center;">');

//「もっとみる」リンクの作成
document.write('<dt id="nvideo_badge_source_txt">');
document.write('<a href="' + NVideo.getMoreViewLink() + '" id="nvideo_www" target="_blank">もっと見る</a>');
document.write('</dt>');

//「投稿する」リンクの作成
document.write('<dt id="nvideo_badge_source_txt">');
document.write('<a href="' + NVideo.getUploadLink() + '" id="nvideo_www" target="_blank">投稿する!</a>');
document.write('</dt>');

document.write('</dl>');

</script>
</div>
<!-- End of Nvideo Badge -->

サンプルHTMLを貼り付けてみると・・・

あくまでも一例ですが、上記のコードをブログなどに貼り付けると即席の小さなビデオ共有コーナーが出来上がります。カスタマイズしてホームページやブログのアクセントにしてみてはいかがですか？

powered by video.nifty.com

@niftyのウェブサービスを使ってアプリケーションを作ってみよう！

JavaScriptラッパークラス

ステップ1) NVideoクラスの読み込み

ステップ2) NVideoクラスの初期設定

STEP3.NVideoクラスのAPIでページを作る

サンプルHTML-自分の投稿したビデオだけを取得したい

サンプルHTMLを貼り付けてみると・・・

提供API

メニュー

開発者ブログ

関連サービス