Post request converts to Options request when using WebGL

Hi,

It's great that unity developer teams added webgl building option.
I chose webgl platform for my next release and I hope it works correctly.
The original project was a mobile client/server application.
The mobile client was sending POST requests to the server for login and stuff and the server responds with JSON response.

Code (CSharp):

1.  
2.         postHeader.Add("Content-Type", "text/json");
3.         postHeader.Add("Content-Length", jsonString.Length.ToString());
4.         postHeader.Add("_sessionKeyS", hash);
5.      
6.         var request = new WWW(url, encoding.GetBytes(jsonString), postHeader);
7.  

The problem is that after porting the stuff to web gl, the request/response sequence did not work correctly.

When I checked the apache access log I found out this

But normally it should be POST /api/login.php
I am not sure how to handle this situation.

Any help or hint is greatly appreciated.
Thanks for advance.

 

I found the error, but I am not sure of the solution yet.
In php this if fails.

Code (CSharp):

1. if(isset($headers['_sessionKeyS'])){

Even thought the webgl client sets it like that

Code (CSharp):

1. postHeader.Add("_sessionKeyS", hash);

 

I figured it out!
Since I am sending a custom header, there is a call called 'prelight' that goes to the server.

I added this to my PHP and it handles the prelight then sends the API calls correctly.

Code (CSharp):

1. function cors() {
2.  
3.     // Allow from any origin
4.     if (isset($_SERVER['HTTP_ORIGIN'])) {
5.         header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}");
6.         header('Access-Control-Allow-Credentials: true');
7.         header('Access-Control-Max-Age: 86400');    // cache for 1 day
8.     }
9.  
10.     // Access-Control headers are received during OPTIONS requests
11.     if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
12.  
13.         if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']))
14.             header("Access-Control-Allow-Methods: GET, POST, OPTIONS");        
15.  
16.         if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
17.             header("Access-Control-Allow-Headers: {$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}");
18.  
19.         exit(0);
20.     }
21. }
22.  
23. cors();

Hope it helps someone.

 

I'm using django with corsheaders, and when I WWW Post to /client/post it is receiving it -- but it is receiving it as empty POST data. if I check for OPTIONS at /client/post it returns an error, "wsgi request did not have header "OPTIONS"".

Does anyone know what's going on here? Why would my WWWForm, which sends regular POST data and works fine from desktop application, fail when it's deployed as WebGL? If it is converting the POST to OPTIONS for the server to prelight the call, why does the server not see OPTIONS?

thanks!

 

i have this same issue. webgl

unity side

Code (CSharp):

1.  
2.         request.SetHeader("Access-Control-Allow-Credentials", "true");
3.         request.SetHeader("Access-Control-Allow-Origin", "*");
4.         request.SetHeader("Access-Control-Allow-Headers", "Accept, X-Access-Token, X-Application-Name, X-Request-Sent-Time,Authorization");
5.         request.SetHeader("Access-Control-Allow-Methods", "GET,PUT,POST,DELETE,OPTIONS");
6.  
7.         request.SetHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
8.         request.SetHeader("X-Requested-With", "XMLHttpRequest");
9.  
10.         request.SetHeader("Authorization", "Bearer " + StaticUtilities.BrearerToken);

server side

Code (Javascript):

1.   app.post('/Api/v1/Game/Login/', Security.verifyToken, function (req, res) {
2.     res.setHeader('Content-Type', 'application/json');
3.     res.setHeader("Access-Control-Allow-Credentials", "true");
4.     res.setHeader("Access-Control-Allow-Headers", "Accept, X-Access-Token, X-Application-Name, X-Request-Sent-Time");
5.     res.setHeader("Access-Control-Allow-Methods", "GET, POST, OPTIONS");
6.     res.setHeader("Access-Control-Allow-Origin", "*");
7.  
8.     let UserName = req.body.UserName;
9.     let Password = req.body.Password;
10.     let DeviceUUID = req.body.DeviceUUID;
11.     let IP = req.body.IP;
12.     let DeviceName = req.body.DeviceName;
13.     let DeviceRam = req.body.DeviceRam;
14.     let DeviceCpu = req.body.DeviceCpu;
15.     let OperatingSystem = req.body.OperatingSystem;
16.     let GraphicsDevice = req.body.GraphicsDevice;
17.     Login(UserName, Password, IP, DeviceName, DeviceRam, DeviceCpu, res);
18.   });
19.  

 

thanks for replying yes it is but i realize the problem was i didn't handle option in the server side

Code (JavaScript):

1. var cors = require('cors');
2. app.options('*', cors());//to support webgl request and resolve post routing to option