Why am I getting error for apple-touch-icon-precomposed.png
Asked Answered
D

12

286

I have created a new rails3 project but I am seeing following logs many times in my server logs. Why I am getting these request and how can I avoid these?

Started GET "/apple-touch-icon-precomposed.png" for 192.168.6.2 at 2012-09-18 20:03:53 +0530

ActionController::RoutingError (No route matches [GET] "/apple-touch-icon-precomposed.png"):

I haven't given this link anywhere and don't want to render this image anywhere. I am clueless why this resource is being tried to be loaded.

Disqualify answered 18/9, 2012 at 15:46 Comment(1)
i'm getting the same exact thing in my .net project. has nothing to do with ruby. what i don't understand is why this isn't a standard 404 not found error. but it ain't. just a routing error. i get: The controller for path '/apple-touch-icon-precomposed.png' was not found or does not implement IController.Jolin
A
261

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)

Adjourn answered 2/10, 2012 at 2:4 Comment(3)
I found a nice article that details everything I wanted to know (and more): mathiasbynens.be/notes/touch-iconsOleander
With root directory you mean the app/public directory or public directory?Rossiter
I believe the above author means the configured web document-root directory, e.g. in Apache 2.4 it usually /var/www/htdocsAnalogy
V
88

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:

  1. apple-touch-icon-57x57-precomposed.png
  2. apple-touch-icon-57x57.png
  3. apple-touch-icon-precomposed.png
  4. apple-touch-icon.png

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.

Vellum answered 15/8, 2013 at 15:30 Comment(4)
Even with this definition, I still get 404s for apple-touch-icon-precomposed.pngShavonda
It's now recommended that the default icon size be 152 × 152 pixels in order to accommodate for newer iPads.Corinnecorinth
I still get the same error, as well as an additional routing error for custom_icon.png. By the way, I get these errors running rails in development on OSX 10.10.2 using Safari 8.0.3 as the browser.Foretopgallant
what is the difference between precomposed and non-precomposed ?Cadel
V
12

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.

Vollmer answered 26/12, 2016 at 23:55 Comment(0)
G
6

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.

Goforth answered 22/9, 2016 at 16:28 Comment(0)
P
6

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.

Parlor answered 11/3, 2017 at 15:5 Comment(1)
Worked fine here.Annelid
V
5

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).

Viens answered 19/12, 2012 at 19:0 Comment(0)
E
4

There’s a gem like quiet_assets that will silence these errors in your logs if, like me, you didn’t want to have to add these files to your Rails app:

https://github.com/davidcelis/quiet_safari

Epiphenomenalism answered 20/2, 2015 at 22:25 Comment(1)
This is the best solution...nothing but frustrations and enormous log files if you do not inhibit logging. The sizes requested change when Apple decides...keeping us chasing with more versions of the same darn favicon.Omsk
E
2

An alternative solution is to simply add a route to your routes.rb

It basically catches the Apple request and renders a 404 back to the client. This way your log files aren't cluttered.

# routes.rb at the near-end
match '/:png', via: :get, controller: 'application', action: 'apple_touch_not_found', png: /apple-touch-icon.*\.png/

then add a method 'apple_touch_not_found' to your application_controller.rb

# application_controller.rb
def apple_touch_not_found
  render  plain: 'apple-touch icons not found', status: 404
end
Etan answered 7/3, 2017 at 13:31 Comment(0)
Y
0

Same thing is happening for me. And yes, as @Joao Leme said, it seems it is related to a user bookmarking a site to their device homescreen.

However, I noticed that even though there is an error in the log, it's happening behind the scenes and the user never sees the error. I assume the device makes a request for the touch-icon specific to its resolution (which isn't there) until defaulting to the general apple-touch-icon or apple-touch-icon-precomposed, if present, or else generates a small screenshot of the current page.

FWIW, put the icons in the /public directory.

Yellowlegs answered 18/12, 2012 at 16:37 Comment(1)
Adding the images doesn't address the issue. Requests are being made for assets which don't exist. Each time this request happens, the server responds and a log entry is written. That is not efficient.Maghutte
C
0

Hi only example easy in nginx is.

Nginx config ExpReg:

    location ~* /apple-touch-(icon-57x57-precomposed|icon-57x57|icon-precomposed|icon).png$ {
        log_not_found off;
        access_log off;
}
Corenecoreopsis answered 9/4, 2023 at 23:28 Comment(0)
F
-1

Simply create zero-sized files called the appropriate names.

The request will be satisfied with no additional data transfer nor further logging lines.

Flavorsome answered 13/4, 2017 at 11:7 Comment(1)
Very old answer, but serving a zero-size file is not recommended at all because the Web Clip (link that users may create on their home screen) will appear a squared box with no content. Although I don't like the complicate anti-patterns created by Apple, it would be better piling up errors in a log file than offering a shxt experience to the users if any.Octosyllable
D
-4

Try to change link from

/apple-touch-icon-precomposed.png 

to:

<%=asset_path "apple-touch-icon-precomposed.png" %>
Dagan answered 18/9, 2012 at 15:54 Comment(7)
I haven't given this link anywhere and don't want to render this image anywhere. I am clueless why this resource is being tried to be loaded.Disqualify
Try to find apple-touch-icon-precomposed in you project directory. I think this link included into layout template, but i not are shure.Dagan
Having same problem and couldn't find "apple-touch-icon-precomposed" anywhere in my project.Adjourn
This is a standard image requested by iOS; it's not related to any links in a person's project files.Trujillo
This image is also requested by my droid razr, so I'm not sure it's native only to iOS devices.Maghutte
Why can't Apple just settle for favicon.ico like everyone else?Sadonia
Android devices opens a manifest.json file with icons.. Who is this; "Everyone else" person?Calloway

© 2022 - 2024 — McMap. All rights reserved.