Ajax requests not working the same on different browsers

Question

I have coded my simple web app game using Codeigniter.

Ninja Gold

Here is where I am confused. I am using Ajax requests to be able to go to my different routes to return the different amounts of gold from the location buttons. I wanted to be able to have continuous music in the background...hence this method.

The problem is I am getting this error on Chrome.

XMLHttpRequest cannot load http://www.travterrell.com/ninjagold/Ninjas/cave. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://travterrell.com' is therefore not allowed access.

When I originally found this error, I had looked up this problem and found that I needed to insert this code into the index file of travterrell.com since the Ninja Gold game is a subindex on my personal website

<?php header('Access-Control-Allow-Origin: *'); ?>

I was also instructed to modify my .htaccess file to this:

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /ninjagold

    #Removes access to the system folder by users.
    #Additionally this will allow you to create a System.php controller,
    #previously this would not have been possible.
    #'system' can be replaced if you have renamed your system folder.
    RewriteCond %{REQUEST_URI} ^system.*
    RewriteRule ^(.*)$ /index.php?/$1 [L]

    #When your application folder isn't in the system folder
    #This snippet prevents user access to the application folder
    #Submitted by: Fabdrol
    #Rename 'application' to your applications folder name.
    RewriteCond %{REQUEST_URI} ^application.*
    RewriteRule ^(.*)$ /index.php?/$1 [L]

    #Checks to see if the user is attempting to access a valid file,
    #such as an image or css document, if this isn't true it sends the
    #request to index.php
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule ^(.*)$ index.php?/$1 [L]
</IfModule>

<IfModule !mod_rewrite.c>
    # If we don't have mod_rewrite installed, all 404's
    # can be sent to index.php, and everything works as normal.
    # Submitted by: ElliotHaughin

    ErrorDocument 404 /index.php
</IfModule>

Specifically line 3 where I re-wrote the base. At first this fixed the problem but now I notice the game doesn't work on Chrome and sometimes works on Safari on the desktop. It works on Safari mobile but the sound effects when you click the buttons to receive or lose gold doesn't work. Chrome doesn't work on mobile. Any ideas what the problem is?

Answer 1

Not quite sure why you'd put the CORS in the PHP to be honost. Put it in the .htaccess file, like in this answer. Also check this answer (same question as previous, for helpful insights).

Quote from answer:

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>

Below the 2 .htaccess files I use in my own Zend Framework 2 projects. The first one, in the application root, is pretty much for if/when I forget to setup the Apache vhost properly. It redirects everything to the public folders' index.php file.

The second file is the ZF2 default .htaccess. Works like a charm. From when I tried out CodeIgniter 2 (few years ago), I used the same files.

Obviously you should rewrite the base in the first file to your /ninjagold location. However, if your application has a /public folder as the point of entry, rewrite it to /ninjagold/public.

root (/) .htaccess

RewriteEngine On

# If URL to the application is http://foo.com/path/to/ZendSkeletonApplication/
# the set the base to /path/to/ZendSkeletonApplication/
RewriteBase /

# Remove trailing slash
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)/$ /$1 [L,R=301]

# Below is ZF2 default
RewriteRule ^\.htaccess$ - [F]
RewriteCond %{REQUEST_URI} =""
RewriteRule ^.*$ public/index.php [NC,L]

RewriteCond %{REQUEST_URI} !^/public/.*$
RewriteRule ^(.*)$ public/$1

RewriteCond %{REQUEST_FILENAME} -f
RewriteRule ^.*$ - [NC,L]

RewriteRule ^public/.*$ public/index.php [NC,L]

/public/.htaccess

RewriteEngine On

# Remove trailing slash
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)/$ /$1 [L,R=301]

# The following rule tells Apache that if the requested filename
# exists, simply serve it.
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
# The following rewrites all other queries to index.php. The 
# condition ensures that if you are using Apache aliases to do
# mass virtual hosting, the base path will be prepended to 
# allow proper resolution of the index.php file; it will work
# in non-aliased environments as well, providing a safe, one-size 
# fits all solution.
RewriteCond %{REQUEST_URI}::$1 ^(/.+)(.+)::\2$
RewriteRule ^(.*) - [E=BASE:%1]
RewriteRule ^(.*)$ %{ENV:BASE}index.php [NC,L]