Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 筆者は現在、ESMベースの素のJavaScriptにJSDocで型情報を付与し、tsc によって型定義（.d.ts）のみを出力する構成で開発を行っています。 この構成は、静的解析や補完といった恩恵は享受しつつ、 視認性の良さ 型の複雑化 言語的な矛盾 ビルドの煩雑さ チーム運用コストの肥大化 といったTSの構造的な問題を回避する、極めてバランスの取れた開発スタイルであると思い採用しています。 私も現場を指揮する上でTSへの移行についてはずっと考えてきましたが、次にTSで書きたいと言われた際には 「開発コスト食い潰すだけだからや
Flutter開発の真実：クロスプラットフォームの光と影 #Flutter #GameWith #TechWith - GameWith Developer Blog
目次 はじめに Flutter開発6年間の実践知識 Flutterの進化と共に 実務での実感：Flutterの真の価値 個人での感想レベル ベンチャー企業におけるFlutter採用 開発中の典型的な障壁とその解決策 Flutter Web特有の課題 パッケージ紹介 Network関連 UI関連 その他利用したことのあるパッケージ Flutter Web特化パッケージ その他の開発上の運用について Basic認証の実装例 IP制限の実装 まとめ：Flutterの光と影 クロスプラットフォーム対応のFlutterの光（強み） クロスプラットフォームの対応のFlutterの影（課題） 最後に はじめに GameWithのクライアントアプリチームでリーダーをしているkyamです。 元々はiOSエンジニアとして活動していましたが2018年頃から社内・社外でFlutterを活用したモバイルアプリやWe
AWS Transfer Family web apps を使ってノーコードでS3のWebUIを作成する - Taste of Tech Topics
はじめに こんにちは、一史です。 暖かくなりベランダに出している金木犀が新芽を出してきました、春ですね。 さて、ストレージサービス間でファイル転送を実現するサービス、AWS Transfer Familyの新機能として、web appsというものがあります。 aws.amazon.com この機能を使うことで、S3のWebUIをノーコードで作成することができるようになりました。 今回はこの新機能を用いて実際にWebUIを作成し、ユーザー単位のアクセス制御が行えるかを試していきます。 はじめに AWS Transfer Family web apps とは AWS Transfer Family web appsを用いてS3 WebUI作成する WebUIの完成像 WebUIの作成 ユーザーの作成・割り当て ユーザーのファイルへのアクセス権限の設定 作成したS3 WebUIの操作 ユーザーご
Update 1.99.1: The update addresses these security issues. Update 1.99.2: The update addresses these issues. Update 1.99.3: The update addresses these issues. Downloads: Windows: x64 Arm64 | Mac: Universal Intel silicon | Linux: deb rpm tarball Arm snap Welcome to the March 2025 release of Visual Studio Code. There are many updates in this version that we hope you'll like, some of the key highligh
WebKit Features in Safari 18.4
Safari 18.4 is here! It includes 84 new features, including a completely new declarative mechanism for sending Web Push notifications, lots of CSS including a brand-new shape() function, P3 & translucency for the HTML color picker, media formats with more robust support for recording, new Web APIs including modern popover manipulation, new JavaScript features like Iterators, a faster way to jump t
図に表すとこんな感じです(雑ですみません) 2. 作るもの 自社サービスの劣化版を作りつつ、そこにAIエージェントを搭載する体で実装していこうかと思います。 弊社のサービスについて 弊社は「KANNA」という建築や製造、不動産などの現場で働く方をターゲットにしたサービスを提供しています。メインとしては「プロジェクト管理アプリ」「デジタル帳票アプリ」という大きく2軸の機能で展開しています。 全体の流れとして、「案件」を作成し、そこに写真や資料を格納します。その案件ごとにチャットを作成することもできます。 「案件テンプレート」と呼ばれる案件の雛形を事前にカスタマイズし、プリセットを作る機能があります。 今回作るもの AIエージェントを介して、案件の操作をできるように実装をしていこうかと思います。以下のような操作が必要になるかと思います。 案件の作成 案件テンプレート/案件名/説明 の指定が必須
週刊Cloudflare - 2025/04/13週
こんにちは、あさひです 🙋♂️ 今週の Cloudflare のアップデートをまとめていきます！ この記事の主旨 この記事では、前週に Cloudflare のサービスにどんな変更があったかをざっくりと理解してもらい、サービスに興味を持ってもらうことを目的としています。そのため、変更点を網羅することを優先します。 2025/04/06 ~ 2025/04/12 の変更 Wrangler 4.10.0 マイナーアップデート wrangler workflows コマンドをステーブル（正式サポート）として昇格。 パッチアップデート wrangler dev サーバーでのリクエストログが重複して出力される問題を修正し、1 回だけログ出力されるように改善。 依存関係を更新 miniflare@4.20250409.0 4.9.1 パッチアップデート 依存関係を更新 miniflare@4.20
はじめに春の入門祭り2025 1日目です。 Web API開発プラットフォームとして高い人気を誇るPostmanの入門記事です。 PostmanとはPostmanはWeb API開発のあらゆる工程を支援するプラットフォームです。 この、Web API開発プラットフォームという用語は初見ではイメージがつきにくいかと思います。例えば、curl や VS Coode拡張の REST Client とどの程度違いがあるのか、 OpenAPI Specification などとの関連性は？などフワッとしてしまいます。 まず、競合？となりえそうな周辺のツールと比較すると輪郭が明確になるのではないかという仮説のもと作成したのが下表です。 フェーズ/機能詳細Postman競合ツールの例設計API定義 (OpenAPI) 作成・編集・検証✅ API Builder (OpenAPI v2, v3, v3.1
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 暫くの間、開発をしていなかったためリハビリもかねて開発してみました シンプルなTODOアプリを開発 (CursorとGPT使ってAI駆動で開発していたんだけど進化しすぎ...） システムについて フォームに入力してタスクを追加できる 削除もできる チェックを入れると取り消し線が入る 技術スタック インフラ EC2 + Docker + GitHubActions 手動ではなく、自動ビルドのパイプライン構築を体験したかった 実務に繋がる「CI/CD」の最初の一歩として導入 プッシュすると自動でDockerイメージがビルドされる設
何を作ったか？ 「国交省の不動産情報ライブラリAPI のバイナリベクトルタイルを、Mapbox / MapLibre GL JS で直接使えるようにするプロキシAPI」 を作りました。 これを使えば、下記のようなコードだけで不動産価格データを地図に重ねて表示できます： // 不動産価格（取引価格・成約価格）ポイントのベクトルタイルソースを追加 map.addSource("real-estate-price", { type: "vector", tiles: [ "https://du6jhqfvlioa4.cloudfront.net/ex-api/external/XPT001/{z}/{x}/{y}.pbf?from=20234&to=20243" ], minzoom: 13, attribution: '<a href="https://www.reinfolib.mlit.g
Why Is This Site Built With C Created at: 2024-08-26 I've been writing about things on a personal website since 2017. Most of what I have written features in the category of notes-to-self. Mostly on how to do A or B. Only recently I've started polishing notes together and forming posts on specific topics. One thing I realised was preventing me of writing more frequently wasn't the lack of ideas (o
Rspack
March 28, 2025 Announcing Rspack 1.3# Rspack 1.3 has been released! Notable changes: New features Circular dependency detection Build HTTP imports Lazy compilation improvements AMD supports Performance improvements Code splitting 25% faster Bundle size optimization Memory improvements Rstack updates Rsdoctor 1.0 Rsbuild 1.3 Rslib 0.6 Rspress and Rstest Ecosystem Rspeedy for Lynx Re.Pack 5 React Ro
HTTPガイドHTTP の概要HTTP の進化典型的な HTTP セッションHTTP メッセージMIME タイプ（IANA メディア種別）HTTP の圧縮Compression Dictionary Transport Experimental HTTP キャッシュHTTP 認証HTTP Cookie の使用HTTP のリダイレクトHTTP 条件付きリクエストHTTP 範囲リクエストコンテンツネゴシエーションHTTP/1.x のコネクション管理プロトコルのアップグレードの仕組みプロキシーサーバーとトンネリングHTTP クライアントヒントHTTP セキュリティ実践的なセキュリティ実装ガイドHTTP ObservatoryPermissions Policy Experimental コンテンツセキュリティポリシー (CSP)Cross-Origin Resource Policy (CORP
HTTP 認証 - HTTP | MDN
HTTPガイドHTTP の概要HTTP の進化典型的な HTTP セッションHTTP メッセージMIME タイプ（IANA メディア種別）HTTP の圧縮Compression Dictionary Transport Experimental HTTP キャッシュHTTP 認証HTTP Cookie の使用HTTP のリダイレクトHTTP 条件付きリクエストHTTP 範囲リクエストコンテンツネゴシエーションHTTP/1.x のコネクション管理プロトコルのアップグレードの仕組みプロキシーサーバーとトンネリングHTTP クライアントヒントHTTP セキュリティ実践的なセキュリティ実装ガイドHTTP ObservatoryPermissions Policy Experimental コンテンツセキュリティポリシー (CSP)Cross-Origin Resource Policy (CORP
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 業務で、初めてLambdaとCDKを使って実装を行いました！ ずっと気になってたAWSサービスですが、ハンズオン以外使ったことありませんでした。 勉強がてら備忘録と使った感想を書いておこうと思います！ JumpStartやAWSome dayを受講して理解が深まったのもあり、頭がホットなうちにアウトプットしたいと思います。 なぜlambdaを使ったのか チャットボットのAPIを作る必要があり、初めてAWSのLambdaを使ってみました。 今回の要件はこんな感じです🤖 チャットボットの作成（LLMはBedrockを使用） jsファイルを
はじめに Go言語は、その高速な実行速度とシンプルな文法から、Webアプリケーション開発に非常に適したプログラミング言語です。 特にGoは、サーバーサイドのバックエンドやAPIサーバーの構築に高いパフォーマンスを発揮します。 また、React + Viteなどを使うことで、モダンなフロントエンドも簡単に構築できます。 今回は、Goをバックエンド、React + Viteをフロントエンドにし、簡単なフルスタックアプリの作成手順を解説します。 対象読者 GoでWebアプリを作ったことがない方 Reactを使ったフロントエンドの連携を体験したい方 シンプルなフルスタックアプリをで作成してみたい方 目次 開発環境の構築 バックエンド(Go+Gin)の作成 ルーティングの設定 CRUD APIの実装 CORS対応の設定 フロントエンド(React + Vite)の作成 Reactプロジェクトのセット
![Go言語で学ぶWebアプリケーション開発1：[React + Vite + Go]](https://cdn-ak-scissors.b.st-hatena.com/image/square/f8e56b79e629c0b9811ccc14743f69087ade76b0/height=288;version=1;width=512/https%3A%2F%2Fres.cloudinary.com%2Fzenn%2Fimage%2Fupload%2Fs--TkJIhZEQ--%2Fc_fit%252Cg_north_west%252Cl_text%3Anotosansjp-medium.otf_55%3AGo%2525E8%2525A8%252580%2525E8%2525AA%25259E%2525E3%252581%2525A7%2525E5%2525AD%2525A6%2525E3%252581%2525B6Web%2525E3%252582%2525A2%2525E3%252583%252597%2525E3%252583%2525AA%2525E3%252582%2525B1%2525E3%252583%2525BC%2525E3%252582%2525B7%2525E3%252583%2525A7%2525E3%252583%2525B3%2525E9%252596%25258B%2525E7%252599%2525BA1%2525EF%2525BC%25259A%25255BReact%252520%25252B%252520Vite%252520%25252B%252520Go%25255D%252Cw_1010%252Cx_90%252Cy_100%2Fg_south_west%252Cl_text%3Anotosansjp-medium.otf_37%3AHiroki%252520Urabe%252Cx_203%252Cy_121%2Fg_south_west%252Ch_90%252Cl_fetch%3AaHR0cHM6Ly9zdG9yYWdlLmdvb2dsZWFwaXMuY29tL3plbm4tdXNlci11cGxvYWQvYXZhdGFyLzI4NmEwZTdkZjMuanBlZw%3D%3D%252Cr_max%252Cw_90%252Cx_87%252Cy_95%2Fv1627283836%2Fdefault%2Fog-base-w1200-v2.png)
【Adobe Fireflyの使い方】Pixabay・Unsplash・Shutter Stock等で見つからない画像を生成する方法 - このは屋
`; $el.appendChild(tooltipEl); } $el.querySelector('.tooltip').style.display = 'inline-block'; } }, hideTooltip($el) { if($el.querySelector('.tooltip')) { $el.querySelector('.tooltip').style.display = 'none'; } }, toggleTooltip($el) { if($el.querySelector('.tooltip')) { if($el.querySelector('.tooltip').style.display === 'none') { $el.querySelector('.tooltip').style.display = 'inline-block'; } else
`; $el.appendChild(tooltipEl); } $el.querySelector('.tooltip').style.display = 'inline-block'; } }, hideTooltip($el) { if($el.querySelector('.tooltip')) { $el.querySelector('.tooltip').style.display = 'none'; } }, toggleTooltip($el) { if($el.querySelector('.tooltip')) { if($el.querySelector('.tooltip').style.display === 'none') { $el.querySelector('.tooltip').style.display = 'inline-block'; } else
REST API 設計指針・通信、パラメーター編
前回の記事ではREST APIを設計する上での認証認可について基本的な考え方をまとめました。 第二回のこの記事ではリクエスタからAPIへ通信を行う際の考慮点やパラメータの渡し方についてまとめていきます。 パラメータの推奨される受け渡し方法 前回の記事で以下の通り記載しました。 セキュリティのため、認証に用いる情報はHTTPヘッダーに含めて送信し、URLに認証情報を含めないようにします。（セキュリティの観点から、URLパラメータに認証情報を含めないようにする） これがなぜなのかについてまずはまとめていきます。 REST APIは以下の論文で定義されたのが土台といわれています。 そしてこの考え方に従って設計されたREST API は RESTfulともいわれます。基本的な考え方はHTTPの標準的なお作法にのっとりましょう、というものです。HTTPは非常に汎用性の高いプロトコルであり、リクエスタ
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 業務でAdonisJSというフレームワークを利用する機会があったので、概要をまとめていこうと思います。 AdonisJSとは TypeScriptベースのフルスタックWebフレームワークです LaravelやRailsと似ている部分が多くあり、これらの開発に慣れている人は導入しやすい Laravelのようにルーティング、コントローラ、ORMなど公式パッケージが提供されています MVCパターンを採用しています 2015年にHarminder Virkさんが作り、そこから複数人のコアチームで開発が続けられ、2025年4月現在はver6がリリ
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 第9章までで、Reactとバックエンドを使ったWebアプリをゼロから構築し、デプロイしました。今回はシリーズを振り返り、学んだことをまとめ、次のステップを提案します。 目標 これまでの内容を総括する 学んだ教訓を共有する さらなる学習リソースとプロジェクト案を提供する シリーズの振り返り 第1章: 環境構築（ReactとNode.js/Express）。 第2章: Reactで基本UIを構築。 第3章: バックエンドでRESTful APIを作成。 第4章: ReactとAPIを連携。 第5章: Context APIで状態管
プロキシサーバーとは プロキシサーバーとは、高速なアクセスや安全な通信を確立するための中継サーバのこと。 プロキシサーバーは、インターネットへのアクセスまたはインターネットからのアクセスを代理で行う。 フォワードプロキシ クライアントの代わりにサーバーへリクエストを送信するプロキシサーバー。 主な目的 1. データの取得を高速化 データをキャッシュすることで、取得時間を短縮する。 2. セキュリティの向上 許可されていない不正サイトへのアクセスをブロックする。 3. アクセス履歴の管理 アクセス元を一元管理し、誰がどのサイトにアクセスしたかの情報を記録できる。 4. アクセス制限の緩和 CORS非対応のAPIにブラウザからアクセスする際、代理でアクセスすることでリクエストを可能にする。 リバースプロキシ クライアントからのリクエストを受け取り、適切なサーバーに転送するプロキシサーバー。 主
Flutter開発の真実：クロスプラットフォームの光と影 #Flutter #GameWith #TechWith - GameWith Developer Blog
目次 はじめに Flutter開発6年間の実践知識 Flutterの進化と共に 実務での実感：Flutterの真の価値 個人での感想レベル ベンチャー企業におけるFlutter採用 開発中の典型的な障壁とその解決策 Flutter Web特有の課題 パッケージ紹介 Network関連 UI関連 その他利用したことのあるパッケージ Flutter Web特化パッケージ その他の開発上の運用について Basic認証の実装例 IP制限の実装 まとめ：Flutterの光と影 クロスプラットフォーム対応のFlutterの光（強み） クロスプラットフォームの対応のFlutterの影（課題） 最後に はじめに GameWithのクライアントアプリチームでリーダーをしているkyamです。 元々はiOSエンジニアとして活動していましたが2018年頃から社内・社外でFlutterを活用したモバイルアプリやWe
久しぶりです、Xu です。 この挨拶もめんどくさくなってきましたね、そろそろ月一くらいのペースで記事書けたらもう久しぶりって言うこともないかもしれません。（初めましてがほとんどか。。。） 私事ですが、今月挙式しました。 式とは言っても披露宴のみですが、まあやってよかったと思ってます。 さて表題の件ですが、皆さんも一度は見たことあるんじゃないでしょうか？ Access to fetch at 'https://~.lambda-url.ap-northeast-1.on.aws/' from origin 'https://~.vercel.app' has been blocked by CORS policy: Response to preflight request doesn't pass access control check No 'Access-Control-Allow-
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? AWS Cost Dashboardを作成してみた 概要 過去30 日分のAWSのコストを簡単に可視化できる簡単なアプリケーションを作成しました。このアプリケーションは、AWS Cost Explorer APIを利用して、AWSアカウントの過去30日分のコストを取得し、フロントエンドで表示する仕組みになっています。 この記事では、使用した技術や実装のポイントについて解説していきます！ 使用技術 AWS サービス AWS Lambda: コストデータを取得するバックエンドを実装 API Gateway: Lambda関数を公開するための
本記事は、オープンソースAIペンテストツールNebulaの基本から応用までを徹底解説します。セットアップ手順、端末操作の流れ、CI/CDへの組み込み、プラグイン開発、さらにはチーム運用のノウハウまで、これ一つで網羅。AI時代のセキュリティ担当者必読の永久保存版です。 目次 1. Nebulaとは何か？ 2. 機能詳細とアーキテクチャ 3. インストールと初期セットアップ 4. 基本的な使い方：ChatOpsスタイルで操作 5. 自律モードによる完全自動ペンテスト 6. Flask＋Reactで作る社内スキャンプラットフォーム 7. GitHub Actions連携：夜間定期スキャンの自動化 8. モデルチューニングとマルチモデル比較 9. チーム運用とPenTestOps 10. ケーススタディ：実践レポート作成の自動化 11. FAQ：よくある質問と回答 12. まとめと今後の展望 付録
Web情報取得・要約MCPサーバー - Qiita
. ├── config.ts # 設定管理、環境変数 ├── logger.ts # ロギング機能 ├── types.ts # TypeScript 型定義 ├── repository.ts # データ永続化層 (JSON ファイル) ├── llmService.ts # LLM (Gemini) 連携サービス ├── siteDataProvider.ts # Webサイトデータ取得サービス (sitemcp) ├── searchService.ts # コアビジネスロジック、ハンドラー ├── httpServer.ts # HTTP サーバー (Express) ├── mcpServer.ts # MCP サーバー (Stdio) ├── web-mcp.ts # アプリケーションエントリーポイント ├── package.json ├── tsconfig.json └
A recent Andreessen report shows a growing trend in self-hosted AI, jumping from 42% to 75% year-over-year. It demonstrates the notion among developers that on-premise is inherently more secure, but it still comes fraught with danger if you're not hyper-focused on security in addition to the AI. This came into play recently as the Snyk Security Labs team identified vulnerabilities within Cortex.cp
GASからのCROSエラーの解決方法 Browse: Home / GASからのCROSエラーの解決方法 少しハマりましたので、忘備録として。 参考サイト https://knmts.com/become-engineer-31/ この記事を書いてから、同目的の別記事を書いています。こちらの方がシンプルかもしれません。 https://i-say.net/note/1100/ 以下の記事にある「mode: ‘no-cors’」の設定は、あまり今は推奨しません。 上記のページで解決できるので、上記のページを先にお読み下さい。 1. はじめに Google Apps Script（GAS）を使用してGoogleスプレッドシートやその他のGoogle Appsと連携するアプリケーションを開発する際、フロントエンドからのリクエストがCORS（Cross-Origin Resource Sharin
お手軽GhostBSD。いいですね。 古いノートPCに入れて日本語環境を整えると私のサーバ管理作業の大半をこなせます。 ソフトウェア開発をするにあたっても、VSCodeが入ります。 VSCode は特に苦労しなかったので割愛しますが、Laravelともなると、例の shell スクリプト一発というわけにも行きません。 悪いなノビタ、これはLinux用なんだ てなわけで、composer からコツコツと入れる作業をしましょう。 Feb 6 20:06:18 ghostbsd pkg[50737]: php82-8.2.27 installed Feb 6 20:06:18 ghostbsd pkg[50737]: php82-ctype-8.2.27 installed Feb 6 20:06:18 ghostbsd pkg[50737]: php82-curl-8.2.27 install
こんにちは！かねごん（@hrbk25）です！ 今回は、kintone と AWS Lambda を連携する方法 について、devCamp で学んだ内容を簡単にまとめました。 当日の勉強会の内容に加え、座学で学んだ CORS（クロスドメイン制約）の回避方法、Lambda 関数の基本について少しだけ詳しくまとめています。 どんな人向けの記事か devCampでどんな内容が行われているか気になっている人 kintone と AWS Lambda の基礎を知りたい人 devCamp とは devCampとは、エンジニア向けのkintone開発勉強会です。 動画のコンテンツなどもあり、非常に有益な情報がいっぱいあります。 devCamp（エンジニア向け kintone 開発勉強会）とは、 kintone 開発案件の対応に必要なスキルが無料で学べる、サイボウズ主催の勉強会です。 devCamp の概要
`; $el.appendChild(tooltipEl); } $el.querySelector('.tooltip').style.display = 'inline-block'; } }, hideTooltip($el) { if($el.querySelector('.tooltip')) { $el.querySelector('.tooltip').style.display = 'none'; } }, toggleTooltip($el) { if($el.querySelector('.tooltip')) { if($el.querySelector('.tooltip').style.display === 'none') { $el.querySelector('.tooltip').style.display = 'inline-block'; } else
はじめに サーバー管理ゼロ、世界中どこからでもミリ秒台の読み出しが可能なグローバル分散型キー・バリュー・ストア API「AwesomeKV」を個人開発しました。本記事では、その特徴、使い方、アーキテクチャ、今後のロードマップなどをご紹介します。 背景とコンセプト サーバーレス: インフラ管理不要で、コードだけ書いてデプロイ。 Key–Value ストア: 簡単な CRUD（生成・取得・更新・削除）操作を HTTP で完結。 グローバル分散: Cloudflare Workers KV 上に構築し、Edge キャッシュによる低レイテンシを実現。 多くのプロジェクトで、ちょっとした設定やフラグを保存したいだけのためにフルマネージド DB を立てるのはオーバースペック。そこで、最低限の機能に絞った軽量 KV ストアを自分で作ってみました。 主な特徴 シンプル RESTful API GET /<
昨今、巷ではClineやDevinによるAIコーディングが話題です。特にDevinのような「タスクを渡したら、完了まで自律的に思考と行動を繰り返すエージェント型ソフトウェア」には、面倒だけど微妙に自動化しきれない作業を巻き取ってくれる可能性を秘めていると期待しています。例えば、machine-readableでない文書を定期的に監視して変更を実装に反映する、などです*1。 そもそも、どのようにしてAIに自律的に思考と行動を繰り返させているのでしょうか？AIの最新情報には疎いので、実装イメージがパッと思い浮かびません。どのようなアーキテクチャになっているのか非常に興味が湧いてきました。 Devinは商用プロダクトなのでコードベースは公開されていませんが、類似のオープンソース実装であるOpenHandsであればコードが読めます。本記事はもっとも仕組みが単純そうなHeadless Modeの実装
[Auth0] Auth0とAWSのOIDC連携でセキュアなS3アクセス制御を実現する | DevelopersIO
こんにちは。 業務効率化ソリューション部の西川です。 Webアプリケーションを開発していると、例えば「ユーザーごとにS3バケットを用意して、そこに直接ファイルをアップロードできるようにしたい」という要件があるかもしれません。 これって、意外と悩ましい問題になりそうですよね。Auth0でユーザー認証はできているけど、そのユーザーにどうやってAWSのリソースにアクセスさせるか...。 今回は、このような課題を解決するために、Auth0とAWSのOIDC連携を使う方法をご紹介します。 特にIAMユーザとの連携でリソースアクセスの権限を制御したい方や外部ID連携を検討されているエンジニアの方に役立つ内容になるんじゃないかと思います。 はじめに 外部ID連携って何がうれしいの？ 外部ID連携（OIDC連携）は、認証基盤とクラウドサービスを連携させる仕組みです。 Auth0のような認証基盤を使うことで
![[Auth0] Auth0とAWSのOIDC連携でセキュアなS3アクセス制御を実現する | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/d3d5ebfa608c5130cc022b83754cb51dadeb92da/height=288;version=1;width=512/https%3A%2F%2Fimages.ctfassets.net%2Fct0aopd36mqt%2Fwp-thumbnail-7eb05cff17e4d038241d9d9227070b41%2F97d43d026f69c81dfc2907708e623fb0%2Feyecatch_auth0)
`; $el.appendChild(tooltipEl); } $el.querySelector('.tooltip').style.display = 'inline-block'; } }, hideTooltip($el) { if($el.querySelector('.tooltip')) { $el.querySelector('.tooltip').style.display = 'none'; } }, toggleTooltip($el) { if($el.querySelector('.tooltip')) { if($el.querySelector('.tooltip').style.display === 'none') { $el.querySelector('.tooltip').style.display = 'inline-block'; } else
背景 GoogleAppsScript(GAS)を使用して在庫管理のWebアプリを作ります。 以下のようにGoogleサービスで構成を組むことで、お金をかけずにWebアプリを組んでしまおうと考えてます。 Google Site <-----> GAS <---> Googleスプレッドシート ハマったこと GASへのGETが通らずCORSエラーが発生する。 （POSTも同様と思います） 結論 GASのdoGet関数内にエラーがないか確認。 アクセスできるユーザーを「全員」にしてデプロイする。 詳細 Javascript(jQuery)からGASへGETで通信を試みるが、 CORSエラーが出続けているのでサーバー(GAS)からのAccess-Control-Allow-Origin設定が悪いのか？！とヘッダ付与方法をずっと探していました。 Access to XMLHttpRequest a
`; $el.appendChild(tooltipEl); } $el.querySelector('.tooltip').style.display = 'inline-block'; } }, hideTooltip($el) { if($el.querySelector('.tooltip')) { $el.querySelector('.tooltip').style.display = 'none'; } }, toggleTooltip($el) { if($el.querySelector('.tooltip')) { if($el.querySelector('.tooltip').style.display === 'none') { $el.querySelector('.tooltip').style.display = 'inline-block'; } else
SSE（Server-Sent Events）を実装したけど、なぜかリアルタイム反映されてないときの解決法 - Qiita
SSE（Server-Sent Events）を実装したけど、なぜかリアルタイム反映されてないときの解決法 過去に自分がはまってしまった、SSE（Server-Sent Events）を実装してしっかりとCORSも考慮したのに、なぜかリアルタイム反映されない罠について解説します。 はじめに Server-Sent Events (SSE)は、サーバーからクライアントに対してリアルタイムでデータを送信するための技術です。しかし、実装したものの、リアルタイムで反映されないという問題に遭遇することがあります。これは、さまざまな原因が考えられます。 この記事では、SSEを実装した際にリアルタイム更新が反映されない原因と、それを解決するための方法を解説します。 1. HTTPレスポンスのバッファリング これが一番の沼りポイントだと思います。 SSEでは、サーバーからクライアントにデータをリアルタイム
背景と目的 Tableauユーザーのみなさま どうもこんにちは٩( ᐛ )و 突然ですが、拡張機能「Export All」をご存じでしょうか？ この拡張機能を使えば、Excelファイルで複数のシートを一括ダウンロードできるため、大変便利ですよね！ しかし、ダッシュボード内に埋め込んだ画像をそのままExcelへ出力したい場合、既存のExportAllでは Tableau上で画像化 していたとしてもURL文字列のままエクスポートされてしまいます。 もちろん、ダウンロードしたExcelファイル上でIMAGE関数やマクロを用いて画像を表示させることも可能です。 とはいえ、作業工程が増えて運用の手間になることもしばしばです。。 そこで、特定のカラムについて「Excelに画像を埋め込んだ状態でエクスポートする」機能を追加したFork版を作成しました🎉 Fork版リポジトリ これを用いればURL文字列
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
TypeScriptの危険性 - Qiita
March 2025 (version 1.99)
何もわからんけど作ってみる、なんちゃってAIエージェント
初めてのPostman | フューチャー技術ブログ
AI駆動でTODOアプリを作ってみました - Qiita
ベクトルタイルなのに地図に表示できない？不動産情報ライブラリのタイルをWeb地図で表示できるようにしました
Why Is This Site Built With C
Strict-Transport-Security - HTTP | MDN
【CDK】サーバーレスなAPIをIACで初めて作った話 - Qiita
Go言語で学ぶWebアプリケーション開発1：[React + Vite + Go]
【DeepSeekの使い方】プロンプトを活用して、メルマガ原稿の叩き台を生成する方法 - このは屋
AdonisJS(アドニスJS)についてアウトプット ～概要～ - Qiita
Reactとバックエンドで作る！実践Web開発入門 | 第10章: 総括と次のステップ - Qiita
リバースプロキシとフォワードプロキシの違いについて - Qiita
Vercel から Lambda 呼び出し時の CORS エラーで一生ハマった話 - Qiita
AWS S3 + APIGateway + Lambda でンプルなアプリケーションを作成 - Qiita
【完全保存版】NebulaによるAI自律型ペネトレーションテスト<span class=
In Localhost We Trust: Exploring Vulnerabilities in Cortex.cpp, Jan’s AI Engine | Snyk
GASからのCROSエラーの解決方法 - Paper's Program Note
ghostbsd で laravel ＋VScodeの環境を整える。
kintone × AWS Lambda 連携を学んできたのでまとめてみた【devCamp】 - Qiita
【イルシルの使い方】セミナー等で使うデザインスライドを生成する方法 - このは屋
(25卒)新入社員がデータベースを開発してみた【個人開発】 - Qiita
OpenHands Headless Modeの実装を読む - sometimes I laugh
#60 AI音声入力への誘い。Superwhisperで業務は3倍速くなるのか - 耳で学ぶAI、ロボシンク
GASでWebアプリ実現するときにGET通信でハマったこと - Qiita
#16 子持ちと子なしは結局分かり合えないのか？ - となりの芝生はソーブルー
【Tableau】画像埋め込み対応版 Export All のご紹介 - Qiita