Intelligent Media Services (IMS) は、Web向け動画編集デモを提供しています。 Webクライアントで動画編集サービスを使用するには、このデモを実行することをお勧めします。このトピックでは、Web向け動画編集デモを実行し、デモに基づいて拡張機能を追加する方法について説明します。
概要
Web向け動画編集デモは、IMSコンソールのオンライン編集ページで提供されるオンライン編集機能と同じ機能を提供します。 IMSコンソール のオンライン編集機能を使用し、ビジネス要件に基づいてデモにカスタム機能を追加できます。
前提条件
IMS がアクティブ化されていること。 詳細については、「IMSのアクティブ化」をご参照ください。
必要な素材がメディアライブラリから IMS にアップロードされていること。 詳細については、「IMSコンソールを使用してメディアアセットをアップロードする」をご参照ください。
Resource Access Management (RAM) ユーザーが作成されていること。必要な権限が RAM ユーザーに付与されており、RAM ユーザーの AccessKey ペアが取得されていること。 詳細については、「RAMユーザーを作成し、RAMユーザーに権限を付与する」をご参照ください。
デモの実行
デモパッケージをダウンロードして解凍します。 デモパッケージをダウンロードするには、GitHub の IMS_WebSDK_Demo にアクセスしてください。
フロントエンドリソースを設定、インストール、およびパッケージ化します。
fe/public/index.html ファイルに Web向け動画編集 SDK を統合します。
説明この例では、Web向け動画編集 SDK V3.14.0 を参照用にのみ使用しています。 Web向け動画編集 SDK の最新バージョンの入手方法については、IMSコンソールの動画編集プロジェクトタブの注意事項 をご参照ください。
fe ディレクトリで次のコマンドを実行して、フロントエンドリソースをインストールします。
npm install
次のコマンドを実行して、フロントエンドリソースをパッケージ化します。
npm run build
クライアントを設定して実行します。
Java クライアントを設定して実行します。
java/application/src/main/java/demo/controller/OpenApiController.java ファイルで、RAM ユーザーの AccessKey ペアとリージョン ID を指定します。
次のコマンドを実行して、シンボリックリンクを使用して、パッケージ化されたフロントエンドリソースを Java の対応するディレクトリに追加します。
ln -s "$(pwd)/fe" java/application/src/main/resources
Java プロジェクトを Eclipse または IntelliJ IDEA にインポートし、demo.Application クラスを実行して Java クライアントを実行します。
Node.js クライアントを設定して実行します。
nodejs/config/config.default.js ファイルで、RAM ユーザーの AccessKey ペアとリージョン ID を指定します。
次のコマンドを実行して、シンボリックリンクを使用して、パッケージ化されたフロントエンドリソースを Node.js の対応するディレクトリに追加します。
ln -s "$(pwd)/fe" nodejs
nodejs ディレクトリで次のコマンドを実行して、依存関係をインストールします。
npm install
次のコマンドを実行して、Node.js クライアントを実行します。
npm run dev
ブラウザで http://localhost:7001/ にアクセスして、デモを実行します。
関連情報
この例で使用されているデモは、Web向け動画編集 SDK の基本機能のみを提供しています。 ビジネス要件に基づいて拡張機能を追加できます。
デモの実行中にエラーが発生した場合は、「FAQ」をご参照ください。
お問い合わせ
ご質問がある場合、または技術サポートが必要な場合は、IMS の DingTalk グループ (ID: 48335001108) に参加してお問い合わせください。