Cara menggunakan KESALAHAN dalam JavaScript

Panduan ini membantu Anda mengidentifikasi dan memecahkan masalah JavaScript yang mungkin memblokir halaman Anda, atau konten tertentu di halaman yang mengaktifkan JavaScript, agar tidak muncul di Google Penelusuran. Meskipun Google menjalankan JavaScript, ada beberapa perbedaan dan batasan yang perlu diperhatikan saat mendesain laman dan aplikasi Anda untuk mengakomodasi cara perayap mengakses dan merender konten Anda. Panduan dasar SEO JavaScript kami memberikan informasi lengkap tentang cara mengoptimalkan situs JavaScript untuk Google Penelusuran

Googlebot dirancang untuk menjadi fitur web yang bagus. Crawling menjadi prioritas utama, sekaligus memastikan tidak mempersulit pengguna yang mengunjungi situs. Googlebot dan komponen Layanan Rendering Web (WRS) terus menganalisis dan mengidentifikasi sumber daya yang tidak berkontribusi pada konten laman penting, dan mungkin tidak mengambil sumber daya tersebut. Misalnya, permintaan pelaporan dan kesalahan yang tidak berkontribusi pada konten halaman penting, dan jenis permintaan serupa lainnya tidak digunakan atau tidak diperlukan untuk mengekstrak konten halaman penting. Analisis sisi klien mungkin tidak memberikan gambaran yang lengkap atau akurat tentang aktivitas Googlebot dan WRS di situs Anda. Gunakan Search Console untuk memantau aktivitas Googlebot dan WRS dan masukan di situs Anda

Jika Anda menduga bahwa masalah JavaScript mungkin memblokir halaman Anda, atau konten tertentu di halaman yang mengaktifkan JavaScript, agar tidak muncul di Google Penelusuran, ikuti langkah-langkah berikut. Jika Anda tidak yakin apakah JavaScript adalah penyebab utamanya, ikuti panduan proses debug umum kami untuk menentukan masalah spesifik

1. Untuk menguji cara Google merayapi dan merender URL, gunakan Pengujian Situs Ramah Seluler atau Alat Inspeksi URL di Search Console. Anda dapat melihat sumber daya yang dimuat, output dan pengecualian konsol JavaScript, DOM yang dirender, dan informasi lainnya. Pengingat. Jangan gunakan tautan yang di-cache untuk men-debug halaman Anda. Sebagai gantinya, gunakan Alat Inspeksi URL karena memiliki versi terbaru halaman Anda

   Selain itu, kami juga menyarankan untuk mengumpulkan dan mengaudit kesalahan JavaScript yang ditemukan oleh pengguna, termasuk Googlebot, di situs Anda untuk mengidentifikasi potensi masalah yang dapat memengaruhi perenderan konten

   Berikut adalah contoh yang menunjukkan cara mencatat kesalahan JavaScript yang dicatat di penangan onerror global. Ingatlah bahwa beberapa jenis kesalahan JavaScript, seperti kesalahan penguraian, tidak dapat direkam menggunakan metode ini

   window.addEventListener('error', function(e) {
       var errorText = [
           e.message,
           'URL: ' + e.filename,
           'Line: ' + e.lineno + ', Column: ' + e.colno,
           'Stack: ' + (e.error && e.error.stack || '(no stack trace)')
       ].join('\n');
   
       // Example: log errors as visual output into the host page.
       // Note: you probably don't want to show such errors to users, or
       //       have the errors get indexed by Googlebot; however, it may
       //       be a useful feature while actively debugging the page.
       var DOM_ID = 'rendering-debug-pre';
       if (!document.getElementById(DOM_ID)) {
           var log = document.createElement('pre');
           log.id = DOM_ID;
           log.style.whiteSpace = 'pre-wrap';
           log.textContent = errorText;
           if (!document.body) document.body = document.createElement('body');
           document.body.insertBefore(log, document.body.firstChild);
       } else {
           document.getElementById(DOM_ID).textContent += '\n\n' + errorText;
       }
   
       // Example: log the error to remote service.
       // Note: you can log errors to a remote service, to understand
       //       and monitor the types of errors encountered by regular users,
       //       Googlebot, and other crawlers.
       var client = new XMLHttpRequest();
       client.open('POST', 'https://example.com/logError');
       client.setRequestHeader('Content-Type', 'text/plain;charset=UTF-8');
       client.send(errorText);
   
   });

2. Pastikan untuk mencegah. Dalam aplikasi web satu halaman (SPA), ini bisa sangat sulit. Agar halaman error tidak terindeks, Anda bisa menggunakan salah satu atau kedua strategi berikut ini
   • Pengalihan ke URL yang servernya merespons dengan kode status 404.

     fetch(`https://api.kitten.club/cats/${id}`)
      .then(res => res.json())
      .then((cat) => {
        if (!cat.exists) {
          // redirect to page that gives a 404
          window.location.href = '/not-found';
        }
      });

     _
   • Tambahkan atau ubah tag meta robot menjadi noindex.

     fetch(`https://api.kitten.club/cats/${id}`)
      .then(res => res.json())
      .then((cat) => {
        if (!cat.exists) {
          const metaRobots = document.createElement('meta');
          metaRobots.name = 'robots';
          metaRobots.content = 'noindex';
          document.head.appendChild(metaRobots);
        }
      });

   Jika SPA menggunakan JavaScript sisi klien untuk menangani kesalahan, seringkali yang dilaporkan adalah kode status HTTP 200, bukan. Ini dapat menyebabkan halaman kesalahan diindeks dan dapat ditampilkan di hasil pencarian

3. Googlebot akan menolak
   Fitur yang memerlukan izin pengguna adalah hal yang mudah bagi Googlebot, atau untuk semua pengguna. Misalnya, jika Anda memerlukan Camera API, Googlebot tidak dapat menyediakan kamera untuk Anda. Alih-alih, sediakan cara bagi pengguna untuk mengakses konten Anda tanpa dipaksa untuk mengizinkan akses kamera
4. Jangan gunakan URL fragmen untuk memuat konten yang berbeda
   SPA dapat menggunakan fragmen URL (misalnya https. // contoh. com/#/products) untuk memuat tampilan yang berbeda. Skema perayapan AJAX sudah tidak digunakan lagi sejak 2015, jadi Anda tidak dapat mengandalkan fragmen URL untuk bekerja dengan Googlebot. Disarankan untuk menggunakan History API_ untuk memuat konten yang berbeda berdasarkan URL di SPA
5. Jangan mengandalkan persistensi data untuk menyajikan konten
   WRS memuat setiap URL (lihat Cara Kerja Google Penelusuran untuk ikhtisar singkat tentang cara Google menemukan konten), mengikuti pengalihan server dan klien, seperti browser biasa. Namun, WRS tidak mempertahankan status di seluruh pemuatan halaman
   • Data Penyimpanan Lokal dan Penyimpanan Sesi dihapus pada setiap pemuatan halaman
   • Cookie HTTP dihapus di seluruh pemuatan halaman
6. Gunakan sidik jari konten untuk mencegah masalah caching dengan Googlebot
   Googlebot menyimpan cache secara terus-menerus untuk mengurangi permintaan jaringan dan penggunaan sumber daya. WRS dapat mengabaikan header cache. Hal ini dapat menyebabkan WRS menggunakan resource JavaScript atau CSS yang tidak berlaku lagi. Sidik jari konten mencegah masalah ini dengan membuat sidik jari dari bagian konten nama file, seperti main.2bb85551.js. Sidik jari bergantung pada konten file, sehingga pembaruan akan menghasilkan nama file yang berbeda setiap saat. Lihatlah untuk mempelajari lebih lanjut
7. Pastikan aplikasi Anda menggunakan deteksi fitur untuk semua API penting yang dibutuhkannya dan memberikan perilaku override atau polyfill jika berlaku
   Fitur web tertentu mungkin tidak digunakan oleh semua agen pengguna dan beberapa agen pengguna mungkin sengaja menonaktifkan fitur tertentu. Misalnya, jika Anda menggunakan WebGL untuk merender efek foto di browser, deteksi fitur menunjukkan bahwa Googlebot tidak mendukung WebGL. Untuk mengatasinya, Anda dapat melewatkan efek foto atau memutuskan untuk menggunakan rendering sisi server untuk melakukan pra-render efek foto, sehingga konten Anda dapat diakses oleh siapa saja, termasuk Googlebot
8. Pastikan konten Anda berfungsi dengan koneksi HTTP
   Googlebot menggunakan permintaan HTTP untuk mengambil konten dari server Anda. Metode ini tidak mendukung jenis koneksi lain, seperti

   fetch(`https://api.kitten.club/cats/${id}`)
    .then(res => res.json())
    .then((cat) => {
      if (!cat.exists) {
        // redirect to page that gives a 404
        window.location.href = '/not-found';
      }
    });

   0 atau

   fetch(`https://api.kitten.club/cats/${id}`)
    .then(res => res.json())
    .then((cat) => {
      if (!cat.exists) {
        // redirect to page that gives a 404
        window.location.href = '/not-found';
      }
    });

   1. Agar tidak ada masalah dengan koneksi, pastikan Anda menyediakan pengganti HTTP untuk mengambil konten dan menggunakan penanganan error yang andal
9. Pastikan komponen web Anda merender seperti yang diharapkan. Gunakan Pengujian Situs Ramah Seluler atau Alat Inspeksi URL untuk mengetahui apakah HTML yang dirender memiliki semua konten yang Anda harapkan
   perataan WRS. Jika komponen web yang Anda gunakan tidak mendukung konten DOM ringan, lihat dokumentasi komponen web untuk informasi selengkapnya atau gunakan komponen web lain sebagai gantinya. Untuk informasi lebih lanjut, lihat
10. Setelah Anda melakukan semua langkah dalam daftar periksa ini, uji ulang laman Anda menggunakan Pengujian Situs Ramah Seluler atau Alat Inspeksi URL di Search Console

    Jika masalah telah diperbaiki, tanda centang hijau akan muncul dan tidak ada kesalahan yang ditampilkan. Jika Anda masih melihat kesalahan, posting di

    Pesan error di Javascript biasanya ditampilkan di mana?

    Saat menu Developer Tools muncul, kita akan melihat banyak tab yang disediakan untuk keperluan debugging, namun untuk saat ini silahkan klik tab Console. Pada tab console ini message error JavaScript dapat dilihat.

    Apa fungsi alert() di Javascript?

    Fungsi alert() adalah fungsi untuk menampilkan jendela dialog . Fungsi sebenarnya ada di objek jendela. Ini dapat sepenuhnya ditulis seperti ini. jendela. alert("Halo Dunia. ");

    Bagaimana cara memanggil fungsi dalam Javascript?

    Cara Memanggil/Menjalankan Fungsi . Nama fungsi(); Contoh. // buat fungsi function sayHello(){ console. log("Halo Dunia. "); } // panggil fungsi sayHello() // kemudian akan menghasilkan -> Hello World.

    Apa itu innerHTML dalam Javascript?

    innerHTML adalah properti yang digunakan untuk mendapatkan atau mengubah konten elemen itu sendiri . Dengan innerHTML, kita dapat menampilkan keluaran ke elemen yang lebih spesifik dengan menggunakan metode dokumen. getElementById(id).