Similar to the Favicon, the Apple touch icon or apple-touch-icon. png is a file used for a web page icon on the Apple iPhone, iPod Touch, and iPad. When someone bookmarks your web page or adds your web page to their home screen, this icon is used.
You can specify what icon your app should use by including a <link rel="apple-touch-icon" href="/example. png"> tag in the <head> of your page. If your page doesn't have this link tag, iOS generates an icon by taking a screenshot of the page content.
This icon is used when someone adds your web page as a bookmark. For multiple icons with different device resolutions like iPhone or iPad, add sizes attribute to each link element as follows − <link rel = "apple-touch-icon" href = "touch-icon-iphone.png">
I guess apple devices make those requests if the device owner adds the site to it. This is the equivalent of the favicon. To resolve, add 2 100×100 png files, save it as apple-touch-icon-precomposed.png and apple-touch-icon.png and upload it to the root directory of the server. After that, the error should be gone.
I noticed lots of requests for apple-touch-icon-precomposed.png and apple-touch-icon.png in the logs that tried to load the images from the root directory of the site. I first thought it was a misconfiguration of the mobile theme and plugin, but found out later that Apple devices make those requests if the device owner adds the site to it.
Source: Why Webmasters Should Analyze Their 404 Error Log (Mar 2012; by Martin Brinkmann)
If a user from Safari Web browser (Apple devices) visit your site. The browser tries to fetch the site icon if it is not defined in <head>
in the following order:
To resolve this issue either define an icon for safari web browsers or apple devices. Add something like this to head section of your site:
<link rel="apple-touch-icon" href="/custom_icon.png"/>
If you want to keep <head>
clean then upload the icon to root dir of your site with proper name.
The default icon size is 57px.
You can find more details on iOS developer library.
If you ended here googling, this is a simple configuration to prevent this error full the web server logs:
Apache virtualhost
Redirect 404 /apple-touch-icon-precomposed.png
<Location /apple-touch-icon-precomposed.png>
ErrorDocument 404 "apple-touch-icon-precomposed does not exist"
</Location>
Nginx server block:
location =/apple-touch-icon-precomposed.png {
log_not_found off;
access_log off;
}
PS: Is possible you want to add apple-touch-icon.png
and favicon.ico
too.
Note that this can happen even when the user has NOT bookmarked the site to their iOS home screen - for example, any time you open a page using Chrome for iOS, it does a GET "/apple-touch-icon-precomposed.png"
.
I've handled this and other non-HTML 404 requests in my ApplicationController as follows:
respond_to do |format|
format.html { render :template => "error_404", :layout => "errors", :status => 404 }
format.all { render :nothing => true, :status => 404 }
end
The format.all
response takes care of images such as this PNG file (which does not exist for my site).
I finally solved!! It's a Web Clip feature on Mac Devices. If a user want to add your website in Dock o Desktop it requests this icon.
You may want users to be able to add your web application
or webpage link to the Home screen. These links, represented
by an icon, are called Web Clips. Follow these simple steps
to specify an icon to represent your web application or webpage
on iOS.
more info: https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html
how to solve?: Add a icon to solve problem.
If you don't care about the icon looking pretty on all sort of Apple devices, just add
get '/:apple_touch_icon' => redirect('/icon.png'), constraints: { apple_touch_icon: /apple-touch-icon(-\d+x\d+)?(-precomposed)?\.png/ }
to your config/routes.rb
file and some icon.png
to your public
directory. Redirecting to 404.html
instead of icon.png
works too.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With