Running a source built 4.19 Preview 4 build with my HTML5 game I am trying to connect to my hosted server. I have both the HTML5 game uploaded to my FTP and a dedicated server hosted elsewhere. I can connect with a Win64 client with no issues. I’ve made the steps outlined [here][1] to enable HTML5 networking:
When my game starts I click “login” to connect to the server and the following pops up:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://<host api address>. (Reason: missing token ‘pragma’ in CORS header ‘Access-Control-Allow-Headers’ from CORS preflight channel).
ERROR: Cross-Origin Resource Sharing [CORS] check FAILED
hostname: Error: Request failed: https://<host api address>
It is the connection to the API that is being denied and my actual open [http://x.x.x:x/] request does not even execute. The connection attempt is built in to the Host SDK UE4 Plugin. On the web console network tab you can see the request.
Now I believe the concept is to add the following to the API request, but how do I do this? Will I need to add it via blueprints or in the gamename.html file?
I found this example but I am not sure if PHP is what I need. Do I have to make a PHP file or convert the gamename.html to a gamename.php?
<php
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET, POST');
header('Access-Control-Allow-Headers: content-type, pragma, x-unrealengine-agent');
--next code
Edit: Had to fix post as some got cut off.
From what I understand you have to add these in to the index.php or the .htaccess file which is generated by UE4.
I’ve tried various ways adding it to .htaccess with no luck. With quotes, without quotes, ect.
Header always set Access-Control-Allow-Origin: "*"
Header always set Access-Control-Allow-Methods: "GET, HEAD, POST, CONNECT, PUT, OPTIONS"
Header always set Access-Control-Allow-Headers: "content-type, pragma, x-unrealengine-agent"
However, what the kicker seems to be is that it is a “preflight” request requiring some php code I haven’t gotten to work just yet. I’ve seen some places where they say only the .htaccess file is required but it has yet to work for me.
edit: Also note I am testing with my game uploaded to an FTP (not the HTML5LaunchHelper.exe)
Not quite sure if this could be it but in the gamename.html file there is a response header section - could this be changed to include ‘pragma’? Lines 705 - 738 (attached the section code).
link text
Update:
To make sure this is in fact a CORS issue and not something else I downloaded Chromium, created a shortcut and added this to the run line:
--disable-web-security --user-data-dir
This will disable CORS within Chromium.
Doing this I was able to connect to my server! So I can confirm the server connection and in-game programming is working correctly. Note only do this for development purposes (remember to turn it off!)
in a nutshell, let’s say for example you have mygame.com and api.mygame.com – while these may be hosted on the same machine - these are technically two different domains.
CORS security was designed to prevent XSS hacking (cross site scripting attacks – you can search for a lot of examples and informations on this).
to help prevent running code from a different domain - you need to tell the browser that “this script can run on the following domains” (and this is sent FROM the remote domain) via the HTTP header “Access-Control-Allow-Origin”.
which is silly (if you ask me) since most of the time, this is set as: Access-Control-Allow-Origin: *
which means, allow this script to run from anywhere. (which goes back to square one of the security issue…) anyways, for your project, you will need to get the API server to send this in the HTTP header.
if you have control of the API URL (e.g. it’s a php file that you’ve created) - then, this is the best scenario. add that (Access-Control-Allow-Origin: *) to your HTTP response headers.
otherwise, if this is an (e.g. a thirdparty) API server you are just using, you will need to find out if they can add that (Access-Control-Allow-Origin: *) for you.
good luck!
1 Like
I created a post at Playfab’s forum (my third party hosted API). You can find the link to the post here:
https://community.playfab.com/questions/17575/ue4-cors-w-playfab-login.html
To quote their response:
What’s interesting is that their
answer to this
(HTML5 CORS Issue to my Hosts API / Hosted Server - Platform & Builds - Epic Developer Community Forums)
is to add
“Access-Control-Allow-Origin: *” to
our response headers. But that’s
already in our headers - see the file
you posted, above.
The issue that’s being thrown by the
preflight in your game’s code is that
pragma isn’t an allowed header. Which
isn’t surprising -
x-unrealengine-agent isn’t an allowed
header, either (neither of those are
applicable to any calls to PlayFab).
So basically, even though those
headers shouldn’t be in any call you
make to PlayFab, it sounds like the
preflight logic in UE is checking for
compatibility and rejecting the call.
If you remove the pragma header from
the call, you should be able to get
past this.
Please let me know if there is a way to manually remove the ‘pragma’ and ‘x-unrealengine-agent’ header or, if necessary, open a bug report.
hello kielbasa,
from your description and the response from the playfab support team – this might be a legitimate bug if this requires setting certain access control request headers… i’ll take a look at this after i get back from a little vacation break (mid march). apologies for the delay.
finally had time to look at this.
in file:
- Engine/Source/Runtime/Online/HTTP/Private/HTML5/HTML5HTTP.cpp
function:
- bool FHTML5HttpRequest::StartRequest()
comment out:
// Add "Pragma: no-cache" to mimic WinInet behavior
if (GetHeader("Pragma").IsEmpty())
{
SetHeader(TEXT("Pragma"), TEXT("no-cache"));
}
i will remove that for 4.20 – there’s no reason we should be setting that…
from your playfab thread, if you’re still seeing errors with X-UnrealEngine-Agent (but i don’t think it should error out), then also comment out:
// make a fake header, so server has some idea this is UE
SetHeader(TEXT("X-UnrealEngine-Agent"), FString::Printf(TEXT("game=%s, engine=UE4, version=%s"), FApp::GetProjectName(), *FEngineVersion::Current().ToString()));
but (again), i’d like to request you try it with this still in the code – i’m just curious if this will error or not.
looking forward to your findings!
Sucess!!! This issue is now resolved 100%!
I had to remove BOTH headers however…
thank you for testing this – i will make the adjustment necessary to handle setting request headers. the fix will most likely be targeted for 4.20 (4.19 hotfix window will be missed since i’m currently working with epic’s own API server router thingie – another issue that is related to this).
thanks again!
