ガイド

1 ページにつき 1 つの課題を扱います。お使いのプラットフォームで RichTextEditor に画像アップロード、画像ギャラリー、ファイルフォルダーを追加する方法、サーバーが確認すべきこと、注意すべき点を説明します。掲載しているコードサンプルはすべて、当社が実際に動かしてテストしているプロジェクトから取ったものです。

43 件のガイド

JavaScript と Node.js

ページ側は素の JavaScript、サーバー側は Express。

Node.js でリッチテキストエディターから画像をアップロードするNode.js でリッチテキストエディターに画像ギャラリーを追加するNode.js のギャラリーフォルダー：安全に閲覧・作成するNode.js でのユーザーごとの画像フォルダーNode.js での安全な画像アップロードNode.js での画像アップロードのサイズ制限

React

エディターは React コンポーネント内に置き、ファイルは自前の API でやり取りします。

React で RichTextEditor に画像ギャラリーを追加する

Vue

エディターは Vue コンポーネント内に置き、ファイルは自前の API でやり取りします。

Vue で RichTextEditor に画像ギャラリーを追加する

Angular

エディターは Angular コンポーネント内に置き、ファイルは自前の API でやり取りします。

Angular で RichTextEditor に画像ギャラリーを追加する

Next.js

アップロードとギャラリー用のルートハンドラーと、クライアントコンポーネント内のエディター。

Next.js でリッチテキストエディターから画像をアップロードするNext.js でリッチテキストエディターに画像ギャラリーを追加するNext.js での画像アップロードのサイズ制限Next.js での安全な画像アップロード

PHP

素の PHP 8 スクリプトと、Apache・nginx の設定。

PHP でリッチテキストエディターから画像をアップロードするPHP でリッチテキストエディターに画像ギャラリーを追加するPHP のギャラリーフォルダー：安全に閲覧・作成するPHP でのユーザーごとの画像フォルダーPHP での安全な画像アップロードPHP での画像アップロードのサイズ制限

ASP.NET Core MVC と最小 API

コントローラーまたは最小 API のエンドポイント、IFormFile、Kestrel の制限。

ASP.NET Core でリッチテキストエディターから画像をアップロードするASP.NET Core でリッチテキストエディターに画像ギャラリーを追加するASP.NET Core のギャラリーフォルダー：安全に閲覧・作成するASP.NET Core でのユーザーごとの画像フォルダーASP.NET Core での安全な画像アップロード：重要なチェックASP.NET Core でのアップロードのサイズ制限：Kestrel、IIS、MVC

Razor Pages

ページハンドラーと、エディターのリクエストに対する偽造防止。

Razor Pages でリッチテキストエディターに画像ギャラリーを追加するRazor Pages でリッチテキストエディターから画像をアップロードするRazor Pages での安全な画像アップロード：偽造防止とオリジン

Blazor

エディターは JS 相互運用で操作し、ファイルは HTTP エンドポイントでやり取りします。

Blazor でリッチテキストエディターに画像ギャラリーを追加するBlazor でリッチテキストエディターから画像をアップロードするBlazor Server でリッチテキストエディターの HTML を読み取る

ASP.NET MVC 5

.NET Framework のコントローラー、HttpPostedFileBase、IIS の制限。

ASP.NET MVC 5 でリッチテキストエディターから画像をアップロードするASP.NET MVC 5 でリッチテキストエディターに画像ギャラリーを追加するASP.NET MVC 5 のギャラリーフォルダー：安全に閲覧・作成するASP.NET MVC 5 でのユーザーごとの画像フォルダーASP.NET MVC 5 での安全な画像アップロードIIS 上の ASP.NET MVC 5 でのアップロードのサイズ制限

ASP.NET Web Forms

.aspx ページと同じ場所に置くジェネリックハンドラー（.ashx）。

ASP.NET Web Forms でリッチテキストエディターから画像をアップロードするWeb Forms でリッチテキストエディターに画像ギャラリーを追加するASP.NET Web Forms のギャラリーフォルダー：安全に閲覧・作成するASP.NET Web Forms でのユーザーごとの画像フォルダーASP.NET Web Forms での安全な画像アップロードIIS 上の ASP.NET Web Forms でのアップロードのサイズ制限