CakePHP 5とUppyの統合ガイド
Uppyは、ドラッグアンドドロップアップロード、プログレス表示、リジューム機能などを備えたオープンソースのファイルアップロードツールです。この記事では、UppyをCakePHP 5に統合する方法について詳しく解説します。
Uppyの特徴
Uppyは、複数のアップロード先（ローカルサーバー、AWS S3など）に対応しており、そのシンプルなAPIと豊富なプラグインにより、ウェブ開発に ...
8月7日 01:47 投稿
HyperfにおけるCORS対策の実装方法
HyperfフレームワークでCORSを適切に処理するための4つのアプローチについて説明します。Laravelと類似した構造を持つHyperfですが、Swooleのコルーチン機能を活用することで柔軟な開発が可能です。
方法1：カスタムミドルウェアの作成
公式ドキュメントに記載されている方法を拡張し、OPTIONSリクエストの処理を追加します。
declare(strict_types=1);
namespace App\ ...
8月4日 04:30 投稿
クロスオリジンCookieの設定と問題解決
Webアプリケーション開発において、クロスオリジンリクエストは一般的な課題です。特にCookieを扱う場合、ブラウザとサーバーの連携が重要になります。本稿では、クロスオリジン通信におけるCookieの取り扱いと関連する設定について解説します。
基本的なクロスオリジンリクエスト
開発者Aがフロントエンドから異なるオリジンのAPI（例: /login）にPOSTリクエストを送信 ...
7月16日 17:08 投稿
NGINX運用とセキュリティ設定
NGINXのログ解析やセキュリティ設定について、以下の内容を説明します。
アクセスログの解析コマンド
以下は、アクセスログから重要な情報を抽出するためのコマンド例です。
ユニークIPアドレス数のカウント:
awk '{print $1}' ログファイル | sort | uniq | wc -l
特定時間帯のアクセス件数:
grep "07/Apr/2023:0[4-5]" ログファイル | awk '{print $1}' | sort | u ...
7月6日 17:02 投稿
クロスオリジン通信の実装手法とその実践
ブラウザの同一オリジンポリシー
同一オリジンとは、プロトコル、ホスト名、ポート番号が全て一致するURLを指します。ブラウザはセキュリティ上の理由から、Cookie、Web Storage、iframe、XMLHttpRequestなどのリソースに対するクロスオリジンアクセスを制限しています。
JSONPによるクロスオリジン通信
script要素のクロスオリジン読み込みを利用した手法です。サーバー ...
7月5日 00:07 投稿
Spring Bootマイクロサービス開発における共通例外処理とCORS設定の実装
Spring MVCにおける主要なアノテーションの役割
REST APIの開発において、以下のアノテーションはリクエストデータのバインディングとレスポンスの生成に不可欠です。
@PathVariable: URLパス内のプレースホルダーをメソッドの引数にマッピングします。例えば、/users/{id}というエンドポイントからID値を取得する場合に使用します。
@RequestBody: HTTPリクエストのボデ ...
6月28日 02:35 投稿
Spring BootにおけるWebフィルターの実装方法
フィルターの登録方式
Spring BootアプリケーションでWebフィルターを実装する主要な方法として、アノテーションベースの自動スキャン方式と、Javaベースの手動設定方式があります。
アノテーションによる自動登録
@WebFilterアノテーションを使用してフィルターを定義し、@ServletComponentScanでスキャン対象を指定します。
@Slf4j
<strong>@WebFilter(filterName ...
6月13日 00:39 投稿
Webアプリケーションにおけるクロスオリジン通信の実践的対策
同源ポリシーの基本メカニズム
ブラウザのセキュリティ制約により、異なるオリジン（スキーム・ドメイン・ポートの組み合わせ）へのXMLHttpRequest/fetch要求がブロックされる現象を指します。オリジンの一致判定は以下の通りです：
リクエスト元URL
リクエスト先URL
通信可否
https://app.example.co.jp/main.js
https://app.example.co.jp ...
6月1日 00:14 投稿
ウェブサイトのデプロイメント：バックエンド連携とドメインバインディング
本稿では、前回の記事で静的サイトをクラウドサーバーにデプロイする方法を紹介しましたが、今回はより実践的なウェブサイト構築に焦点を当てます。具体的には、バックエンドサービスとの連携を実現し、ドメインをバインドしてユーザーがアクセスできるようにする方法を解説します。
ソースコード：https://github.com/baburwang/web-deploy-demo-2.git
プロジェクトの準備 ...
5月30日 08:24 投稿
Vueプロジェクトの作成とバックエンド連携方法
Vueプロジェクトの作成
jingxi_shop_projectフォルダ内にfrontendフォルダを作成し、フロントエンドプロジェクトを格納します。
/jingxi_shop_project
/backend
/jingxi_shop_project
......
/frontend
/jingxi_shop_web
......
まずnode.jsとVue CLIをインストールし、プロジェクトディレクトリ内でプロジェクトを作成します ...
5月21日 21:20 投稿