WordPressとapi.videoを連携する方法｜APIキーの保管・動画一覧の取得・埋め込み・管理画面からの直接アップロード

WordPress と動画配信 API の api.video を連携するには、APIキーを wp-config.php の定数として保管し、サーバー側から wp_remote_request() で API を呼び出し、再生はショートコードで api.video のプレーヤーを iframe 埋め込みする構成が扱いやすい方法です。この記事では、その最小構成を mu-plugin として作り、動画一覧の表示、投稿への埋め込み、さらに大きな動画ファイルを WordPress サーバーを経由せずにアップロードする仕組みまでを順に説明します。

api.video と連携すると何が変わるのか

WordPress のメディアライブラリに MP4 を直接アップロードして video ブロックで流す方法は手軽ですが、動画はファイルが大きく、サーバー容量・転送量・PHP のアップロード上限（upload_max_filesize）にすぐ突き当たります。また、回線速度に応じて画質を切り替えるアダプティブ配信（HLS）は自前では用意しにくい仕組みです。

api.video は、アップロードされた動画をエンコードし、HLS 配信・サムネイル生成・プレーヤーをまとめて提供するサービスです。WordPress 側は「どの動画をどのページに出すか」だけを管理し、重い処理と配信は api.video に任せる、という役割分担になります。

なお、api.video は WordPress コアの oEmbed 対応サービスには含まれていないため、URL を貼るだけでは自動で埋め込まれません。公式・サードパーティのプラグインが提供されている場合もありますが、提供状況や対応する WordPress のバージョンは変わるため、使う前に配布元と最終更新日を確かめてください。この記事では依存を増やさず、自分で管理できる小さなコードで連携します。

事前準備：サンドボックスと本番のAPIキー

api.video のダッシュボードにログインすると、本番用（production）とサンドボックス用（sandbox）のAPIキーを確認できます（2026年10月現在）。画面の構成や表記は変わることがあります。サンドボックスは動画に透かしが入るなどの制限がある代わりに、試験用として使えます。開発中やステージング環境ではサンドボックスのキーと API のエンドポイント（https://sandbox.api.video）を使い、動作を確かめてから本番（https://ws.api.video）に切り替えるのが安全です。

APIキーは、動画の削除まで行える強い権限を持ちます。次の点を守ってください。

• テーマのファイルや投稿本文、JavaScript に直接書かない（ブラウザに配信されると誰でも読めます）
• Git に commit するファイルに書かない
• 漏えいが疑われたらダッシュボードでキーを作り直し、古いキーを無効にする

手順1：APIキーを wp-config.php に定数で置く

wp-config.php の「編集が必要なのはここまで」の行より上に、次のように書きます。値はダミーです。

// api.video の設定（値はダミー。実際のキーに置き換える）
define( 'APIVIDEO_API_KEY', 'your-api-key' );
// 開発中は sandbox、本番では https://ws.api.video
define( 'APIVIDEO_BASE_URL', 'https://sandbox.api.video' );

環境変数で渡せるサーバーなら、define( 'APIVIDEO_API_KEY', getenv( 'APIVIDEO_API_KEY' ) ); のように読み込むと、ファイルにキーを残さずに済みます。wp-config.php を編集する前には、ファイルのバックアップを取っておいてください。

手順2：API を呼び出す共通関数を作る

以降のコードは wp-content/mu-plugins/apivideo-integration.php にまとめます。mu-plugin はテーマを切り替えても動き続け、管理画面から誤って停止されることもありません。テーマの functions.php に書く場合は、更新で消えないよう子テーマを使ってください。

api.video の認証には、APIキーをユーザー名・パスワードを空にした Basic 認証で送る方法と、/auth/api-key でアクセストークンを取得して Bearer で送る方法があります。ここでは前者を使います。認証方式の扱いは変わる可能性があるため、実装前に公式の API リファレンスで現在の推奨を確認してください。

<?php
/**
 * Plugin Name: api.video integration (mu-plugin)
 */
defined( 'ABSPATH' ) || exit;

function myvid_api_request( $method, $path, $body = null ) {
	if ( ! defined( 'APIVIDEO_API_KEY' ) || ! defined( 'APIVIDEO_BASE_URL' ) ) {
		return new WP_Error( 'myvid_config', 'api.video の設定がありません。' );
	}

	$args = array(
		'method'  => $method,
		'timeout' => 15,
		'headers' => array(
			'Authorization' => 'Basic ' . base64_encode( APIVIDEO_API_KEY . ':' ),
			'Accept'        => 'application/json',
		),
	);
	if ( null !== $body ) {
		$args['headers']['Content-Type'] = 'application/json';
		$args['body']                    = wp_json_encode( $body );
	}

	$response = wp_remote_request( APIVIDEO_BASE_URL . $path, $args );
	if ( is_wp_error( $response ) ) {
		return $response;
	}

	$code = wp_remote_retrieve_response_code( $response );
	$data = json_decode( wp_remote_retrieve_body( $response ), true );
	if ( $code < 200 || $code >= 300 ) {
		// キーそのものはログに出さない
		error_log( sprintf( 'api.video API error: %d %s', $code, $path ) );
		return new WP_Error( 'myvid_http', 'api.video の応答がエラーでした。', array( 'status' => $code ) );
	}
	return $data;
}

ポイントは、エラー時にステータスコードとパスだけを記録し、ヘッダーやキーをログに残さないことです。wp_remote_request() は WordPress の HTTP API で、サーバーの cURL 設定や WordPress 同梱の CA 証明書を使って通信します。

手順3：動画一覧を取得してキャッシュする

動画の一覧は GET /videos で取得できます。ページを表示するたびに API を呼ぶと遅くなり、API の利用制限にも触れやすくなるため、トランジェントで数分間キャッシュします。

function myvid_get_videos() {
	$cached = get_transient( 'myvid_videos' );
	if ( false !== $cached ) {
		return $cached;
	}

	$data = myvid_api_request( 'GET', '/videos?currentPage=1&pageSize=25' );
	if ( is_wp_error( $data ) || empty( $data['data'] ) ) {
		return array();
	}

	$videos = array();
	foreach ( $data['data'] as $item ) {
		$videos[] = array(
			'id'        => $item['videoId'] ?? '',
			'title'     => $item['title'] ?? '',
			'thumbnail' => $item['assets']['thumbnail'] ?? '',
		);
	}
	set_transient( 'myvid_videos', $videos, 10 * MINUTE_IN_SECONDS );
	return $videos;
}

API の応答から必要な項目だけを取り出して保存しているのは、応答の構造が将来変わっても影響範囲を小さくするためです。項目名（videoId、assets など）は公式リファレンスで最新の形を確認してください。

手順4：ショートコードで投稿に埋め込む

投稿本文に iframe を直接書く方法は、unfiltered_html 権限を持たない編集者では保存時に除去されることがあり、また入力ミスがそのままページに出ます。ショートコードにして、動画 ID を検証したうえで出力するほうが安全です。

add_shortcode( 'apivideo', function ( $atts ) {
	$atts = shortcode_atts( array( 'id' => '', 'title' => '動画' ), $atts, 'apivideo' );

	// 動画 ID は英数字のみを許可（現在の api.video の ID は vi で始まる形式）
	$id = preg_replace( '/[^A-Za-z0-9]/', '', $atts['id'] );
	if ( '' === $id ) {
		return '';
	}

	$src = 'https://embed.api.video/vod/' . rawurlencode( $id );
	return sprintf(
		'<div class="myvid-embed" style="aspect-ratio:16/9;"><iframe src="%s" title="%s" width="100%%" height="100%%" style="border:0;" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen loading="lazy"></iframe></div>',
		esc_url( $src ),
		esc_attr( $atts['title'] )
	);
} );

投稿では [apivideo id="viXXXXXXXXXXXX" title="製品紹介"] のように書きます。aspect-ratio で表示枠の比率を先に確保しておくと、iframe の読み込み時にレイアウトがずれる（CLS）のを防げます。title 属性は、スクリーンリーダーの利用者に何の動画かを伝えるために付けています。

公開範囲を「非公開（private）」にした動画は、通常の埋め込み URL では再生できず、API で発行されるトークン付きの URL が必要です。会員限定の動画として使う場合は、WordPress 側のログイン判定と組み合わせて、権限のあるユーザーにだけトークン付き URL を出力する設計になります。

手順5：大きな動画を管理画面から直接アップロードする

数百MB以上の動画を WordPress 経由でアップロードすると、PHP のアップロード上限やタイムアウトに引っかかります。api.video には、有効期限付きの「アップロードトークン」を発行し、ブラウザから api.video へ直接ファイルを送る仕組みがあります。WordPress はトークンの発行だけを担当し、ファイル本体はサーバーを通りません。

トークン発行用の REST API エンドポイントを、メディアのアップロード権限を持つユーザーだけが使えるように登録します。

add_action( 'rest_api_init', function () {
	register_rest_route( 'myvid/v1', '/upload-token', array(
		'methods'             => 'POST',
		'permission_callback' => function () {
			return current_user_can( 'upload_files' );
		},
		'callback'            => function () {
			// 有効期限 1 時間のアップロードトークンを発行
			$data = myvid_api_request( 'POST', '/upload-tokens', array( 'ttl' => 3600 ) );
			if ( is_wp_error( $data ) || empty( $data['token'] ) ) {
				return new WP_Error( 'myvid_token', 'トークンを発行できませんでした。', array( 'status' => 502 ) );
			}
			return array( 'token' => $data['token'] );
		},
	) );
} );

管理画面の JavaScript からは、wp_create_nonce( 'wp_rest' ) で作った nonce を X-WP-Nonce ヘッダーに付けてこのエンドポイントを呼びます。nonce と permission_callback の両方があることで、ログイン中の権限あるユーザー本人の操作だけがトークンを得られます。

取得したトークンを使ったアップロードには、api.video が公開している JavaScript のアップローダーライブラリを使うと、大きなファイルの分割送信や再試行を任せられます。ライブラリの名前や使い方は更新されることがあるため、公式ドキュメントの「delegated upload（委任アップロード）」の項目を参照してください。トークンは使い回しを避け、有効期限は作業に必要な長さに留めるのが無難です。

つまずきやすい点と確認方法

• 一覧が空になる：まず wp eval 'var_dump( myvid_api_request( "GET", "/videos" ) );' を WP-CLI で実行し、WP_Error の中身を見ます。401 ならキーかエンドポイント（sandbox と本番の取り違え）、cURL のエラーならサーバーの外向き通信や証明書の問題です。
• 変更が反映されない：トランジェントのキャッシュが残っています。wp transient delete myvid_videos で消して確認します。
• アップロード直後に再生できない：api.video 側のエンコードが終わるまで再生できない画質があります。完了の通知を受け取りたい場合は、api.video の Webhook を WordPress の REST エンドポイントで受ける方法がありますが、受信側では送信元の検証を行ってください。
• 利用料金とプライバシー：配信量・保存量に応じた料金体系は変わるため、公式の料金ページで最新の条件を確認してください。動画の視聴データを外部サービスに送ることになるので、プライバシーポリシーへの記載も見直します。

コードを本番に入れる前に、ステージング環境でサンドボックスのキーを使って一連の流れを試し、サイトとデータベースのバックアップを取ってから反映してください。

まとめ

• APIキーは wp-config.php の定数か環境変数に置き、ブラウザ側のコードや Git に含めない
• API 呼び出しは wp_remote_request() の共通関数にまとめ、エラー時はキーを記録せずステータスだけ残す
• 一覧はトランジェントでキャッシュし、埋め込みは ID を検証してエスケープするショートコードで出力する
• 大きなファイルはアップロードトークンでブラウザから api.video へ直接送り、トークン発行は権限チェックと nonce で守る
• 認証方式・応答の項目名・料金は変わり得るため、公式ドキュメントで確認してからステージングで試す

• WordPressでBunny Streamを使って動画を配信する方法
• wp_remote_getでBasic認証付きのAPIを呼び出す方法