Loading Product Options Gets Stuck in the AMP Iframe

Loading Product Options Gets Stuck. Browser Displays Error: “Domain.com redirected you too many times.”

The message “Loading Product Options” is displayed on Magento 2 AMP pages, the loader gets stuck spinning and never loads.

Please see the screenshot below:

Amp-loading-options.png

Another way to debug this issue is by opening the Iframe source in a new window. The browser will display the following error message: “This page isn’t working. Domain.com redirected you too many times. Try clearing your cookies. ERR_TOO_MANY_REDIRECTS.”

Page-not-working.png

Issue Description

The issue happens when website redirects are configured in your web server affecting the ampiframe.php file. In most cases, the 301/302 rewrite rule redirecting non-www to the www version of the website will cause the AMP Iframe to fail to load.

Solution 1 (Recommended)

Step 1

Disable the 301/302 redirects in your webserver affecting the ampiframe.php file

Disable Apache Web Server Redirects

If you are using an Apache web server, find and edit your httpd.conf and .htaccess files:

vi /path/to/magento2/.htaccess
vi /path/to/magento2/pub/.htaccess
vi /etc/httpd/conf/httpd.conf

Remove or comment redirects similar to these:

httpd.conf or .htaccess
RewriteCond %{HTTP_HOST} !^www\. [NC]
RewriteRule ^(.*)$ http://www.%{HTTP_HOST}/$1 [R=301,L]

RewriteCond %{HTTP_HOST} ^www\.(.*)$ [NC]
RewriteRule ^(.*)$ http://%1/$1 [R=301,L]

Disable Nginx Web Server Redirects

If you are using a Nginx web server, find and edit your virtual host file:

vi /etc/nginx/sites-available/<domain.com>.conf

Remove or comment similar rewrite rules:

 server {
 listen 80;
 server_name domain.com;
 return 301 http://www.domain.com$request_uri;
 }

Step 2

Then enable the Auto-redirect to Base URL in your Magento backend:

Go to Configuration > Web > Auto-redirect to Base URL and make sure that you have a 302 (or 301) redirect enabled in Magento settings. This setting prevents duplicate content issues in Google.

Auto-redirect.png

Step 3

Now go back to your browser and refresh the AMP product page. The AMP Iframe should be displayed correctly.

Solution 2

Another way to solve webserver redirect issues for AMP Iframe is to exclude ampiframe.php from 301/302 redirects.

Exclude ampiframe.php From Apache Web Server Redirects

If you are using an Apache web server, find and edit your httpd.conf and .htaccess files:

vi /path/to/magento2/.htaccess
vi /path/to/magento2/pub/.htaccess
vi /etc/httpd/conf/httpd.conf

Add ONE of the following changes to your Apache redirects:

Option 1:

Add line “RewriteCond %{REQUEST_URI} !^/ampiframe.php” as shown below:

RewriteEngine on
RewriteCond %{REQUEST_URI} !^/ampiframe.php
RewriteRule (.*) https://www.domain.com/$1 [R=301,L]


Option 2:

Add the following line at the top of your rewrite rules before any other calls :

RewriteRule ^(ampiframe.php) - [L]


Option 3:

Replace your existing redirect rule with the following:

RedirectMatch 301 ^/((?!ampiframe.php).*)$ https://www.domain.com/$1
  • domain.com – is your Magento store domain name

Exclude ampiframe.php From Nginx Web Server Redirects

If you are using a Nginx web server, find and edit your virtual host file:

vi /etc/nginx/sites-available/<domain.com>.conf

Add location block “location /ampiframe.php” as shown below:

server {
 
 listen 80;
 server_name www.domain.com domain.com;
 
 location / {
 # redirect to https version of the domain
 return 301 https://www.domain.com$request_uri;
 }
 
 location /ampiframe.php {
 # Do nothing. Nginx will exclude the amp-iframe file from redirect
 root /path/to/webroot;
 }
 
}

Was this article helpful?