Bagaimana cara memaksa penyegaran favicon?

Saya memiliki aplikasi Grails yang berjalan secara lokal menggunakan kucing jantannya sendiri dan saya baru saja mengubah favicon untuk yang baru. Masalahnya adalah saya tidak bisa melihatnya di browser apa pun. Favicon lama muncul atau saya tidak mendapatkan favicon sama sekali, tetapi tidak yang baru. Saya tidak berpikir ini adalah masalah Grails per se, lebih merupakan masalah dengan favicons.

Apa yang seharusnya terjadi dengan favicons? Bagaimana mereka seharusnya bekerja? Saya memiliki banyak bookmark di browser saya yang memiliki ikon yang salah dan sepertinya tidak pernah disegarkan. Bagaimana cara saya memaksa server / browser untuk menghentikan caching mereka? Tampaknya konyol untuk selalu men-cache mereka mengingat mereka biasanya hanya 16x16. Mengapa tidak mengunggahnya dengan setiap kunjungan ke halaman? Ini bukan overhead yang besar.

Untuk menyegarkan favicon situs Anda, Anda dapat memaksa browser untuk mengunduh versi baru menggunakan tag tautan dan querystring pada nama file Anda. Ini sangat membantu dalam lingkungan produksi untuk memastikan pengguna Anda mendapatkan pembaruan.

<link rel="icon" href="http://www.yoursite.com/favicon.ico?v=2" />

Ok, setelah 10 menit mencoba, cara mudah untuk memperbaikinya dekat dengan garis burung

1. Ketik www.yoursite.com/favicon.ico (atau www.yoursite.com/apple-touch-icon.png, dll.)
2. Dorong enter
3. ctrl+f5
4. Mulai Ulang Browser (IE, Firefox)

Jawaban ini belum diberikan jadi saya pikir saya akan mempostingnya. Saya mencari di seluruh web, dan tidak menemukan jawaban yang baik untuk menguji favicons dalam pengembangan lokal.

Dalam versi chrome saat ini (pada OSX) jika Anda melakukan yang berikut ini, Anda akan mendapatkan refresh favicon instan:

1. Arahkan kursor ke tab
2. Klik kanan
3. Pilih memuat ulang
4. Favicon Anda sekarang harus di-refresh

Ini adalah cara termudah yang saya temukan untuk menyegarkan favicon secara lokal.

Ganti nama file favicon dan tambahkan header html dengan nama baru, seperti:

<link rel="SHORTCUT ICON" href="http://www.yoursite.com/favicon2.ico" />

Jika Anda menggunakan PHP, Anda juga bisa menggunakan MD5-Hash dari favicon sebagai string-query:

<link rel="shortcut icon" href="favicon.ico?v=<?php echo md5_file('favicon.ico') ?>" />

Dengan cara ini Favicon akan selalu menyegarkan saat telah diubah.

Seperti yang ditunjukkan dalam komentar, Anda juga dapat menggunakan tanggal modifikasi terakhir alih-alih MD5-Hash untuk mencapai hal yang sama dan menyimpan sedikit kinerja server:

<link rel="shortcut icon" href="favicon.ico?v=<?php echo filemtime('favicon.ico') ?>" />

Dengan menghancurkan file yang digunakan browser Anda untuk menyimpan favicon lama, Anda dapat memaksa yang baru untuk dimuat.

1. Tutup browser Anda. Pastikan tidak ada lagi proses browser yang berjalan (mis. Periksa Task Manager untukchrome.exe ataufirefox.exe ).
2. Navigasikan ke tempat browser Anda menyimpan file pengguna:
   • Untuk Chrome, buka direktori data Chrome .
   • Untuk Firefox, buka folder profil Firefox .
3. Hapus cache favicon.
   • Untuk Chrome, hapus Favicons danFavicons-journal
   • Untuk Firefox, hapus favicons.sqlite

Ini hampir pasti akan berhasil. Jika tidak:

• Kemungkinan 1: Pembaruan untuk browser Anda telah mengubah cara kerja cache favicon. Harap edit jawaban ini dengan instruksi baru.
• Kemungkinan 2: Masalah favicon Anda tidak ada hubungannya dengan caching yang terlalu agresif. Ini mungkin bukan masalah pemuatan sumber daya - menggunakan Alat Pengembang, pastikan favicon baru mengunduh dengan benar.

Di Chrome di Mac OS X seseorang dapat menghapus file dengan favicon cache

${user.home}/Library/Application Support/Google/Chrome/Default/Favicons 

Nah, overhead adalah overhead, tapi ya, tidak terlalu besar.

Juga, browser terkadang "rakus" tentang file yang di-cache. Anda dapat menghapus cache dan / atau me-restart browser Anda dan mungkin melihat perubahannya. Jika itu gagal ...

Solusi murahan saya adalah:

1. Kunjungi file Anda di http://example.com/favicon.ico di browser Anda.
2. Hapus favicon.ico dari webroot Anda.
3. Kunjungi http://example.com/favicon.ico lagi di peramban, pastikan tidak ada.
4. Unggah yang baru ke akar web Anda.
5. Kunjungi http://example.com/favicon.ico lagi di peramban, verifikasi yang baru.

Jika urutan itu tidak berhasil, maka sesuatu yang lain sedang terjadi.

Tergantung pada browser mereka ditangani secara berbeda, tetapi biasanya saya menemukan bahwa pergi ke halaman default situs, dan melakukan penyegaran keras. CTRL+ F5, biasanya akan memperbaruinya.

ON MAC: ⌘+ Shift- Ratau tahan Ctrldan klik tombol muat ulang di browser.

Untuk Internet Explorer, ada solusi lain:

1. Buka penjelajah internet.
2. Klik menu> alat> opsi internet.
3. Klik umum> file internet sementara> tombol "pengaturan".
4. Klik tombol "lihat file".
5. Temukan file favicon.ico lama Anda dan hapus.
6. Mulai ulang browser (penjelajah internet).

Kemungkinan besar masalah browser web. Anda harus menghapus cache dari browser Anda, tutup browser Anda dan buka kembali. Itu harus memperbaikinya.

Saya tidak yakin favicons Anda akan di-refresh pada favorit Anda sampai Anda mengunjungi kembali halaman itu, dan dengan asumsi bahwa Anda sebelumnya telah membersihkan cache browser Anda.

Browser web Anda tidak akan pergi ke internet untuk memeriksa favicon baru sendiri ... terima kasih Tuhan.

Coba Buka di Tab Baru

Saya mencoba banyak hal di atas (mengatur ulang cache, menyegarkan, menggunakan tag tautan, dll), saya bahkan memeriksa .htaccessfile saya dan mereset variabel ExpiresByType.

Tapi inilah yang akhirnya berhasil bagi saya di Chrome (25.0.x) dan Safari (6.0.1):

1. Cushing pembilasan
2. Menghubungkan favicon dengan <link>tag dengan keras
3. Menavigasi ke mysite.com/favicon.ico
4. Membuka mysite.comdi tab baru

(Hingga langkah 3, menyegarkan di tab yang sama terus mereproduksi ikon lama.)

Untuk Chrome di macOS, jika Anda tidak ingin menghapus seluruh basis data Chrome favicon seperti yang disarankan di sini, Anda hanya dapat menghapus ikon yang bertentangan:

1. Keluar dari Chrome
2. Muat basis data favicons (menggunakan sqlite di sini):

sqlite3 ~/Library/Application\ Support/Google/Chrome/Default/Favicons

3. Cari file yang menyebabkan masalah

select * from favicons where url = 'http://mysite.dev/favicon.ico';

4. Jika Anda senang dengan hasilnya:

delete from favicons where url = 'http://mysite.dev/favicon.ico';

Atau , Anda dapat mencari pola yang dapat Anda gunakan kembali untuk menghapus banyak entri:

3. Cari beberapa file yang menyebabkan masalah

select * from favicons where url like 'http://mysite.dev%';

4. Dan lagi jika Anda senang dengan hasil ini:

delete from favicons where url like 'http://mysite.dev%';

5. Ketik .exitdan tekan kembali untuk keluar dari sqlite
6. Mulai ulang Chrome

Saat Anda meminta favicon dari Google, Anda dapat melihat tajuk respons.

Last-Modified: Fri, 09 Jan 2009 16:35:02 GMT
Date: Thu, 01 Dec 2010 00:00:01 GMT
Expires: Fri, 01 Dec 2011 00:00:01 GMT
Cache-Control: public, max-age=31536000
Age: 7

Jika Anda menempatkan tajuk "Kedaluwarsa:" pada respons, browser klien akan meminta kembali ikon setelah cap waktu itu. Saat melakukan pengembangan aktif, Anda dapat mengatur cap waktu kedaluwarsa menjadi satu atau dua detik di masa mendatang, dan selalu mengambilnya, meskipun itu adalah rencana jangka panjang yang buruk.

Versi Chrome: 68.0.3440.106

Mulai ulang Chrome (di bilah alamat Anda): chrome://restart

Dukungan favicon Chrome bermasalah - abaikan jawaban ini

Saya menulis jawaban ini dengan kesan bahwa inilah yang diperlukan untuk menyegarkan favicon di Google Chrome. Namun, ternyata ini hanya berfungsi selama lima menit pertama atau lebih, hingga ikon hilang dalam sinkronisasi riwayat Chrome .

Jawaban asli

Anda tidak perlu menghapus cache, memulai kembali browser Anda, atau menulis ulang HTML - Anda hanya perlu mengubah URL ikon, satu kali , sehingga browser akan melupakan ikon yang sebelumnya di-cache.

Dengan asumsi bahwa Anda telah menetapkan ikon Anda melalui <link>elemen-elemen di halaman <head>Anda, Anda dapat melakukannya dengan menjalankan standar-JS satu-liner di konsol:

[].slice.call(document.querySelectorAll('head>link[rel$="icon"]')).map(function(ln){ln.href+='?v=2'});

Untuk implementasi yang lebih maju dari ini yang dapat secara otomatis melakukan ini untuk pengguna akhir dalam produksi, lihat freshicon.js .

Saya baru-baru ini memulihkan bookmark saya dan sedang mencari cara untuk mengembalikan FavIcons tanpa mengunjungi setiap halaman. Pencarian saya membawa saya ke utas ini.

Bagi mereka yang berada dalam keadaan yang serupa, cukup unduh addon FAVICON RELOADER. Setelah terinstal, Anda akan menemukan perintah "muat ulang ikon favorit" di menu tarik-turun BOOKMARKS Anda.

https://addons.mozilla.org/en-US/firefox/addon/faviconreloader/?src=api

Jika Anda menggunakan PHP .. maka Anda juga dapat menggunakan baris ini.

<link rel="shortcut icon" href="http://www.yoursite.com/favicon.ico?v=<?php echo time() ?>" />

Ini akan menyegarkan favicon Anda di setiap pemuatan halaman.

Jika Anda hanya tertarik untuk debugging untuk memastikan itu telah berubah, Anda bisa menambahkan entri dummy ke file / etc / hosts Anda dan tekan URL baru. Favicon itu tidak akan di-cache dan Anda dapat memastikan bahwa yang baru berfungsi.

Pendek mengubah nama favicon, tidak ada cara Anda dapat memaksa pengguna Anda untuk mendapatkan salinan baru

Ini berfungsi untuk Chrome:

• di Mac: hapus file

  $ {user.home} / Perpustakaan / Dukungan Aplikasi / Google / Chrome / Default / Favicons

• di Windows: hapus file

  C: \ Pengguna [nama pengguna] \ AppData \ Lokal \ Google \ Chrome \ Data Pengguna \ Default \ Favicons C: \ Pengguna [nama pengguna] \ AppData \ Lokal \ Google \ Chrome \ Data Pengguna \ Default \ Favicons-jurnal

sumber

Ini adalah solusi untuk bug chrome: ubah atribut rel ke stylesheet! Tetap pertahankan tautan aslinya. Bekerja seperti pesona:

Saya menemukan solusi ini karena kami juga memiliki persyaratan untuk dapat memperbarui situs pelanggan / kode produksi dan saya tidak menemukan solusi lain untuk bekerja.

Saya tahu ini adalah pertanyaan yang sangat lama tetapi juga salah satu yang masih relevan, meskipun hari ini hanya berlaku untuk mozilla. (Saya tidak tahu apa yang explorer lakukan karena kami tidak membuat kode untuk browser non standar).

Chrome berperilaku baik jika ada yang menyertakan tag ikon di header.

Meskipun mozilla sangat menyadari masalah ini, seperti biasa, mereka tidak pernah memperbaiki hal-hal kecil yang mengganggu. Bahkan 6 tahun kemudian.

Jadi, ada dua cara untuk memaksa refresh ikon dengan firefox.

1. Suruh semua klien Anda menghapus firefox. Kemudian instal ulang.

2. Ketikkan hanya domain secara manual di bilah url - jangan gunakan http atau www saja domain (mydomain.com).

Tentu saja ini mengasumsikan bahwa catatan Anda menyertakan resolusi untuk nama domain saja.

Sederhana,

1: Saya tidak ingin mengutak-atik kode (ps pembangun situs saya tidak menggunakan kode, itu menggunakan tombol "unggah file" dan itu melakukannya sendiri)

2: Saya mencoba tanda CTRL+ F5dan tidak berhasil untuk saya ....

SAYA PUNYA SOLUSI:

IE: Hapus Semua riwayat browser dan cookie dengan masuk ke pengaturan cog O

Chrome: Buka menu di sudut kanan atas di bawah X yang terlihat seperti a =, lalu pergi ke pengaturan, histori, CLEAR BROWSING DATA dan centang semua kotak yang berlaku (saya membuat history, cookie, dan mengosongkan tangkapan dari awal waktu)

Ubah saja nama file ini = 'favicon1.ico'

Inilah cara saya mengelolanya dengan favicon animasi sederhana dan FireFox 3.6.13 (versi beta) Mungkin akan bekerja untuk versi FireFox lainnya juga, beri tahu saya jika tidak. Ini pada dasarnya solusi artlung, tetapi menangani file .gif juga:

1. Saya dibuka oleh program FTP, mengunduh file favicon.ico DAN favicon.gif saya,
2. kemudian HAPUS mereka dari file server saya.
3. Kemudian saya membukanya di browser saya seperti yang disarankan artlung: http://mysite.com/favicon.ico DAN http://mysite.com/favicon.gif Setelah alamat itu dimuat dan ditampilkan 404 halaman kesalahan ("halaman tidak ditemukan")
4. SAYA KEMUDIAN mengunggah kedua file kembali ke server saya, dan PRESTO - ikon yang benar langsung ditampilkan.

Pastikan juga Anda meletakkan URL gambar lengkap bukan hanya jalur relatifnya:

http://www.example.com/images/favicon.ico

Dan tidak:

images/favicon.ico

Jika masalah berlanjut meskipun menerapkan beberapa langkah di atas, coba mulai ulang Server IIS . Semoga ini membantu...

Simon, kurasa ada alasan mengapa tidak ada jawaban lain yang diterima sejauh ini. Jadi saya percaya ini bisa menjadi masalah Grails - Terutama jika Anda menggunakan 'Resources Plugin'.

Jika plugin Anda menyediakan favicon (yang - secara tidak logis - banyak dilakukan), mereka mungkin mengesampingkan yang Anda inginkan - mengingat plugin Anda ada dalam plugin itu sendiri.

Jika menghapus favicon dari semua plugin Anda untuk sementara menyelesaikan masalah maka kemungkinan besar Anda mengalami ini:

http://jira.grails.org/browse/GPRESOURCES-134

Ikuti langkah-langkah di bawah ini untuk mengubah ikon aplikasi:

1. Tambahkan file .ico Anda di proyek.
2. Buka angular.json dan dalam "proyek" -> "arsitek" -> "bangun" -> "opsi" -> "aset" dan di sini buat entri untuk file ikon Anda. Lihat entri favicon.ico yang ada untuk mengetahui cara melakukannya.
3. Buka index.html dan perbarui jalur file ikon. Sebagai contoh,

<link rel="icon" type="image/x-icon" href="abc.ico">

Atau, ganti nama file ikon Anda dengan favicon.ico dan ganti di direktori.

4. Mulai ulang server.
5. Peramban yang menyegarkan dan Anda siap melakukannya.