{"id":46973,"date":"2026-04-28T09:41:01","date_gmt":"2026-04-28T02:41:01","guid":{"rendered":"https:\/\/www.rumahweb.com\/journal\/?p=46973"},"modified":"2026-04-28T09:41:02","modified_gmt":"2026-04-28T02:41:02","slug":"file-har-adalah","status":"publish","type":"post","link":"https:\/\/www.rumahweb.com\/journal\/file-har-adalah\/","title":{"rendered":"Apa Itu File HAR? Pengertian, Fungsi dan Cara Membuatnya"},"content":{"rendered":"\n<p>File HAR adalah singkatan dari HTTP Archive, yaitu sebuah format file yang digunakan untuk menyimpan <em>session <\/em>antar web browser dan web server. Dalam artikel ini, kami akan membahas tentang apa itu file HAR hingga cara mendapatkannya.<\/p>\n\n\n\n<p>Saat mengembangkan aplikasi web, terkadang Anda akan menjumpai beberapa masalah seperti halaman web yang gagal terekspos, gagal login dan lainnya. Terdapat beberapa cara dalam menganalisa kendala aplikasi webnya selain error_log yang di generate server secara otomatis, yaitu menggunakan web browser seperti menu Inspect pada fitur console dan network.<\/p>\n\n\n\n<p>Selain dari menu Inspect, Anda juga dapat melakukan analisa melalui file bernama HAR. Lalu, apa itu file HAR dan bagaiaman melakukan pengecekannya? Simak informasi berikut ini. <\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Apa itu File HAR?<\/h2>\n\n\n\n<p>File HAR adalah dokumen digital yang berisi detail <em>cookies <\/em>dan informasi sensitif lainnya yang dibuat secara otomatis berdasarkan hasil rekaman di browser Anda. HAR file berguna ketika Anda mengalami kendala pada suatu situs web, misalnya gagal login, sehingga dapat dianalisis lebih dalam untuk menemukan penyebabnya.<\/p>\n\n\n\n<p>Dalam beberapa kasus, jika aplikasi web yang Anda buat berjalan normal tetapi pengguna lain mengalami kendala seperti gagal login atau tidak mendapatkan respons yang sesuai, Anda dapat meminta file HAR untuk dilakukan pengecekan. Ini membantu memastikan bahwa kendala tersebut terjadi pada perangkat pengguna dan bukan disebabkan oleh aplikasi web itu sendiri.<\/p>\n\n\n\n<p><strong>BACA JUGA : <a href=\"https:\/\/blog.rumahweb.com\/ekstensi-adalah\/\" target=\"_blank\" rel=\"noopener\" title=\"\">Mengenal Apa Itu Ekstensi File beserta Contohnya<\/a><\/strong><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Fungsi File HAR<\/h2>\n\n\n\n<p>Seperti yang kita ketahui, File HAR menyimpan log aktivitas jaringan dari web browser terhadap web server. HAR file mencakup data seperti konten cookie Anda dan halaman yang diunduh saat proses perekaman.<\/p>\n\n\n\n<p>Setiap orang yang memiliki akses ke file HAR dapat melihat data yang dikirimkan selama proses perekaman. Hal ini mencakup informasi pribadi atau data sensitif lainnya. Karenanya, pastikan Anda mengamankan HAR file dengan baik atau memberikannya kepada pihak yang tepat, seperti pengembang yang membutuhkannya untuk menganalisis kendala yang dialami.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Komponen penting dalam file HAR<\/h2>\n\n\n\n<p>Untuk pemula, Anda tidak perlu memahami seluruh isi file HAR. Cukup fokus pada dua bagian utama: <strong>log<\/strong> dan <strong>entries<\/strong>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-1-log\">1. <code>Log<\/code><\/h3>\n\n\n\n<p><strong>Log<\/strong> adalah bagian utama (root) dari file HAR yang berisi informasi umum.<\/p>\n\n\n\n<p>Biasanya mencakup:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Daftar entries (aktivitas network)<\/li>\n\n\n\n<li>Versi HAR<\/li>\n\n\n\n<li>Informasi browser atau tools yang membuat file<\/li>\n\n\n\n<li>Data halaman (pages)<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-2-entries\">2. <code>Entries<\/code><\/h3>\n\n\n\n<p><strong>Entries<\/strong> adalah bagian terpenting, karena berisi daftar semua aktivitas request dan response yang terjadi saat halaman dimuat.<\/p>\n\n\n\n<p>Di setiap entry, Anda bisa melihat:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Request<\/strong>: method, URL, headers, cookies, dan query<\/li>\n\n\n\n<li><strong>Response<\/strong>: status code, headers, dan content type<\/li>\n\n\n\n<li><strong>Timings<\/strong>: proses seperti DNS, connect, SSL, wait, dan receive<\/li>\n<\/ul>\n\n\n\n<p>Perlu dicatat, struktur HAR yang sering digunakan saat ini berasal dari draft lama. Artinya, ini lebih sebagai referensi struktur yang umum dipakai, bukan standar resmi yang terus diperbarui.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Cara membuat File HAR<\/h2>\n\n\n\n<p>Pada bagian ini, kami akan menjelaskan langkah-langkah untuk membuat file HAR secara tepat dari berbagai browser populer, sehingga semua data dapat direkam dengan baik untuk analisis lebih lanjut.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Browser Chrome<\/h3>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Buka Browser Chrome dan akses halaman web yang terkendala.<\/li>\n\n\n\n<li>Klik tombol &#8220;Customize and Control&#8221; yang memiliki icon titik tiga di pojok kanan atas, lalu pilih <strong>More Tools<\/strong> &gt; <strong>Developer Tools<\/strong>.<\/li>\n\n\n\n<li>Tab <strong>Network<\/strong>(1) &gt; klik tombol <strong>rekam<\/strong>(2) &gt; <strong>Export HAR<\/strong>(3).<\/li>\n<\/ol>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_chrome.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1191\" height=\"510\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_chrome.png\" alt=\"Cara membuat File HAR di Chrome\" class=\"wp-image-46975\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_chrome.png 1191w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_chrome-300x128.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_chrome-1024x438.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_chrome-768x329.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_chrome-370x158.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_chrome-270x116.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_chrome-570x244.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_chrome-740x317.png 740w\" sizes=\"auto, (max-width: 1191px) 100vw, 1191px\" \/><\/a><\/figure>\n<\/div>\n\n\n<h3 class=\"wp-block-heading\"><strong>Browser Mozilla Firefox<\/strong><\/h3>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Buka Browser Firefox dan akses halaman web yang terkendala.<\/li>\n\n\n\n<li>Clik menu &#8220;Open application menu&#8221; yang memiliki icon garis tiga di pojok kanan atas, lalu pilih <strong>More Tools<\/strong> &gt; <strong>Developer Tools<\/strong>.<\/li>\n\n\n\n<li>Tab <strong>Network<\/strong>(1) &gt; Klik kanan file log &#8220;<strong>Save All as HAR<\/strong>&#8220;(2).<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_firefox.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"458\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_firefox-1024x458.png\" alt=\"Cara membuat File HAR di Firefox\" class=\"wp-image-46979\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_firefox-1024x458.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_firefox-300x134.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_firefox-768x344.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_firefox-370x166.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_firefox-270x121.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_firefox-570x255.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_firefox-740x331.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_firefox.png 1086w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Browser Microsoft Edge<\/h3>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Buka Browser Chrome dan akses halaman web yang terkendala.<\/li>\n\n\n\n<li>Klik menu &#8220;Setting and more&#8221; yang memiliki icon garis tiga di pojok kanan atas, lalu pilih <strong>More Tools<\/strong> &gt; <strong>Developer Tools<\/strong>.<\/li>\n\n\n\n<li>Tab <strong>Network<\/strong>(1) &gt; klik tombol <strong>rekam<\/strong>(2) &gt; <strong>Export HAR<\/strong>(3).<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_edge.png\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"499\" src=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_edge-1024x499.png\" alt=\"Cara membuat File HAR di Edge\" class=\"wp-image-46984\" srcset=\"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_edge-1024x499.png 1024w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_edge-300x146.png 300w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_edge-768x375.png 768w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_edge-370x180.png 370w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_edge-270x132.png 270w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_edge-570x278.png 570w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_edge-740x361.png 740w, https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2024\/05\/tab_network_edge.png 1187w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n\n\n\n<p>Bagi Anda yang penasaran dengan isi HAR file, silahkan membukanya dari aplikasi NotePad ++ atau editor lainnya.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Tips sebelum export HAR<\/h2>\n\n\n\n<p>Agar data HAR lebih akurat, ada beberapa pengaturan penting yang sebaiknya diaktifkan sebelum merekam.<\/p>\n\n\n\n<p>Hal utama yang perlu diperhatikan:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Gunakan mode <strong>Incognito<\/strong> untuk menghindari pengaruh ekstensi atau cache lama<\/li>\n\n\n\n<li>Aktifkan <strong>Preserve\/Persist logs<\/strong> agar semua request tetap terekam<\/li>\n\n\n\n<li>Pertimbangkan <strong>Disable cache<\/strong> supaya request benar-benar terlihat (seperti kunjungan pertama)<\/li>\n<\/ul>\n\n\n\n<p>Selain itu, perhatikan checklist sederhana ini saat merekam:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Reproduce langkah yang sama persis seperti yang dilakukan user<\/li>\n\n\n\n<li>Catat waktu kejadian dan lokasi (jika relevan)<\/li>\n\n\n\n<li>Mulai rekam dari awal, sebelum klik atau aksi yang memicu error<\/li>\n<\/ul>\n\n\n\n<p>Dengan langkah ini, data HAR yang dihasilkan akan lebih bersih dan<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-cara-membaca-file-har-praktis-untuk-pemula\">Cara membaca file HAR<\/h2>\n\n\n\n<p>Saat mulai membaca file HAR, Anda tidak perlu langsung memahami semuanya. Cukup fokus pada dua hal utama: mencari error dan menemukan bagian yang paling lambat.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-1-temukan-request-yang-gagal\">1. Temukan request yang gagal<\/h3>\n\n\n\n<p>Langkah pertama adalah mencari request yang bermasalah.<\/p>\n\n\n\n<p>Perhatikan hal-hal berikut:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Status code <strong>4xx atau 5xx<\/strong> (menandakan error dari client atau server)<\/li>\n\n\n\n<li>Request yang <strong>stalled<\/strong> terlalu lama<\/li>\n\n\n\n<li>Response yang kosong atau tidak sesuai<\/li>\n<\/ul>\n\n\n\n<p>Pada aplikasi web modern, masalah sering muncul di endpoint API, bukan di halaman HTML utama.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-2-temukan-resource-paling-lambat\">2. Temukan resource paling lambat<\/h3>\n\n\n\n<p>Langkah berikutnya adalah mencari bagian yang paling memakan waktu.<\/p>\n\n\n\n<p>Cara praktisnya:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Urutkan request berdasarkan <strong>durasi<\/strong><\/li>\n\n\n\n<li>Perhatikan resource dengan waktu loading paling lama<\/li>\n<\/ul>\n\n\n\n<p>Lalu analisis kemungkinan penyebabnya:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Waktu DNS lookup yang tinggi untuk domain tertentu<\/li>\n\n\n\n<li>Ukuran file terlalu besar (misalnya gambar atau video)<\/li>\n\n\n\n<li>Script dari pihak ketiga yang lambat<\/li>\n<\/ul>\n\n\n\n<p>Dengan pendekatan ini, Anda bisa langsung fokus ke bagian yang benar-benar bermasalah tanpa harus membaca seluruh data HAR dari awal.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">FAQ<\/h2>\n\n\n\n<p>Berikut adalah beberapa pertanyaan popular tentang apa itu file HAR.<\/p>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\" style=\"font-style:normal;font-weight:700\"><summary>Apakah file HAR aman dibagikan ?<\/summary>\n<div style=\"height:5px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p style=\"font-style:normal;font-weight:400\">Aman jika Anda sudah menyensor data sensitif. Google Admin Toolbox menekankan HAR bisa memuat cookies dan data yang Anda submit, dan menyediakan redaction untuk menghapus data sensitif.<\/p>\n<\/details>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\" style=\"font-style:normal;font-weight:700\"><summary>Bedanya HAR dengan server log?<\/summary>\n<div style=\"height:5px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p style=\"font-style:normal;font-weight:400\">HAR merekam perspektif browser (client-side): urutan request, timing, dan response yang diterima user. Server log merekam perspektif server: request yang sampai ke server dan apa yang diproses.<\/p>\n<\/details>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\" style=\"font-style:normal;font-weight:700\"><summary>Kenapa harus disable cache ?<\/summary>\n<div style=\"height:5px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p style=\"font-style:normal;font-weight:400\">Karena cache dapat menyembunyikan request yang sebenarnya terjadi pada first visit. Chrome DevTools menjelaskan disable cache lebih akurat untuk meniru first-time user experience.<\/p>\n<\/details>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<script type=\"application\/ld+json\">\n{\n  \"@context\": \"https:\/\/schema.org\",\n  \"@type\": \"FAQPage\",\n  \"mainEntity\": [\n    {\n      \"@type\": \"Question\",\n      \"name\": \"Apa itu file HAR?\",\n      \"acceptedAnswer\": {\n        \"@type\": \"Answer\",\n        \"text\": \"File HAR (HTTP Archive) adalah file log berbentuk JSON yang merekam aktivitas jaringan antara browser dan server saat sebuah halaman web diakses, termasuk request\/response dan timing.\"\n      }\n    },\n    {\n      \"@type\": \"Question\",\n      \"name\": \"Bagaimana cara membuat file HAR di Chrome?\",\n      \"acceptedAnswer\": {\n        \"@type\": \"Answer\",\n        \"text\": \"Buka DevTools, masuk tab Network, aktifkan Preserve log, (opsional) centang Disable cache, reproduksi masalah, lalu simpan ekspor sebagai HAR (misalnya Save all as HAR with content).\"\n      }\n    },\n    {\n      \"@type\": \"Question\",\n      \"name\": \"Kenapa file HAR harus disensor sebelum dibagikan?\",\n      \"acceptedAnswer\": {\n        \"@type\": \"Answer\",\n        \"text\": \"Karena HAR bisa berisi data sensitif seperti cookies, token autentikasi, konten halaman, dan data yang Anda submit. Gunakan redaction atau hapus bagian sensitif sebelum mengirim ke pihak lain.\"\n      }\n    }\n  ]\n}\n<\/script>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-kesimpulan\">Penutup<\/h2>\n\n\n\n<p>File HAR adalah cara paling praktis untuk mendapatkan \u201crekaman\u201d aktivitas <em>network <\/em>saat website dibuka. Dengan HAR, Anda bisa berhenti menebak dan mulai menganalisis: request mana yang gagal, resource mana yang lambat, dan pola <em>bottleneck <\/em>di <em>waterfall<\/em>.<\/p>\n\n\n\n<p>Namun perlu diingat, file HAR bisa memuat data sensitif. Selalu lakukan redaksi sebelum dibagikan kepada orang lain. <\/p>\n","protected":false},"excerpt":{"rendered":"<p>File HAR adalah singkatan dari HTTP Archive, yaitu sebuah format file yang digunakan untuk menyimpan session antar web browser dan web server. Dalam artikel ini, kami akan membahas tentang apa itu file HAR hingga cara mendapatkannya. Saat mengembangkan aplikasi web, terkadang Anda akan menjumpai beberapa masalah seperti halaman web yang gagal terekspos, gagal login dan [&hellip;]<\/p>\n","protected":false},"author":338,"featured_media":47088,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[59,2215,2216],"class_list":{"0":"post-46973","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-artikel-tutorial","8":"tag-browser","9":"tag-file-har","10":"tag-har-file"},"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/46973","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/users\/338"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/comments?post=46973"}],"version-history":[{"count":0,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/46973\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media\/47088"}],"wp:attachment":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media?parent=46973"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/categories?post=46973"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/tags?post=46973"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}