# Why you might need this

Instagram (respectively Facebook) is becoming more and more a walled
garden (opens new window)
and over the last few
years, they cut down every API which could be used by a Third-Party like us to
build cool stuff like this plugin you added to your CraftCMS
website to show your posts. They still offer an API, but getting access to this
requires you to enrole in the Facebook Developer program, create an "app" and
then submit this app for review before they grant you some credentials to use with
the API (that also have a quite short validity period so you need to have a mechanism on your server that updates your credentials). From what we know, this is quite a long process and not always
quaranteed to succeed. And especially for just showing your Instagram posts on
your website, this is a disproportionate amount of work. Therefore we decided
to use the only "API" they can't shut down: The website itself! By scraping the
webpage we are able to get the 12 most recent images of an public account
which is for the purpose of showing them as a widget on a website more than
enough.

# The problem

The problem with this approach is, that Instagram can easily distinguish between
traffic from a real person and traffic from a plugin like ours by looking at the
source IP address where the request came from. "Valid" traffic from a real
person would never come from a datacenter and rather from an domestic ISP. So
sometimes (we haven't figured out by which metric this happens) when they detect
that the request comes from a datacenter, they redirect you to the login page
instead of showing you the page you requested as a challenge to prove that you
are human. And because our plugin doesn't has credentials for Instagram, it can't
login and therefore stops working as soon as this happens. If this has happend
to you can easily be verified by checking these two attributes:

  • You find the following error message from our plugin in your logfiles:
Instagram tag data could not be fetched. It seems that your IP address has been blocked by Instagram.
  • The site only stopped working on your production (or staging) server and runs perfectly fine when you start your local development environment

When these two things are true (or sometimes only one of them), the IP of your
server has pretty surely been blocked. Continue with the next chapter to tell or
plugin to use the proxy server we offer, which will redirect every request from
your site to Instagram through our proxy to hide your blocked IP address.

# Getting access to our proxy

Because a lot of people using our plugin got affected by this, we started to host a proxy for them, so they can
continue using our plugin. Because running this is a bit of work, and gets harder with every additional user, we don't
make the proxy completly public and only provide access if you drop us a mail at
support@codemonauts.com and you will get a key to authenticate at our proxy
completly free of charge without any restrictions.

This way, all requests from our plugin go through our proxy and Instagram can't block your IP address anymore.

# Installation

First make sure you are running the latest version of our
plugin (check packagist.org (opens new window)). Then create the file instagramfeed.php in the toplevel config/ folder of your
craft installation. Your project folder should look something like this:

Now open the new file and enter the following
content:

    <?php
        return [
            // Replace with your personal key
            'proxyKey' => 'ABCDEF0123456',
            'useProxy' => true,
            'timeout' => 10,
        ];

If you have created the file in the correct location and the file has the
correct content you should see a green success message when you visit
/admin/settings/plugins/instagramfeed in the admin backend of your page just
like in this screenshot:

When you now go to your website, you should see your latest posts 😃

Note for Multi-Server setups:
Please reade the section about Local Storage in
the README, because you must to specify a volume where the images should get
stored, or it won't work!

# Help, it's not working!

After giving over 250 people access to this proxy and
helping them configure this plugin accordingly, we have encountered a few common
pitfalls which we will describe here. So if something is not working as
expected, check this section to see if your problem is already mentioned.

# No images for a new account

If you request an account for the first time (Proxy freshly configured or account name has changed), the first request
will always result in an empty response, because our proxy will create a job to scrape this account and depending on the
length of the queue, this can take a few minutes to a few hours until you see the first set of images. Afterwargs this
won't happen again and you will always get a valid response containing images.

# Page stopped working

If, after creating the config file, your page stopped working and you see a big
PHP stacktrace with lots of error messages, the chances are high that you have a
little syntax error in the config file. Check the content of the file again and
make sure that you placed all braces and commas correctly, have the PHP tag in
line one and the return gets properly closed with ]; at the end.
Easiest way to get it right is to copy the content of the example config (opens new window) from the repository and paste them into your file.

# No green message in the backend

If the page works fine, but you see no green message in the backend, you either

  • have a typo in the config file (check the words useProxy and proxyKey)
  • put the config file in the wrong location. Make sure it is in you toplevel config folder next to e.g. your general.php
  • have a problem with file permissions and your PHP process is not able to read the file. Compare the permissions with your general.php and just apply the same permissions and ownership

# No images or still broken images

If you see the green message but still don't get any new images or no images at
all, it could be that our plugin still has the last response cached. The plugin
will only make a new attempt to update the images every few hours (regardless of
whether the last request was successfull or produced an error). To force a
refresh you can go to /admin/utilities/clear-caches and clear the data
cache: When you now reload your site, the plugin
will try to update the images because it doesn't have a cached response anymore.
Another thing to check is if your key is correct or if you maybe made an error
by copy/pasting it to the config file. Without a valid key, our proxy wont
answer you.

# Still not working?

Write us via support@codemonauts.com and we
will debug this together 😃 To make the debugging easier, please provide as much
information as possible. For example:

  • CraftCMS version
  • PHP version
  • The Instagram username or hashtag you are trying to fetch
  • Check your storage/log/web.log for any error that could be related (probably something with guzzle)
  • Errors only in specific environments (e.g. prod) or everywhere?
  • Special characteristics of your setup (Loadbalancer, HighAvailability, Static Caching/Blitz, ...)
Last Updated: 1/27/2023, 1:54:09 PM