How to enable the "Access-Control-Allow-Origin" header for all files in the XAMPP directory?

Question

I am developing an HTML5 Javascript application to get an image from my local server, which runs on the same computer as the application. When I run the application in my Chrome, I got:

Access to the image in ' http: //localhost/someDIrectory/1.jpg ' from the source ' http: // localhost: 50000 ' is blocked by the CORS policy: No The header header Access-Control-Allow-Origin is present in the requested resource. Origin ' http: // localhost: 50000 ' so access is not allowed.

Of the many questions here, the answers indicate what I need to install

("Access-Control-Allow-Origin: *");

in a php file, and it should work, but this is for php files ... How about an image or image directory?

I also came across How do I enable Cross-origin resource sharing on XAMPP? and tried to add

<IfModule C:\xampp\htdocs\someDIrectory\1.jpg>
    Header set Access-Control-Allow-Origin: *
</IfModule>

in httpd.conf. I tried restarting XAMPP and repeated the above. But the result that I got is still the same.

How to configure such a parameter for XAMPP?

Note. I use Construct 2, which is mainly exported as HTML5 / Javascript. I just use the Sprite Load From URL action.

Answer 1

Create a file called ".htaccess" in the directory of your files and add the following to the file.

Header set Access-Control-Allow-Origin "http://localhost:50000/"