แยกส่วนประกอบ URLคืออะไร?

แยกส่วนประกอบ URL ออนไลน์ฟรี แยกโปรโตคอล โฮสต์ พาธ พารามิเตอร์คำค้นหา และส่วนประกอบอื่นๆ ของ URL

URL ซับซ้อนกว่าที่เห็นในแวบแรก URL หนึ่งประกอบด้วยโปรโตคอล ชื่อโฮสต์ พอร์ต เส้นทาง พารามิเตอร์คำค้น และแฟรกเมนต์ — แต่ละส่วนทำหน้าที่เฉพาะตัวแยกวิเคราะห์ URL แยก URL ใด ๆ ออกเป็นส่วนประกอบแต่ละส่วนและแสดงในรูปแบบที่มีโครงสร้าง ทำให้การตรวจสอบ แก้บั๊ก และดึงส่วนเฉพาะออกมาเป็นเรื่องง่าย

วาง URL ใด ๆ ลงในช่องป้อนแล้วตัวแยกวิเคราะห์แสดงส่วนประกอบทั้งหมดทันที: โปรโตคอล (https หรือ http) ชื่อโฮสต์ (ชื่อโดเมน) พอร์ต (ถ้าระบุ) เส้นทาง (เส้นทางหลังโดเมน) สตริงคำค้น (ทุกอย่างหลัง ?) และแฮช (ทุกอย่างหลัง # เรียกอีกอย่างว่าแฟรกเมนต์) พารามิเตอร์คำค้นแสดงเป็นตารางคีย์-ค่าแบบแก้ไขได้ ทำให้เห็นว่าพารามิเตอร์ใดถูกส่งและคัดลอกค่าแต่ละค่าได้ง่าย

การแยกย่อยแบบมีโครงสร้างมีค่ายิ่งสำหรับการพัฒนาเว็บและการแก้บั๊ก API เมื่อการเรียก API ล้มเหลว คุณสามารถวาง URL ลงในตัวแยกวิเคราะห์เพื่อตรวจสอบเส้นทางเอนด์พอยต์ ตรวจสอบการจัดรูปแบบพารามิเตอร์คำค้น และมองเห็นปัญหาการเข้ารหัส เมื่อวิเคราะห์ URL การติดตาม ตารางพารามิเตอร์คำค้นแสดงพารามิเตอร์ UTM ทั้งหมดและค่าการติดตามอื่น ๆ ในรูปแบบที่อ่านได้

แต่ละส่วนประกอบสามารถคัดลอกแยกกันได้ ซึ่งมีประโยชน์เมื่อคุณต้องการเพียงส่วนเดียวของ URL — ตัวอย่างเช่น การดึงเฉพาะชื่อโฮสต์สำหรับไฟล์การกำหนดค่า หรือคัดลอกพารามิเตอร์คำค้นสำหรับการใช้งานการเปลี่ยนเส้นทาง การแยกวิเคราะห์ใช้ตัวสร้าง URL ในตัวของเบราว์เซอร์ ทำให้การแยกย่อยเป็นไปตามมาตรฐาน

ตัวอย่างการใช้งานจริงของ แยกส่วนประกอบ URL

แก้บั๊ก URL เอนด์พอยต์ API ที่เสียหาย

การเรียก API ของคุณไปยัง "https://api.example.com/v2/users?status=active&limit=50" ล้มเหลว วางลงในตัวแยกวิเคราะห์ ชื่อโฮสต์คือ api.example.com เส้นทางคือ /v2/users และพารามิเตอร์คำค้นคือ status=active และ limit=50 สังเกตว่าเส้นทางใช้ v2 — ตรวจสอบว่า API ถูกอัปเดตเป็น v3 หรือไม่

ดึงพารามิเตอร์การติดตามจาก URL การตลาด

ลิงก์การตลาดคือ "https://shop.example.com/products?id=123&utm_source=newsletter&utm_medium=email&utm_campaign=summer_sale" วางลงในตัวแยกวิเคราะห์ ตารางพารามิเตอร์คำค้นแสดงพารามิเตอร์ UTM ทั้งหมดอย่างชัดเจน คัดลอกค่าแต่ละค่าลงในสเปรดชีตติดตามแคมเปญของคุณ

วิเคราะห์ URL ที่ใช้การกำหนดเส้นทางด้วยแฟรกเมนต์แฮช

แอปเพจเดียวใช้การกำหนดเส้นทางแบบแฮช: "https://app.example.com/#/dashboard/users/42" ตัวแยกวิเคราะห์แสดงเส้นทางเป็น / และแฮชเป็น /dashboard/users/42 ทำให้ชัดเจนว่า SPA ใช้แฮชสำหรับการกำหนดเส้นทางฝั่งไคลเอนต์ ไม่ใช่การแก้เส้นทางฝั่งเซิร์ฟเวอร์

ทำไมต้องใช้ แยกส่วนประกอบ URL?

  • Parses: protocol, hostname, port, path, query, hash
  • Query params as key-value table
  • คัดลอกany component individually
  • การแยกวิเคราะห์แบบเรียลไทม์ขณะพิมพ์

วิธีใช้ แยกส่วนประกอบ URL — ทีละขั้นตอน

1

วางa URL into ช่องป้อนข้อมูล.

2

ดูall parsed components.

3

คัดลอกany component with copy button.

4

Review query parameters as key-value pairs.

แยกส่วนประกอบ URLเหมาะกับใคร?

  • การดีบัก API
  • URL analysis
  • query parameter extraction
  • การพัฒนาเว็บ

เคล็ดลับมือโปรสำหรับ แยกส่วนประกอบ URL

  • 1ใช้ตัวแยกวิเคราะห์ URL เพื่อตรวจสอบว่าพารามิเตอร์คำค้นถูกเข้ารหัส URL อย่างถูกต้องหรือไม่ หากค่าพารามิเตอร์มี & หรือ = ควรเข้ารหัสเป็น %26 หรือ %3D เพื่อป้องกันการแยกพารามิเตอร์
  • 2ส่วนแฮช (แฟรกเมนต์) ของ URL ไม่ถูกส่งไปยังเซิร์ฟเวอร์ — จัดการโดยเบราว์เซอร์ทั้งหมด นี่คือเหตุผลที่ SPA ใช้การกำหนดเส้นทางแบบแฮช
  • 3เมื่อ URL มีหมายเลขพอร์ต (เช่น https://localhost:3000) ตัวแยกวิเคราะห์จะแสดงแยกต่างหาก พอร์ตมาตรฐานส่วนใหญ่ (80 สำหรับ HTTP, 443 สำหรับ HTTPS) ถูกตัดออกจาก URL ที่มองเห็น
  • 4ตัวสร้าง URL ที่ใช้สำหรับการแยกวิเคราะห์ปฏิบัติตามมาตรฐาน WHATWG URL ซึ่งเป็นมาตรฐานเดียวกับที่เบราว์เซอร์สมัยใหม่และ Node.js ใช้

แยกส่วนประกอบ URL — คำถามที่พบบ่อย

ส่วนประกอบของ URL คืออะไร

URL has: protocol (https://), hostname (example.com), port (:8080), path (/page), query (?key=value), and fragment (#section). Example: https://example.com:8080/path?key=value#section

พารามิเตอร์ค้นหาคืออะไร

Query parameters are key-value pairs after the ? in a URL. They are separated by &. Example: ?name=hello&age=25 has two parameters: name=hello and age=25.

Can I use these tools with sensitive/proprietary data?

Absolutely. All processing runs locally in your browser with zero server uploads. This makes these tools safe for proprietary code, internal API keys, and confidential data.

Do these tools work offline?

Yes, once the page has loaded, most developer tools continue functioning without an internet connection. This makes them ideal for air-gapped environments or travel.

What browsers are supported?

All modern browsers are supported: Chrome, Firefox, Safari, and Edge. Internet Explorer is not supported. The tools leverage modern JavaScript APIs like Web Crypto, TextEncoder, and BigInt.

พร้อมใช้ แยกส่วนประกอบ URL หรือยัง?

เครื่องมือออนไลน์ฟรี — ทำงานในเบราว์เซอร์ของคุณ ไม่ต้องสมัคร เริ่มใช้ได้เลยตอนนี้

ลองเลย

คุณอาจจะชอบ

สร้างรหัส QR

สร้างรหัส QR แบบกำหนดเองสำหรับ URL, WiFi, ข้อความ และอื่นๆ ปรับแต่งสีและขนาด ดาวน์โหลด PNG หรือ SVG

ลองตอนนี้

ตัวเข้ารหัส Base64 และ URL

เข้ารหัสและถอดรหัสสตริง Base64 และ URL รองรับ Unicode เต็มรูปแบบ รวดเร็ว ในเครื่อง และฟรี

ลองตอนนี้

ตัวจัดรูปแบบและตรวจสอบ JSON

จัดรูปแบบ ตรวจสอบ บีบอัด และทำให้ JSON สวยงาม ตรวจสอบทันทีและสถิติไฟล์

ลองตอนนี้
Free Forever · No Sign-up

182 Free Tools at Your Fingertips

All free online tools for developers, designers, students, and creators. Every tool works in your browser — no sign-up, no data collection.

Browse All Toolsแยกส่วนประกอบ URL