認証とSupabase統合を含むセキュアなWebhook APIを学ぶ
上級
これはEngineering, Miscellaneous, Multimodal AI分野の自動化ワークフローで、27個のノードを含みます。主にSet, Webhook, Supabase, RespondToWebhookなどのノードを使用。 認証とSupabase統合付きの安全なWebhook APIを学ぶ
前提条件
- •HTTP Webhookエンドポイント（n8nが自動生成）
- •Supabase URL と API Key
ワークフロープレビュー
ノード接続関係を可視化、ズームとパンをサポート
ワークフローをエクスポート
以下のJSON設定をn8nにインポートして、このワークフローを使用できます
{
"meta": {
"instanceId": "67d4d33d8b0ad4e5e12f051d8ad92fc35893d7f48d7f801bc6da4f39967b3592",
"templateCredsSetupCompleted": true
},
"nodes": [
{
"id": "5029ae4f-cddf-4ea3-887b-24dfe0bd4526",
"name": "Webhook",
"type": "n8n-nodes-base.webhook",
"position": [
-80,
-240
],
"webhookId": "07aaa04d-6c73-416f-82e2-1e6ededeacc4",
"parameters": {
"path": "07aaa04d-6c73-416f-82e2-1e6ededeacc4",
"options": {},
"responseMode": "responseNode"
},
"typeVersion": 2.1
},
{
"id": "9722f40e-5f71-4e2f-b774-30abaf2cd12b",
"name": "Webhook1",
"type": "n8n-nodes-base.webhook",
"position": [
-80,
64
],
"webhookId": "07aaa04d-6c73-416f-82e2-1e6ededeacc4",
"parameters": {
"path": "07aaa04d-6c73-416f-82e2-1e6ededeacc4",
"options": {},
"httpMethod": "POST",
"responseMode": "responseNode"
},
"typeVersion": 2.1
},
{
"id": "61ab48f4-cbc4-4fe6-b999-5c8179c2f199",
"name": "Webhook2",
"type": "n8n-nodes-base.webhook",
"position": [
-80,
1200
],
"webhookId": "07aaa04d-6c73-416f-82e2-1e6ededeacc4",
"parameters": {
"path": "07aaa04d-6c73-416f-82e2-1e6ededeacc4",
"options": {},
"httpMethod": "PUT"
},
"typeVersion": 2.1
},
{
"id": "52473972-d31a-4d2d-b7bd-4021b218dbf1",
"name": "Webhook3",
"type": "n8n-nodes-base.webhook",
"position": [
-80,
352
],
"webhookId": "07aaa04d-6c73-416f-82e2-1e6ededeacc4",
"parameters": {
"path": "07aaa04d-6c73-416f-82e2-1e6ededeacc4",
"options": {
"ipWhitelist": "",
"allowedOrigins": "*"
},
"httpMethod": "PATCH",
"responseMode": "streaming"
},
"typeVersion": 2.1
},
{
"id": "977d58d2-21f2-456e-8c32-188f4058d8e5",
"name": "Webhook4",
"type": "n8n-nodes-base.webhook",
"position": [
-80,
640
],
"webhookId": "07aaa04d-6c73-416f-82e2-1e6ededeacc4",
"parameters": {
"path": "07aaa04d-6c73-416f-82e2-1e6ededeacc4",
"options": {},
"httpMethod": "DELETE"
},
"typeVersion": 2.1
},
{
"id": "6cb10c72-df1e-4b00-a616-1b814d39e49f",
"name": "Webhook5",
"type": "n8n-nodes-base.webhook",
"position": [
-80,
928
],
"webhookId": "07aaa04d-6c73-416f-82e2-1e6ededeacc4",
"parameters": {
"path": "07aaa04d-6c73-416f-82e2-1e6ededeacc4",
"options": {},
"httpMethod": "HEAD"
},
"typeVersion": 2.1
},
{
"id": "39d1b185-bd11-4fba-9efb-0b839dc9fd34",
"name": "付箋",
"type": "n8n-nodes-base.stickyNote",
"position": [
-704,
-368
],
"parameters": {
"color": 4,
"width": 464,
"height": 272,
"content": "## What is a webhook (in n8n)?\nA webhook is a tiny HTTP endpoint that n8n exposes to trigger a workflow when it’s called. It can read query params, headers, and body (JSON/form/multipart), and it can send a response immediately, after the flow finishes, or via a Respond to Webhook node. Each Webhook node gives you a Test URL (editor-only) and a Production URL (requires the workflow to be active). Security is built-in: Basic, Header, or JWT auth, plus IP allow-listing and CORS options."
},
"typeVersion": 1
},
{
"id": "82826a07-84c3-415b-8253-dbb7098da016",
"name": "付箋1",
"type": "n8n-nodes-base.stickyNote",
"position": [
-144,
-368
],
"parameters": {
"color": 7,
"width": 272,
"height": 272,
"content": "## GET → \n“Retrieve data without making changes. Think queries or health checks.”"
},
"typeVersion": 1
},
{
"id": "2895700d-5086-4d05-9048-d4038cdf387f",
"name": "付箋2",
"type": "n8n-nodes-base.stickyNote",
"position": [
-144,
-64
],
"parameters": {
"color": 7,
"width": 272,
"height": 272,
"content": "## POST → \n“Send new data/events. Most webhooks from apps use POST.”"
},
"typeVersion": 1
},
{
"id": "34949301-c2dc-4c6f-9630-765bf6e8237e",
"name": "付箋3",
"type": "n8n-nodes-base.stickyNote",
"position": [
-144,
1088
],
"parameters": {
"color": 7,
"width": 256,
"height": 272,
"content": "## PUT → \n“Replace a whole resource with new data. Idempotent.”"
},
"typeVersion": 1
},
{
"id": "2876d5a1-b3e8-41dc-9619-d91fe8bac16e",
"name": "付箋4",
"type": "n8n-nodes-base.stickyNote",
"position": [
-144,
224
],
"parameters": {
"color": 7,
"width": 272,
"height": 272,
"content": "## PATCH → \n“Update part of a resource. Send only the fields that changed.”"
},
"typeVersion": 1
},
{
"id": "083b92a1-d4cd-46bb-a0b3-4db1f24dbffd",
"name": "付箋5",
"type": "n8n-nodes-base.stickyNote",
"position": [
-144,
512
],
"parameters": {
"color": 7,
"width": 272,
"height": 272,
"content": "## DELETE → \n“Remove a resource. Repeating the call has the same result.”"
},
"typeVersion": 1
},
{
"id": "ffda96a3-68fc-4388-88d5-375a39a4cea0",
"name": "付箋6",
"type": "n8n-nodes-base.stickyNote",
"position": [
-144,
800
],
"parameters": {
"color": 7,
"width": 256,
"height": 272,
"content": "## HEAD → \n“Like GET but no body — used for checks/headers only.”"
},
"typeVersion": 1
},
{
"id": "667f87de-c043-4d88-a9a3-4ee70e3abfd2",
"name": "付箋7",
"type": "n8n-nodes-base.stickyNote",
"position": [
-704,
-80
],
"parameters": {
"color": 4,
"width": 464,
"height": 432,
"content": "## 🔐 Webhook Auth Types in n8n\n\n* **Basic Auth** → Username + password in the request.\n *Good for simple server-to-server use. Always use HTTPS.*\n\n* **Header Auth** → Require a specific header + value (e.g. `X-API-Key`).\n *Works like an API key. Easy to rotate or share.*\n\n* **JWT Auth** → Caller sends a signed JWT (`Authorization: Bearer <token>`).\n *Stronger option — tokens can expire and carry claims.*\n\n**Extra hardening (Options menu):**\n\n* **IP Whitelist** → Only allow listed IPs.\n* **Allowed Origins (CORS)** → Restrict browser requests to known domains.\n* **Ignore Bots** → Block crawlers/link previewers."
},
"typeVersion": 1
},
{
"id": "907e9243-a595-497d-a017-acfb4211d2b5",
"name": "付箋8",
"type": "n8n-nodes-base.stickyNote",
"position": [
-704,
368
],
"parameters": {
"color": 4,
"width": 464,
"height": 320,
"content": "## 📡 Webhook Response Types in n8n\n\n* **Immediately** → Returns `200 OK` right away.\n *Use when caller only needs a quick acknowledgement.*\n\n* **When Last Node Finishes** → Waits for the workflow to complete, then sends the final data back.\n *Good when the client expects the processed result.*\n\n* **Using Respond to Webhook** → Response is sent from a separate **Respond to Webhook** node.\n *Best for async flows — reply later while work continues in background.*\n"
},
"typeVersion": 1
},
{
"id": "d11d5a46-2b3e-4e49-beb5-4923f828492a",
"name": "行の取得",
"type": "n8n-nodes-base.supabase",
"position": [
240,
-240
],
"parameters": {
"filters": {
"conditions": [
{
"keyName": "email",
"keyValue": "={{ $json.query.email }}"
}
]
},
"tableId": "demo_contacts",
"operation": "get"
},
"credentials": {
"supabaseApi": {
"id": "PNDtoaSn7rFuj8zX",
"name": "Supabase Nocodecreative.io"
}
},
"typeVersion": 1
},
{
"id": "edbd8d72-79ea-4101-900e-2635b047300f",
"name": "Webhookへの応答",
"type": "n8n-nodes-base.respondToWebhook",
"position": [
512,
-240
],
"parameters": {
"options": {},
"respondWith": "allIncomingItems"
},
"typeVersion": 1.4
},
{
"id": "f8d8f340-c194-4c4e-a308-d5c95e8533b9",
"name": "行の作成",
"type": "n8n-nodes-base.supabase",
"position": [
512,
64
],
"parameters": {
"tableId": "demo_contacts",
"dataToSend": "autoMapInputData",
"inputsToIgnore": "id"
},
"credentials": {
"supabaseApi": {
"id": "PNDtoaSn7rFuj8zX",
"name": "Supabase Nocodecreative.io"
}
},
"typeVersion": 1
},
{
"id": "5999b69a-5b9f-4f55-9bf3-f579dfe869a1",
"name": "フィールド編集",
"type": "n8n-nodes-base.set",
"position": [
240,
64
],
"parameters": {
"mode": "raw",
"options": {},
"jsonOutput": "={{ $json.body }}"
},
"typeVersion": 3.4
},
{
"id": "c04fc7eb-e43a-48bd-a979-ed423b52b9f3",
"name": "フィールド編集1",
"type": "n8n-nodes-base.set",
"position": [
240,
352
],
"parameters": {
"mode": "raw",
"options": {},
"jsonOutput": "={{ $json.body }}"
},
"typeVersion": 3.4
},
{
"id": "7ec4b8ac-5b1a-4b31-9759-f8b7ed070178",
"name": "Webhook1への応答",
"type": "n8n-nodes-base.respondToWebhook",
"position": [
752,
64
],
"parameters": {
"options": {},
"respondWith": "allIncomingItems"
},
"typeVersion": 1.4
},
{
"id": "0d50f8f4-df4d-448f-9c05-8e2043e8a8d2",
"name": "Webhook2への応答",
"type": "n8n-nodes-base.respondToWebhook",
"position": [
752,
352
],
"parameters": {
"options": {},
"respondWith": "allIncomingItems"
},
"typeVersion": 1.4
},
{
"id": "481f146d-0d14-4b40-beeb-3f56c548d9cc",
"name": "行の更新",
"type": "n8n-nodes-base.supabase",
"position": [
512,
352
],
"parameters": {
"filters": {
"conditions": [
{
"keyName": "id",
"keyValue": "={{ $json.id }}",
"condition": "eq"
}
]
},
"tableId": "demo_contacts",
"operation": "update",
"dataToSend": "autoMapInputData"
},
"credentials": {
"supabaseApi": {
"id": "PNDtoaSn7rFuj8zX",
"name": "Supabase Nocodecreative.io"
}
},
"typeVersion": 1
},
{
"id": "ae559e34-c048-4ab7-82d6-5e5f34d0f5d5",
"name": "行の削除",
"type": "n8n-nodes-base.supabase",
"position": [
240,
640
],
"parameters": {
"filters": {
"conditions": [
{
"keyName": "id",
"keyValue": "={{ $json.query.id }}",
"condition": "eq"
}
]
},
"tableId": "demo_contacts",
"operation": "delete"
},
"credentials": {
"supabaseApi": {
"id": "PNDtoaSn7rFuj8zX",
"name": "Supabase Nocodecreative.io"
}
},
"typeVersion": 1
},
{
"id": "fb7f6c4a-05f9-4096-96f8-035f8bc20a8d",
"name": "付箋10",
"type": "n8n-nodes-base.stickyNote",
"position": [
1248,
-32
],
"parameters": {
"color": 6,
"width": 848,
"height": 171,
"content": "# n8n Webhooks: A Beginner’s Guide (with Security Built-In)\nBuilt by [Wayne Simpson](https://www.linkedin.com/in/simpsonwayne/) at [nocodecreative.io](https://nocodecreative.io)\n☕ If you find this useful, feel free to [buy me a coffee](https://ko-fi.com/waynesimpson)"
},
"typeVersion": 1
},
{
"id": "647b73a3-b157-40ef-b12d-8fe7b69d630c",
"name": "付箋11",
"type": "n8n-nodes-base.stickyNote",
"position": [
1040,
176
],
"parameters": {
"color": 7,
"width": 667,
"height": 497,
"content": "# Watch the Video 📺\n### Watch the Video 👇\n[](https://www.youtube.com/watch?v=o6F36xsiuBk)\n\n\n"
},
"typeVersion": 1
},
{
"id": "99ecd5f5-6df0-430a-a863-56af8417ea72",
"name": "付箋12",
"type": "n8n-nodes-base.stickyNote",
"position": [
1744,
176
],
"parameters": {
"color": 7,
"width": 600,
"height": 500,
"content": "## Read to blog post to get started 📝\n**Follow along to to get up and running**\n\n[](https://blog.nocodecreative.io/n8n-webhooks-a-beginners-guide-with-security-built-in/)\n"
},
"typeVersion": 1
}
],
"pinData": {},
"connections": {
"5029ae4f-cddf-4ea3-887b-24dfe0bd4526": {
"main": [
[
{
"node": "d11d5a46-2b3e-4e49-beb5-4923f828492a",
"type": "main",
"index": 0
}
]
]
},
"9722f40e-5f71-4e2f-b774-30abaf2cd12b": {
"main": [
[
{
"node": "5999b69a-5b9f-4f55-9bf3-f579dfe869a1",
"type": "main",
"index": 0
}
]
]
},
"52473972-d31a-4d2d-b7bd-4021b218dbf1": {
"main": [
[
{
"node": "c04fc7eb-e43a-48bd-a979-ed423b52b9f3",
"type": "main",
"index": 0
}
]
]
},
"977d58d2-21f2-456e-8c32-188f4058d8e5": {
"main": [
[
{
"node": "ae559e34-c048-4ab7-82d6-5e5f34d0f5d5",
"type": "main",
"index": 0
}
]
]
},
"d11d5a46-2b3e-4e49-beb5-4923f828492a": {
"main": [
[
{
"node": "edbd8d72-79ea-4101-900e-2635b047300f",
"type": "main",
"index": 0
}
]
]
},
"5999b69a-5b9f-4f55-9bf3-f579dfe869a1": {
"main": [
[
{
"node": "f8d8f340-c194-4c4e-a308-d5c95e8533b9",
"type": "main",
"index": 0
}
]
]
},
"f8d8f340-c194-4c4e-a308-d5c95e8533b9": {
"main": [
[
{
"node": "7ec4b8ac-5b1a-4b31-9759-f8b7ed070178",
"type": "main",
"index": 0
}
]
]
},
"c04fc7eb-e43a-48bd-a979-ed423b52b9f3": {
"main": [
[
{
"node": "481f146d-0d14-4b40-beeb-3f56c548d9cc",
"type": "main",
"index": 0
}
]
]
},
"481f146d-0d14-4b40-beeb-3f56c548d9cc": {
"main": [
[
{
"node": "0d50f8f4-df4d-448f-9c05-8e2043e8a8d2",
"type": "main",
"index": 0
}
]
]
}
}
}よくある質問
このワークフローの使い方は？
上記のJSON設定コードをコピーし、n8nインスタンスで新しいワークフローを作成して「JSONからインポート」を選択、設定を貼り付けて認証情報を必要に応じて変更してください。
このワークフローはどんな場面に適していますか？
上級 - エンジニアリング, その他, マルチモーダルAI
有料ですか？
このワークフローは完全無料です。ただし、ワークフローで使用するサードパーティサービス（OpenAI APIなど）は別途料金が発生する場合があります。
関連ワークフロー
チャットボットWebhook
AIを活用したGmailとカレンダーアシスタントで、Geminiチャットインターフェースと統合
Set
Webhook
Gmail Tool
+
Set
Webhook
Gmail Tool
19 ノードPraneel S
その他
競合他社コンテンツギャップ分析ツール：構題マッピングの自動化
Gemini AI、Apify、Google Sheetsを使用して競合企業のコンテンツギャップを分析
If
Set
Code
+
If
Set
Code
30 ノードMychel Garzon
その他
Groq AIとGhostGeniusを使ってLinkedInプロフィールと求人情報を比較
Groq AI と GhostGenius を使って LinkedIn プロフィールと職位説明のマッチ度を比較する
If
Set
Code
+
If
Set
Code
17 ノードStephan Koning
その他
完全予約システム
Google Calendar、勤務時間、REST API を使った完全な予約システム
If
Set
Code
+
If
Set
Code
41 ノードSean Lon
その他
Google SheetsのREST APIの使用
Google Sheetsデータベースを使用してCRUD REST APIを作成
Set
Webhook
Google Sheets
+
Set
Webhook
Google Sheets
17 ノードViktor Klepikovskyi
エンジニアリング
Unli.dev を使ってシステムプロンプトを生成する
Unli.dev を使って LLM のための AI システムプロンプトを生成
Set
Webhook
Http Request
+
Set
Webhook
Http Request
7 ノードKhairul Muhtadin
エンジニアリング
ワークフロー情報
難易度
上級
ノード数27
カテゴリー3
ノードタイプ5
作成者
Wayne Simpson
@nocodecreativeI’m Wayne, an AI, automation & low-code consultant, passionate about helping businesses unlock their potential through smart, practical solutions. Contact me at https://www.nocodecreative.io
外部リンク
n8n.ioで表示 →
このワークフローを共有