How to disable CORS on Chrome when using visual studio code and using AMF on Apache Royale

Question

As now my interest goes using Remote Object with Apache Royale to communicate with my server with Amfphp, I struggle with CORS.

My first attempt to use SimpleRemoteObject was an error like this :

Access to XMLHttpRequest at '*http://url_to_your_server/gateway.php*' from origin 'null' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

As I'm launching my application from local, and using AMF to communicate with my server then CORS block request because the requester origin is localhost and not my server domain.

After some google'ling, I find a solution : launch Chrome with some specifics args. Here is my launch.json file :

{
    "configurations": [



        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome",
            "url": "${workspaceFolder}/bin/js-debug/index.html",
            "runtimeArgs": [
                "--disable-web-security"
             ],
            "webRoot": "${workspaceFolder}",
            "preLaunchTask": "build"
        }





    ]
}

What do you think of this solution ? Are there other solutions ?

Regards

[updated] Warning : since last version of chrome (march 2020) --disable-web-security doesn't works correctly : PHPSESSID doesn't work anymore because of forbiden cookie save

score 1 · Answer 1 · answered Apr 22 '20 at 17:41

Another way to avoid this issue without needing to disable Chrome's web-security is to run a local nginx web server pointing towards your app while simultaneously allowing it to proxy to your back end.

Here is a gutted version of my nginx configuration to give you the basic idea:

http {
    server {
        listen 80;

        location / {
            root /path_to_your/bin/js-debug;

            try_files $uri $uri/ @backend;
        }

        location @backend {
            proxy_pass http://url_to_your_server:80;
        }
    }
}

The key to making this work is try_files. It will first try the path you attempt, then try the subsequent paths if the resource can't be found at the first, second, etc.

Example:

Accessing http://localhost/ in the browser will first load the index.html file which will load the Royale app. As your app makes requests to the AMF gateway, e.g. http://localhost/amf, it will try each of the paths set with try_files. It won't find /amf at $uri or $uri/, but will find it at @backend.

This is effectively the same as running the app on the same web server as the back end as suggested by Carlos without requiring you to disable web security.

score 0 · Answer 2 · answered Oct 04 '19 at 18:10

0

that solution is fine for local testing. In production the royale client will be hosted in the same domain than you AMFPHP backend, so the problem will disappear. In fact, you normally will configuring you application to be tested in localhost serving the royale client, and this will remove that need too.

answered Oct 04 '19 at 18:10

Carlos Rovira

507
2
11

Hi Carlos, thanks for you reply. So when making dev, adding "--disable-web-security" for Chrome is a mandatory if using server services. Perhaps it would be great to add it in docs. This is a sort of flash socket policy. In the futur, if Chrome discard option for disable CORS, is there any other solutions (for dev guys) ? (I thinks add header Access-Control-Allow-Origin '*' on apache config but perhaps wrongs setup, it doesn't work for me...) – Fred Oct 04 '19 at 21:07
Hi Fred, we can warn users in docs, but without talking about a concrete solution, since users can use different browsers and editors. For example I use a option in Safari and a plugin in Chrome. Can you submit a PR in the docs to warn about this in a "generic" way? I can integrate your patch in royale-docs :). Thanks! – Carlos Rovira Oct 05 '19 at 13:31
Hi Carlos, I understand your mean for the docs for generic way. the fact is now I use Chrome because I found a quick start guide to use it with Apache Royale, but before I was using Mozilla because more easy to use flash player content debugger. At most the use of ApacheRoyale is easy and without pitfalls, the more there should be developers who will use it. What I want to say is that time to do things fast is important for devs. Currently about thirty SOF tags can scare new guys but I intend to feed a maximum this side there. I will take the time to do a PR on docs on a generic way. Thanks – Fred Oct 05 '19 at 18:18
I run my apps using a local web server to solve my CORS issues. Of course you need CORS headers which allow a different domain for that to work or serve your files locally as well. – Harbs Oct 05 '19 at 18:41

How to disable CORS on Chrome when using visual studio code and using AMF on Apache Royale

2 Answers2