Web における Beacon の変遷 (sendBeacon(), fetch() keepalive, fetchLater()) | blog.jxck.io
Intro ページを閉じる際に何かしらの情報をサーバで収集したいケースがある。 これを Beacon の送信(Beaconing)と呼び、ブラウザではページ表示中に収集したパフォーマンス統計の収集や、広告タグによるトラッキングなどに用いられる。 しかし、「ページが閉じる直前に、サーバにリクエストを送信する」を確実に実行するのは実は難しく、これを標準技術で実現する過程で、複数の API が生まれるに至った。 各 API の策定経緯と、挙動の違いについて解説していく。 <img> での送信 最もプリミティブな Beacon の送信は、<img> を用いたものだった。 window.addEventListener("unload", () => { const beaconImage = new Image(1, 1); beaconImage.src = "https://telemetry
子がたびたび、塗り絵をやりたい、と言う。 塗り絵はだいたい商店街の文房具屋で買ってるのだけど、急に、こういう塗り絵をやりたい、と言われても、そんなのないよ…となることがある。 家にはプリンタがあるので、画像検索して印刷すれば塗って遊べるのだけど、ただモノクロで印刷すると、グレイスケールのもやもやした出力で、塗っても楽しくない。 できれば、線画っぽい、コントラストのぱきっとした画像を出してあげたい。 プレビュー.appで色を調整する 画像をダウンロードして、カラーを調整する。露出を上げて、コントラストをあげて、彩度を下げると、塗り絵用の線画っぽくなる。 これを毎回手でやるのはめんどう。 ImageMagickで加工する ImageMagickで自動化する。というのも考えた。ブラウザでダウンロードして、その画像をconvertコマンドで変換して、lpコマンドで印刷する。 ダウンロードしてから、
Chromeの提案しているセキュリティ機能『Local Network Access』について - ASnoKaze blog
W3CのWeb Application Securityワーキンググループにおいて、Chromeチームから『Local Network Access』というセキュリティ機構の提案がされています。 これは、パブリックなWebページからローカルネットワークへのアクセスを保護するための仕組みです。ただし通信をすべてブロックするのではなく、特定のユースケースにおいては安全に通信を許可する必要があります。 背景 簡単に、パブリックなWebページからプライベートネットワークへの通信に関しておさらいしておきます。 攻撃の例とユースケース パブリックなWebページから、プライベートネットワーク(例 http://192.168.0.1 )へリクエストを送信することができます。 imgタグやフォームでプライベートネットワーク宛にPOSTリクエストを送信する JavaScriptのfetchでGETリクエスト
Terraform個人メモ：AWS上でFargateベースのECSアプリケーションを構築するTerraform備忘録 - Qiita
Terraformを活用してAWS環境を効率的に管理したい方の参考になれば幸いです。 書こうと思ったきっかけ AWS環境を手動で構築する際、設定ミスや作業の手間が発生しやすい と感じました。 Terraformを使うことで、インフラの構築・管理がシンプル になり、スケールや変更管理も容易 になります。 実際のAWS構成図 自身の学習や備忘録として、Terraformを使ったAWS環境構築の手順を整理し、共有するために本記事を書くことにしました。 全体概要 このTerraform設定は AWS上でFargateベースのECSアプリケーションを構築 するためのものです。主な構成要素として VPC・サブネット、ECSクラスター、RDS（MySQL）、ALB、CloudFront、S3、Route 53 などが含まれています。 1. ネットワーク構成 VPC（10.0.0.0/16） パブリックサ
Webフレームワーク Honoとは？ - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? Honoとは？ 超高速・軽量なマルチランタイムWebフレームワークの魅力 近年話題のHonoは、Cloudflare Workersをはじめとするエッジ環境やNode.js、Deno、Bunといった主要JavaScriptランタイムで動作する、超高速かつ軽量なWebフレームワークです。以下、その主要な特徴と実用性を簡潔にご紹介いたします。 主な特徴 高速なルーティング: Honoは独自の正規表現ベースのルータ（RegExpRouter）を採用し、Cloudflare Workersなどのエッジ環境においてトップクラスのリクエスト処理性能
JSer.info #725 - Node.js v22.14.0がリリースされました Node.js — Node v22.14.0 (LTS) globにexcludeオプションを追加、node --evalフラグがTypeScriptをサポート、utilモジュールにfindPackageJSONを追加されています。 TestContext.prototype.waitFor()の追加、assert.fileSnapshot()、assert.register()の追加が行われています。 Prettier v3.5.0がリリースされました Prettier 3.5: New objectWrap option, experimentalOperatorPosition option and TS config file support! · Prettier --experimenta
This release deliberately contains backwards-incompatible changes. To avoid automatically picking up releases like this, you should either be pinning the exact version of esbuild in your package.json file (recommended) or be using a version range syntax that only accepts patch upgrades such as ^0.24.0 or ~0.24.0. See npm's documentation about semver for more information. Restrict access to esbuild
私の話だが、ここ数年、個人用であれ業務であれ、新規Webサービスの立ち上げにはNext.jsが最有力候補となっていて、 特に他のフレームワークを選択する動機もないので、ほぼそのままNext.jsを採用している。 最近はこればっかり使っているので、どう書いたらいいのか悩まずに手を動かすことができる。 これが「さあLaravelを使ってみよう」となるとこうはいかない。 おそらくLaravelの使い方を調べながら実装を進めることになるので、工数が倍以上かかることが予想できる。 昔は新しいフレームワークを触るのが好きだったが、最近はそうでもない。 むしろフレームワークのことは考えたくない。ビジネスロジックに集中したい。 コードの共通化を工夫を凝らして実現することも昔は苦ではなかったが、 今となっては各ディレクトリの下に_componentsディレクトリを置いて、脳が死んでいるかのごとく使い捨てのコ
Claude 3 を活用したチャットボットを、AWS のサーバーレスなアーキテクチャで構築してみましょう。Lambda Function URLs を使用して、シンプルなシステムを作ります。 Lambda Function URLs と Bedrock (Claude 3) を組み合わせて、サーバーレスなチャットボットを構築する一例を紹介します。Hono、AI SDK、CDKを活用した実装例と、つまずきやすいポイントを詳しく解説します。 使用技術スタック 言語 TypeScript 5.6.3 フロントエンド React: 19.0.0 Next.js: 15.1.6 Tailwind: 4.0.0 バックエンド Hono: 4.6.7 AI SDK: 4.1.24 @ai-sdk/amazon-bedrock: "^1.1.6" インフラ AWS CDK: 2.164.1 インフラの構築
記事の内容支援士の午後問題における「webセキュリティ」（※１）について、各分野の対策の優先順位を記載する。 ※１ 本稿では、XSS・CSRFなど「安全なwebサイトの使い方（以下「ＩＰＡ本」）」で扱っている分野で、かつプログラミングが必要のない問題をいう。 なぜこの記事を書いたか？近年の支援士では、「IT素人の確実な一発合格」のためにはwebセキュリティの対策がほぼ必須となっている。しかしながら、AP・FEなど下位試験で一切問われない内容であるにも関わらず、webセキュリティの攻略法はネット・参考書ともにほぼ皆無であり、私は受験時に大変困った。私は暗中模索で対策を行い、その成果を過去問で実感しつつR6秋の本番も午後82点で合格できたので、この場でノウハウを共有したい。 なお、webセキュリティの対策が必須である理由については、過去の記事で取り扱っているため、以下も参考にしてほしい。 本稿
Amazon API Gateway のLambdaプロキシ統合設定の有無の違いについて｜ファスト株式会社
はじめまして！ ファスト株式会社 エンジニアの yutak です。 普段はバックエンドの開発、たまにモバイルアプリケーションの開発を担当しています。 プロダクト開発の際に、躓いたことや知見などを記事を通して共有できればと思いますのでよろしくお願いいたします！ 初回である本記事では、Amazon API Gateway の Lambda プロキシ統合と非プロキシ統合の違いについて原因特定の際に調査してわかったことを解説していきます。 背景近年、クラウドネイティブなアプリケーション開発が注目されており、サーバーレスアーキテクチャの採用が広がっています。サーバーレスアーキテクチャでは、従来のようにサーバーやインフラストラクチャを自前で管理する必要がなく、コードを書くだけで必要な計算リソースが自動的に確保されます。このためサービスの開発工数を減らせることが可能になります。 今回、私は自社プロダクト
CORSってなんだ？
はじめに 少し前に業務でCORSの対応をしたことがあったが、なんとなくの理解度で実装を行なっていたので、知識の整理もかねて調べいったことをメモしていく。 CORSとはなに？ 読み方：シーオーアールエス 日本語訳では、"オリジン間リソース共有" これだけではなんのことさっぱりわからないですね。 リソース共有とあるので、URLの共有や同じって意味ですかね..? オリジンがなんのことを指しているのか? オリジンとは ドメインにプロトコルとポート番号を含んでいるもののことをいいます。 オリジンの例：https//test.co:443 ドメインの例：test.com ※プロトコル、ドメイン、ポート番号どれか1つでも異なる場合は異なるオリジンとして判断される。 CORSとは？ オリジンが何かわかってきたので、少しわかってきたような気がしますが CORSとは、あるオリジンとあるオリジンのオリジン間アク
はじめに こんにちは！HRBrainでエンジニアをしている鈴木（善）です。 みなさん、開発環境はどのように整えていますか？ HRBrainでは、エンジニアが自由に使え、壊しても問題のない開発環境を用意しています。 以前は各自のPC上で環境を立ち上げていましたが、PCのリソースを圧迫する問題が無視できなくなり、リモートマシン上でも開発できるように改善しました。運用を始めて1年ほど経ち、課題はあるものの、安定した運用ができています。 本記事では以下について紹介します！ 開発環境の概要 なぜ、どのように構築したのか そこから得られた知見 ざっくりまとめると次のような内容です。 ローカルでもリモートでも開発体験が大きく変わらず、各自が自由に使える環境を整えた。 TiltとGoogle Cloud Workstationsという2つの技術をベースに構築した。 PCとリモートマシン間の通信について試行
個人的備忘録：CORS とは？ Web 開発者が知っておくべきクロスオリジン通信の仕組みをまとめた - Qiita
この問題を解決する仕組みが CORS（Cross-Origin Resource Sharing）です。本記事では、CORS の概要とその仕組み、設定方法について詳しく解説します。 CORS（Cross-Origin Resource Sharing）とは？ CORS（Cross-Origin Resource Sharing）は、異なるオリジン（ドメイン、プロトコル、ポート）の間でリソースをやり取りする際に発生するセキュリティ制限を緩和する仕組みです。 Webブラウザは、セキュリティ上の理由から、異なるオリジンのリソースへのアクセスを制限する「同一オリジンポリシー（Same-Origin Policy, SOP）」を持っています。 参考にした記事 この制限を適切に管理するために CORS が利用されます。 同一オリジンポリシーとは？ Webブラウザはスクリプト（JavaScript など
Bluesky に投稿できる「Blueksy に投稿するよ」というページを ruby.wasm で作った。 https://tmtms.net/bluesky/ 「ねとらぼ」みたいなシフトJISのページの URL を貼るとカード情報が文字化けしたり、旧Twitter の URL を貼ってもカード情報が表示されないみたいなのを解決したかったので作ってみた。 自分しか使わないからスタイルシートとか使ってないし UI はテキトー。 Bluesky の API を使うと、普通の Bluesky のウェブからは投稿できないようなメッセージを作ることができる。 URL をテキストのままにしたり、リンクのテキストを URL ではないものにしたり、リンクカードのテキストとイメージを指定できたり。 ruby.wasm で作ったので基本的にブラウザと Blusky との間でデータがやりとりされる。余計なサーバ
（検証中）GitHub Webhookを使った操作自動ロールバックシステムの構築手順のメモ - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? ※以下はClaude 3.7 Sonnetで聞いてみただけの記事なので未検証です。 これから検証するためのメモです。これを見て試して失敗しても責任は負いかねますので ご了承ください。 このガイドでは、GitHubで何らかの操作（例：イシューの作成）が行われたときに自動的にそれを検知し、その操作を取り消す（ロールバック）するシステムをAWS Lambda、API Gateway、GitHub Webhookを使って構築する方法を詳しく説明します。 目次 GitHub個人アクセストークンの作成 Lambda関数の作成 API Gateway
Terraform個人メモ：AWS上でFargateベースのECSアプリケーションを構築するTerraform備忘録 - Qiita
Terraformを活用してAWS環境を効率的に管理したい方の参考になれば幸いです。 書こうと思ったきっかけ AWS環境を手動で構築する際、設定ミスや作業の手間が発生しやすい と感じました。 Terraformを使うことで、インフラの構築・管理がシンプル になり、スケールや変更管理も容易 になります。 実際のAWS構成図 自身の学習や備忘録として、Terraformを使ったAWS環境構築の手順を整理し、共有するために本記事を書くことにしました。 全体概要 このTerraform設定は AWS上でFargateベースのECSアプリケーションを構築 するためのものです。主な構成要素として VPC・サブネット、ECSクラスター、RDS（MySQL）、ALB、CloudFront、S3、Route 53 などが含まれています。 1. ネットワーク構成 VPC（10.0.0.0/16） パブリックサ
これは InterSystems FAQ サイトの記事です。 管理ポータル > [システム管理] > [セキュリティ] 以下の設定は、%SYSネームスペースにあるSecurityパッケージ以下クラスが提供するメソッドを利用することでプログラムから作成することができます。 以下シナリオに合わせたセキュリティ設定例をご紹介します。 シナリオ：RESTアプリケーション用設定を作成する 事前準備 シナリオの中で使用するソースを2種類インポートします。 アプリケーション用RESTディスパッチクラスをインポートします。 Class Test.REST Extends %CSP.REST { Parameter CHARSET = "utf-8"; Parameter CONTENTTYPE = "application/json"; Parameter CONVERTINPUTSTREAM = 1;
※ヘッダー画像はAdobe Fireflyで生成したものです。 OutlineCloudFlareとは(Tunnel,Accessの紹介) CloudFlare TunnelとAccessを利用するわけ ゼロトラストを採用する理由(当団体のケース) CloudFlaredをサーバに実装 CloudFlare の活用例を紹介 Author学生団体Keisei 副代表 @negishi_tako たこ系エンジニアやってます。 1. CloudFlareとはCloudflareは、世界最大級のネットワークの一つです。今日、ビジネス、非営利団体、ブロガー、およびインターネットプレゼンスを持つ人は、Cloudflareのもたらす恩恵でより速く安全なWebサイトとアプリを利用できます。 www.cloudflare.com/ja-jp/learning/what-is-cloudflare/Cloud
【AWS SAP 対策講座】Lambda関数のCORS設定を理解したので、Bedrockのチャットボット画面を作成したい～まだ会話蓄積できないよ～ - Qiita
【AWS SAP 対策講座】Lambda関数のCORS設定を理解したので、Bedrockのチャットボット画面を作成したい～まだ会話蓄積できないよ～AWSCORSlambdabedrockSAP-C02 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Lambda GET Request Form</title> <style> body { font-family: sans-serif; max-width: 800px; margin: 20px auto; padding: 0 20px; } .form-group { margin-bottom: 20px; } label { display: block; margin-bottom: 8px; font-weight: bold; }
社内向けChrome ExtensionsをReactでモダンにしてみた | CyberAgent Developers Blog
はじめに ご覧いただきありがとうございます。 2024年夏、社内ツール「CA Search」をリニューアルしました！ 本記事では「CA Search」の概要、リニューアルのポイント、開発中に直面した課題などをご紹介します。 CA Searchとは 「CA Search」は、自身のスケジュール確認や会議室の空き状況などの社内情報を簡単に検索できる、CAグループ社員専用のChrome拡張機能です。 初版リリースは2018年ごろで、今回のリニューアルでは大きく2つの改善を行いました。 1. UI/UXの刷新 UI/UXはMUI（Material-UI）を使用し、モダンなデザインへと一新しました。 今日の予定画面：リニュアル前（左）リニューアル後（右） 会議室空き状況画面：リニュアル前（左）リニューアル後（右） これにより、ユーザーにとってさらに直感的で使いやすいインターフェイスを提供します。 印
API GatewayのHTTPプロキシ統合の設定ごとのリクエストヘッダー・URLの値を眺めます。 パターン リソースパスが / (HTTP統合) リソースパスが /{myProxy+} リソースパスが /{myProxy+} & CORSを有効に設定 準備 API Gatewayの裏側はVPC_LINK → NLB → Flaskのアプリ@ECSの構成です。 Flaskのアプリはこちら。リクエストヘッダーを返すだけの簡単な構成です。 1. リソースパスが / (HTTP統合) http://example.com/ X-Amzn-Apigateway-Api-Id: fc5vwzacp2 X-Amzn-Trace-Id: Root=1-5c5fb0f2-843387cadeadbf4c9d3c9036 User-Agent: AmazonAPIGateway_fc5vwzacp2 Acc
週刊Cloudflare - 2025/02/09週
こんにちは、あさひです 🙋♂️ 今週はアップデート多めですね 😅 早速みていきましょう 🙌 この記事の主旨 この記事では、Cloudflare のサービスにどんな変更があったかをざっくりと理解してもらい、サービスに興味を持ってもらうことを目的としています。そのため、変更点を網羅することを優先します。 2025/02/09 ~ 2025/02/15 の変更 Wrangler 3.109.1 パッチアップデート nodejs_compatと unenv によってエイリアスされた npm パッケージの併用時に、__cf_cjs が複数回追加される問題を修正 3.109.0 マイナーアップデート 既存のキューの設定を更新するための新しいサブコマンド queues update が追加されました。これにより、キュー作成後でも設定の変更が可能となります。 Queue 作成時に、メッセージ保持期
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? Spring Boot 技術質問集と回答 基本的な質問 Spring Boot の主な特徴を説明してください。 Spring Boot は、迅速なアプリケーション開発を可能にするフレームワークで、設定の簡略化、組み込みサーバー（Tomcat など）、自動構成機能を提供します。 Spring Boot アプリケーションを起動する方法を説明してください。 SpringApplication.run メソッドを使用してアプリケーションを起動します。また、mvn spring-boot:run コマンドでも起動可能です。 @SpringBoot
Webフレームワーク Honoとは？ - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? Honoとは？ 超高速・軽量なマルチランタイムWebフレームワークの魅力 近年話題のHonoは、Cloudflare Workersをはじめとするエッジ環境やNode.js、Deno、Bunといった主要JavaScriptランタイムで動作する、超高速かつ軽量なWebフレームワークです。以下、その主要な特徴と実用性を簡潔にご紹介いたします。 主な特徴 高速なルーティング: Honoは独自の正規表現ベースのルータ（RegExpRouter）を採用し、Cloudflare Workersなどのエッジ環境においてトップクラスのリクエスト処理性能
私事ですが、現場では Java + Spring Boot を使っており、基本的な REST API の実装は一通りこなせるようになりました。 そろそろ、少し専門的な機能にも挑戦してみようと思い、今回の記事を書いています。 テーマは「セキュリティ」で、認証やら認可やらを盛り込んだログイン画面の開発をしていきたいと思います。 認証系ですと、Spring ベースの Web アプリケーションにおいては Spring Security というフレームワークが使われているそうです。 今回は Spring Security を活用していきます。 ビルドツールは、キャッチアップを兼ねて Gradle を採用しました。 またフロントエンドは JavaScript + Vue.js でモダンな画面に対応していきたいと思います。 もくじ 環境 SpringBootプロジェクト作成 Vueプロジェクト作成 Re
はじめに LangGraphを勉強中でQuickStartを写経しています。（前回記事） Human-in-the-loopと呼ばれるパターンは、コマンドラインアプリだとなかなか動きを実感しづらくUIが欲しくなります。 そこで、今回は、大嶋さんがStudyCoでライブコーディングされていたプログラム（Streamlit）を参考にして、フロントエンド（React）＋バックエンド（FastAPI）の構成で作ってみました。 大嶋さんのStudyCoの動画アーカイブはこちらです。 プログラムの動作の様子 先にプログラムの動作の様子をご覧いただきます。 エージェントがツール利用を提案し人間が承認する場合 エージェントがツールを利用しない場合（承認は不要） 生成AIで楽をする！ （どんどん堕落している気がしますが）今回は上記のStreamlitのプログラムをベースとして、生成AIで楽をして作りました。
こんにちは 👋 株式会社 Rehab for JAPAN フロントエンドエンジニアの okazawa です！ 突然ですが Web アプリ開発で、 API リクエストをする API リクエストをきっかけにバッチ処理等の時間のかかる処理を開始する という場合、バッチ処理の完了をユーザーに知らせるにはどんな方法があるでしょうか？ バッチ処理が完了するまで API レスポンスを返さない 一定時間後に処理が完了しているかユーザーに画面更新等で確認してもらう ポーリングする WebSocket 等リアルタイムにクライアントとサーバー間で双方向通信できるような技術を使って即時通知をする メールで完了通知を送る 簡単に思いつくのはこんなところかと思います。サーバー負荷や UX 的な観点を踏まえると 4 や 5 の方針が良さそうに見えます。 そこで、今回は 4 の方針でバッチ処理の完了をユーザーに即時通知
はじめに こんにちは、ディーネットの山田です。 今年も現地で、AWS Summit Japan へ参加させていただきました。 当社ブースへお越しいただいた皆様や、ブースを巡った際にお話いただいた皆様ありがとうございました。 さて、本題に戻りますが CloudFront のレスポンスヘッダーポリシーについて、設定を検証する機会があったので調べてみました。 どうやら、小ネタが流行っているようなので、小ネタで行きます！！！ CloudFrontのレスポンスヘッダーポリシーについて Amazon CloudFront からビューワーに送信するレスポンスで削除または追加するHTTPヘッダーを指定することができます。 主な用途としては、CORS ヘッダーやセキュリティヘッダーの追加、オリジンから受信した不要なヘッダーを削除するといった用途で利用します。 レスポンスヘッダーポリシーを使用して、Amazo
安定版リリース日: 2025 年 2 月 4 日 特に明記しない限り、以下の変更は Android、ChromeOS、Linux、macOS、Windows 版 Chrome 133 Stable チャンネル リリースに適用されます。 HTML と DOM ポップオーバー属性のヒント値 Popover API は、ポップオーバー属性の 2 つの値（auto と manual）の動作を指定します。この特徴は、3 つ目の値 popover=hint を記述します。ヒントは、多くの場合「ツールチップ」タイプの動作に関連付けられますが、動作は若干異なります。主な違いは、ネストされたポップオーバーのスタックを開くときに、ヒントが自動よりも優先される点です。そのため、既存の自動ポップオーバーのスタックが開いたまま、無関係なヒント ポップオーバーを開くことができます。 典型的な例は、<select> 選
名前 - レスポンスヘッダーポリシーを識別するための名前。コンソールでは、名前を使用して、このポリシーをキャッシュ動作にアタッチします。 説明 (オプション) - レスポンスヘッダーポリシーを説明するコメント。これはオプションですが、このポリシーの目的を特定するのに役立ちます。 CORS ヘッダー Cross-Origin Resource Sharing (CORS) 設定を使用して、レスポンスヘッダーポリシーに CORS ヘッダーを追加および設定できます。 このリストは、レスポンスヘッダーポリシーの設定および有効な値の指定方法に焦点を合わせています。これらの各ヘッダーと、実際の CORS リクエストとレスポンスの使用方法の詳細については、MDN ウェブドキュメントと CORS プロトコルの仕様にある「クロスオリジンリソース共有」を参照してください。 Access-Control-All
Webフレームワーク Honoとは？ - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? Honoとは？ 超高速・軽量なマルチランタイムWebフレームワークの魅力 近年話題のHonoは、Cloudflare Workersをはじめとするエッジ環境やNode.js、Deno、Bunといった主要JavaScriptランタイムで動作する、超高速かつ軽量なWebフレームワークです。以下、その主要な特徴と実用性を簡潔にご紹介いたします。 主な特徴 高速なルーティング: Honoは独自の正規表現ベースのルータ（RegExpRouter）を採用し、Cloudflare Workersなどのエッジ環境においてトップクラスのリクエスト処理性能
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 今回は Microsoft の AI、Form Recognizer の新機能である「カスタマイズ」を試してみたいと思います。この機能は 2020 年 3月 17 日の Azure Blog で紹介された新しい機能です。 (参考Blog) New features for Form Recognizer now available https://azure.microsoft.com/ja-jp/blog/new-features-for-form-recognizer-now-available/ そもそも Form Recogni
次のユースケースセクションでは、API Gateway API のさまざまなタイプと、API Gateway を使用するさまざまなデベロッパーの概要を示します。REST API と HTTP API の違いの詳細については、「REST API と HTTP API のどちらかを選択する」を参照してください。 API Gateway を使用して REST API を作成する API Gateway REST API はリソースとメソッドで構成されます。リソースは、リソースパスを介してアプリがアクセスできる論理エンティティを表します。メソッドは、API のユーザーによって送信される REST API リクエストや、ユーザーに返るレスポンスに対応しています。 たとえば、/incomes はアプリユーザーの収益を表すリソースのパスです。リソースには、適切な HTTP 動詞 (GET、POST、PU
この記事は、「Django Advent Calendar 2019」の22日目の記事です。 DjangoでJWT認証のAPIを構築してみました！ 事前準備 Django REST frameworkの構築 以前書いた記事でAPIの構築までを説明します。 Django #005 – API構築 環境 Python v3.6.0 Django v2.2.1 Django REST framework v3.9.3 今回は、JWT認証のAPIを構築してみます！ まずは、各モジュールをインストールします。 Simple JWTをインストール pip install djangorestframework_simplejwt djoserをインストール pip install djoser django-cors-headersをインストール pip install django-cors-hea
【AWS×サーバーレス】S3 + API Gateway + Lambda で簡単なアプリ作ってみた - Qiita
初めに 今回はAWS を使って簡単な Web アプリを作成してみました。 本アプリは、S3 上に配置した HTML フロントエンドから数字を入力し、その入力値に Lambda で消費税を計算して返すという、とてもシンプルなものです。 バックエンドの処理は API Gateway 経由で Lambda を呼び出す形にしているため、フロント側からは REST API として利用できる構成になっています。 構成 今回のアプリの全体構成です。S3 に配置した静的ウェブホスティングの HTML ファイルを通して、API Gateway → Lambda と進み、消費税計算の結果を返す流れです。 コード ここでは、実際に使用したフロントエンド (HTML) とバックエンド (Lambda) のサンプルコードを紹介します。 HTML (S3 ホスティング用) API gateway作成後にconst a
Caddyの記事一覧
articlesTrendingAlltimeLatest👗画像生成AIで生成した画像をCaddyで管理する黒ヰ樹2022/12/13 11🕳️[Caddy]Raspberry Pi Zero WHで毎日アクセスしたくなるファイルサーバーを動かす(WebDAV)黒ヰ樹3ヶ月前 5🔨Caddy to WebDAVで個人サイトをはじめよう黒ヰ樹2023/07/02 6👨👨👦👦Matrix自鯖メモ（docker-compose, synapse, Caddy）hidaruma2022/04/10 4🏌CaddyにおけるCORS（FastAPIとNext.jsを添えて）gsy09112024/08/22 1🧟[PHP]Laravel 11をGlitchで動かす(FrankenPHP)黒ヰ樹2024/06/07 2🚍CaddyとCloudflarePagesで複数サイトを1
Lambda プロキシ統合と考える API Gateway の CORS (Cross-Origin Resource Sharing) 設定 - サーバーワークスエンジニアブログ
こんにちは、野球と LoL(League of Legends) がシーズンオフとなり、心もシーズンオフの末廣です。 本ブログは、 Lambda プロキシ統合について理解した上で、Lambda 統合された API Gateway での CORS 設定を行っていくものとなります。CORS の基礎から設定方法、その具体例を用いて Lambda プロキシ統合について理解を始める参考にしてください。 ※ 本ブログで使用する API Gatewayは HTTP API ではなく、REST API になります。 CORS について Lambda プロキシ統合について Lambda プロキシ統合と CORS の関係と影響 実際の設定例 Lambda プロキシ統合の場合 非プロキシ統合の場合 ANY メソッドの場合の注意点 API Gateway からのレスポンス形式 プロキシ統合リソースのレスポンス 非
はじめに こんにちは、クラウドエースの第3開発部に所属している金です。 今回は Next.js で Server Actions を使ってフォームの送信処理を行う方法について紹介します。 フォームの処理については、これまでの Route Handler を使用したカスタムハンドラーの実装方法でも対応できますが、 Server Actions を利用することで、よりシンプルかつ効率的にサーバーサイドの処理を実装することができます。 対象読者 Next.js の基礎知識がある方 Route Handlers の使用経験がある方 Server Functions に興味がある方 Next.js でフォーム実装の簡略化を検討している方 事前準備 Next.js プロジェクトの作成 本記事では、Next.js v15.1.3 を使用しています。 Tailwind CSS のインストール Tailwi
Terraform個人メモ：AWS上でFargateベースのECSアプリケーションを構築するTerraform備忘録 - Qiita
Terraformを活用してAWS環境を効率的に管理したい方の参考になれば幸いです。 書こうと思ったきっかけ AWS環境を手動で構築する際、設定ミスや作業の手間が発生しやすい と感じました。 Terraformを使うことで、インフラの構築・管理がシンプル になり、スケールや変更管理も容易 になります。 実際のAWS構成図 自身の学習や備忘録として、Terraformを使ったAWS環境構築の手順を整理し、共有するために本記事を書くことにしました。 全体概要 このTerraform設定は AWS上でFargateベースのECSアプリケーションを構築 するためのものです。主な構成要素として VPC・サブネット、ECSクラスター、RDS（MySQL）、ALB、CloudFront、S3、Route 53 などが含まれています。 1. ネットワーク構成 VPC（10.0.0.0/16） パブリックサ
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
表示中のページから塗り絵用の線画を作るブックマークレット - hitode909の日記
2025-02-14のJS: Node.js v22.14.0, Prettier v3.5.0, Chrome 133
Release v0.25.0 · evanw/esbuild
JWTは本当に必要なのか？Next.js開発者の疑問と検証
AWS Lambda Function URLs で作るチャットボット | DevelopersIO
情報処理安全確保支援士「webセキュリティ」各分野の対策優先度(徳丸本関係・非SE素人向け)｜nanchane
ローカル・リモートお好きにどうぞな、HRBrainのマイクロサービス開発環境
Bluesky に投稿するよくんを作ったよ - tmtms のメモ
管理ポータルのウェブ・アプリケーションメニューの設定をプログラムで作成する方法
CloudFlareを利用してゼロトラストアクセスを30分で実現！｜学生団体Keisei
API GatewayのHTTPプロキシ統合のURL・リクエストヘッダーを眺める
Spring Boot 技術質問集50選 - Qiita
【Spring Security】セキュリティ対策キャッチアップ - Qiita
LangGraphの"Human-in-the-loop"のUIを生成AIで楽して作った！ - Qiita
Socket.IOでバッチ処理の完了をユーザーに即時通知してみる
【小ネタ】CloudFrontのレスポンスヘッダーポリシーを設定する - DENET 技術ブログ
Chrome 133 | Release notes | Chrome for Developers
レスポンスヘッダーポリシーを理解する - Amazon CloudFront
Form Recognizer の新機能「カスタマイズ」を試してみた！ - Qiita
API Gateway のユースケース - Amazon API Gateway
dayjournal | Try #036 – DjangoでJWT認証のAPIを構築してみた
Server Actions を 使って Next.js で フォーム処理を実装。