{"id":813,"date":"2014-03-22T16:19:15","date_gmt":"2014-03-22T16:19:15","guid":{"rendered":"http:\/\/local.sandjam.co.uk\/?p=813"},"modified":"2014-03-22T16:19:41","modified_gmt":"2014-03-22T16:19:41","slug":"secret-tip-retrieve-twitter-profile-images-without-using-the-api","status":"publish","type":"post","link":"https:\/\/sandjam.co.uk\/sandjam\/2014\/03\/secret-tip-retrieve-twitter-profile-images-without-using-the-api\/","title":{"rendered":"Secret tip: retrieve Twitter profile images without using the api"},"content":{"rendered":"<p>A common problem when creating <a href=\"http:\/\/tweetedtrips.com\/\">sites which use the Twitter API<\/a> is how to store and display user profile images.<\/p>\n<p>When you query the API the resulting user data gives you the URL of the user profile image. However this image URL is not a permalink. If the user changes their profile image the image URL will change.<\/p>\n<p>Twitter also seem to periodically change the image URLS, presumably as part of their content distribution network.<\/p>\n<h2>Cache the images<\/h2>\n<p>One solution is to save a copy of the image to the site locally and use it as a cache. This will ensure that the images never go missing, but if your site serves a lot of Twitter users then you could end up having to cache thousands of images which could be expensive.<\/p>\n<p>It also means that if the user decides to update their image on Twitter your cached version will be out of date.<\/p>\n<h2>Twitter API<\/h2>\n<p>The <a href=\"https:\/\/dev.twitter.com\/\">Twitter API documentation<\/a> leads you to believe that the only solution to this problem is either caching the images locally, as I described, or sending a new authenticated query each time you need to see the image.<\/p>\n<p>This would be way too slow and quickly eat up your <a href=\"https:\/\/dev.twitter.com\/docs\/rate-limiting\/1.1\">API query allowance<\/a>.<\/p>\n<h2>The secret profile image url<\/h2>\n<p>There is another way which isn&#8217;t well publicised but is really useful.<\/p>\n<p>Once you have the user&#8217;s Twitter ID or screenname, you can use the following URL format:<\/p>\n<p>https:\/\/twitter.com\/api\/users\/profile_image?id=337098150<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone\" alt=\"\" src=\"https:\/\/twitter.com\/api\/users\/profile_image?id=337098150\" width=\"48\" height=\"48\" \/><\/p>\n<p>This will redirect to the live thumbnail for that user<\/p>\n<p>If you&#8217;d rather use the screenname, the URL is<\/p>\n<p>https:\/\/twitter.com\/api\/users\/profile_image\/tweetedtrips<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone\" alt=\"\" src=\"https:\/\/twitter.com\/api\/users\/profile_image\/tweetedtrips\" width=\"48\" height=\"48\" \/><\/p>\n<p>Don&#8217;t forget that a user may change their screenname, so it is less reliable as a permalink that the ID. Of course if a user deletes their account altogether you&#8217;re still going to get a missing image.<\/p>\n<h2>Nice, now make it bigger<\/h2>\n<p>This returns the 48px x 48px size of the profile image, if you&#8217;d rather use the larger 73px x 73px version then add ?size-bigger to the end of the URL:<\/p>\n<p>https:\/\/twitter.com\/api\/users\/profile_image\/tweetedtrips?size=bigger<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone\" alt=\"\" src=\"https:\/\/twitter.com\/api\/users\/profile_image\/tweetedtrips?size=bigger\" width=\"73\" height=\"73\" \/><\/p>\n<p>or<\/p>\n<p>https:\/\/twitter.com\/api\/users\/profile_image?id=337098150&#038;size=bigger<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone\" alt=\"\" src=\"https:\/\/twitter.com\/api\/users\/profile_image?id=337098150&amp;size=bigger\" width=\"73\" height=\"73\" \/><\/p>\n<p>The only downside to this method is that due to the redirection that must take place the images may take slightly longer to load.<\/p>\n<p>Also, because this is an undocumented feature there is the risk that Twitter may change or remove this functionality at any time. But those who have used the Twitter API in the past should be quite used to this unpredictable behaviour!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>A common problem when creating sites which use the Twitter API is how to store and display user profile images. When you query the API the resulting user data gives you the URL of the user profile image. However this image URL is not a permalink. If the user changes their profile image the image [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":814,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[90],"tags":[23,36,37,52],"class_list":["post-813","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-twitter","tag-social-networking","tag-tips","tag-tricks","tag-twitter"],"acf":[],"_links":{"self":[{"href":"https:\/\/sandjam.co.uk\/sandjam\/wp-json\/wp\/v2\/posts\/813","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sandjam.co.uk\/sandjam\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sandjam.co.uk\/sandjam\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sandjam.co.uk\/sandjam\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/sandjam.co.uk\/sandjam\/wp-json\/wp\/v2\/comments?post=813"}],"version-history":[{"count":2,"href":"https:\/\/sandjam.co.uk\/sandjam\/wp-json\/wp\/v2\/posts\/813\/revisions"}],"predecessor-version":[{"id":816,"href":"https:\/\/sandjam.co.uk\/sandjam\/wp-json\/wp\/v2\/posts\/813\/revisions\/816"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/sandjam.co.uk\/sandjam\/wp-json\/wp\/v2\/media\/814"}],"wp:attachment":[{"href":"https:\/\/sandjam.co.uk\/sandjam\/wp-json\/wp\/v2\/media?parent=813"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sandjam.co.uk\/sandjam\/wp-json\/wp\/v2\/categories?post=813"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sandjam.co.uk\/sandjam\/wp-json\/wp\/v2\/tags?post=813"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}