Axios REST Preflight OPTIONS 400 status on IE/Edge - rest

I have a problem with my requests using Edge/IE. I'm getting a code 400 code on
preflight OPTIONS.
I'm adding a 2 additional headers to all my requests in application with axios:
Authorization:
if ( token ) {
axios.defaults.headers.common[ 'Authorization' ] = 'Bearer ' + token;
} else {
delete axios.defaults.headers.common[ 'Authorization' ];
}
Accept-Language:
if ( lang ) {
axios.defaults.headers.common[ 'Accept-Language' ] = lang;
} else {
delete axios.defaults.headers.common[ 'Accept-Language' ];
}
Here's how my request headers works in Chrome:
Accept-Language: pl-PL
Authorization: Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJOZXcgUGFzdG9yYWwgQXBwIiwiYXVkIjoiTmV3IHBhc3RvcmFsIHVzZXIiLCJpYXQiOjE1MTM1OTEzODUsImV4cCI6MTUxMzU5ODU4NSwidWlkIjoxMSwidHlwZSI6NCwibGFuZ3VhZ2UiOjEsImRpc3BsYXlOYW1lIjoiVGVzdG8gUHJvYm9zemN6eiJ9.qyFHZuCHC9-NpNqjY7keY7j4LE5zu5JKxK9VyAFwH60
Request headers in Edge:
Accept: */*
Accept-Encoding: gzip, deflate
Access-Control-Request-Headers: content-type
Access-Control-Request-Method: POST
Cache-Control: no-cache
Connection: Keep-Alive
Content-Length: 0
Host: 52.169.186.226
Origin: http://localhost:8080
Referer: http://localhost:8080/
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36 Edge/16.16299
Response headers:
Access-Control-Allow-Headers: X-Requested-With, Content-Type, Accept, Origin, Authorization
Access-Control-Allow-Methods: OPTIONS,POST
Access-Control-Allow-Origin: *
Connection: close
Content-Length: 0
Content-Type: text/html; charset=UTF-8
Date: Mon, 18 Dec 2017 11:29:49 GMT
Server: Apache/2.4.25 (Ubuntu)
When I remove Accept-Language header the application start working in Edge, but problem still exists in IE.
The only messages from browser is code http error 400 and the console log of error is:
description: "Network Error"
message: "Network Error"
stack: "Error: Network Error at createError (http://localhost:8080/index_bundle.js:68811:3) at handleError (http://localhost:8080/index_bundle.js:68656:7)"
Rest of the headers is standard for axios. On the backend we're using Slimp PHP framework.
Any idea how to debug the problem, or similar problems using standard REST requestes with React + Axios? Or what should I check in first order?

Related

Same request - get error: 400 Bad Request - Advance REST Client

Execute http POST request by the Postman (desktop version):
http://127.0.0.1:8090/api/profiles/export
Header:
Host: 127.0.0.1:8090
Connection: keep-alive
Content-Length: 282
Accept: application/json, text/plain, */*
X-XSRF-TOKEN: CfDJ8CQGvOgKAdr991T0W48TbmbJulHjCLSNl5Ufw9B-aa4W8FnpeleEvRxItMC3lj0KiyXTrhn9vOR3RCtTxSIpCh1d3JfjRIT2GRk3osT3e_7g
Authorization: gUqILBH5fUu+ZIU98Xq62g
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36
Content-Type: application/json
Origin: http://127.0.0.1:8090
Referer: http://127.0.0.1:8090/folders/cpes/1189/profiles
Accept-Encoding: gzip, deflate
Accept-Language: en-GB,en;q=0.9,ru-RU;q=0.8,ru;q=0.7,en-US;q=0.6
Cookie: .AspNetCore.Antiforgery.vAmb-7is-9Q=CfDJ-N_Krwb3YlxI4utC_l6qsoVQQc8YY6DeFOfaTVHkx8bFMqDtjDRN0N1O3MmbfbRYSq72tic5B-MPpiybWUtaEbtaXIvHiBbRpOsYG5vj66tkYlrY-j6CA; XSRF-TOKEN=CfDJ8CQGvOgpT-VClVphMqoot5levDSTI5VFGbACv6z7_pXhiCrcdtKAdr991T0W48TbmbJulHjCLSNl5Ufw9B-aa4W8FnpeleEvRxItMC3lj0KiyXTrhn9vOR3RCtTxSIpCh1d3JfjRIT2GRk3osT3e_7g
Payload:
{"Interval":0,"Request":{"folderId":1189,"filter":"{}","visibleColumns":["profileType","name","description","managedGroups","parentFolder.name"],"visibleColumnsNames":["Profile Type","Name","Description","Assigned To (Managed Groups)","Parent"],"orders":"profileType:asc,name:asc"}}
Get success response:
{
"code": 200,
"result": {
"ftpAddress": "ftp://127.0.0.1/export/",
"fileName": "admin_Profiles_20220728160913.csv"
}
}
Nice. I can execute this request by POSTMAN many times with success response. OK.
Now I want to execute SAME POST request by Advance REST Client (Chrome extenstion).
But I get error:
<html>
<head><title>400 Bad Request</title></head>
<body>
<center><h1>400 Bad Request</h1></center>
<hr><center>nginx/1.18.0 (Ubuntu)</center>
</body>
</html>

Cors configuration with camel

I have an AJAX request to my Rest Webservice with a custom Header "login".
Here is my rest configuration :
restConfiguration()
.component("netty4-http")
.bindingMode(RestBindingMode.json)
.dataFormatProperty("prettyPrint", "true")
.enableCORS(true)
.corsAllowCredentials(true)
.corsHeaderProperty("Access-Control-Allow-Headers", "Origin, Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers, login")
.contextPath(contextPath).host(host).port(port);
I'm getting a 200 response to the OPTIONS preflight request but the "login" Header is not the Access-Control-Allow-Headers and my browser never send the actual request.
Also i have not done any configuration in my route for cors.
Here is my request headers
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:58.0)
Gecko/20100101 Firefox/58.0
Accept:
text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8
Accept-Language: fr,fr-FR;q=0.8,en-US;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Access-Control-Request-Method: GET
Access-Control-Request-Headers: login
Origin: http://127.0.0.1:8081
DNT: 1
Connection: keep-alive
And responce headers :
content-length: 0
Accept:
text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8
Accept-Encoding: gzip, deflate
Accept-Language: fr,fr-FR;q=0.8,en-US;q=0.5,en;q=0.3
Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: Origin, Accept, X-Requested-With,
Content-Type, Access-Control-Request-Method,
Access-Control-Request-Headers
Access-Control-Allow-Methods: GET, HEAD, POST, PUT, DELETE, TRACE,
OPTIONS, CONNECT, PATCH
Access-Control-Allow-Origin: http://127.0.0.1:8081
Access-Control-Max-Age: 3600
Access-Control-Request-Headers: login
Access-Control-Request-Method: GET
breadcrumbId: ID-resitt-ws-1521624297667-0-6
DNT: 1
Origin: http://127.0.0.1:8081
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:58.0)
Gecko/20100101 Firefox/58.0
connection: keep-alive (modifié)
I feel like my cors configuration doesn't change anything to my situation.
We found an answer, .enableCORS(true) must be placed after .contextPath(contextPath).host(host).port(port) line.
like this
restConfiguration()
.component("netty4-http")
.bindingMode(RestBindingMode.json)
.dataFormatProperty("prettyPrint", "true")
.contextPath(contextPath).host(host).port(port)
.enableCORS(true)
.corsAllowCredentials(true)
.corsHeaderProperty("Access-Control-Allow-Headers", "Origin, Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers, login");
In my case the CORS headers wheren't in http response when the camel thrown an exception and returned a 500 error.

When not logged to Deezer, my application is redirected to wrong url

I'm having a problem with my redirect url, but only when I'm not connected to deezer already.
When I'm connected, my OAuth flow works perfectly, and I'm redirected to the right url: 'http://10.0.0.68:3000/callback/'.
But when I don't have a deezer session on, and I am redirected to the Deezer login page, it Doesn't work. Whenever I log in to Deezer, either with facebook or not, I am redirected to the following address: 'http://10.0.0.68:3000/callback/https://connect.deezer.com/oauth/auth.php?perms=basic_access%2Cemail%2Coffline_access&format=window&app_id=175451&redirect_uri=http%3A%2F%2F10.0.0.68%3A3000%2Fcallback%2F#='.
I have no idea how could this be a problem with my app, since it happens outside of my scope, but here is my code:
settings.py
DEEZER_REDIRECT_URI = reverse_lazy('front:callback')
DEEZER_API_URL = 'https://api.deezer.com/'
DEEZER_CONNECT_URL = 'https://connect.deezer.com/'
DEEZER_APP_ID = "xxxxxx"
DEEZER_SECRET_KEY = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
views.py
class LoginView(View):
"""Logs user with Deezer"""
def get(self, request):
url = settings.DEEZER_CONNECT_URL + 'oauth/auth.php?' + \
urlencode({
'app_id': settings.DEEZER_APP_ID,
'perms': 'basic_access,email,offline_access',
'redirect_uri': settings.BASE_URL + str(settings.DEEZER_REDIRECT_URI)[1:]
})
redirect = HttpResponseRedirect(url)
return redirect
urls.py
app_name = 'front'
urlpatterns = [
url(r'^$', views.IndexView.as_view(), name='index'),
url(r'^login/$', views.LoginView.as_view(), name='login'),
url(r'^callback/$', views.CallbackView.as_view(), name='callback'),
]
Hope someone can help me.
UPDATE 2016-03-31
Seems that Deezer resolved the issue so it should work in your case, too.
Previous answer:
At least I can tell that it's not your fault. Today I realized that the previously working OAuth-workflow for our application www.mooval.de now behaves exactly the same as you describe here.
Deeezer seems to have deployed something recently which fails to create a correct redirect URL:
https://connect.deezer.com/login.php?app_id=155151&redirect_type=refresh&redirect_link=http%3A%2F%2Fwww.mooval.de%2FdeezerAuthCallbackhttps%3A%2F%2Fconnect.deezer.com%2Foauth%2Fauth.php%3Fstate%3Deb05c0fe-48ef-4cce-85c3-ed1d037d7111%26perms%3Doffline_access%252Cmanage_library%252Cdelete_library%26format%3Dwindow%26app_id%3D155151%26redirect_uri%3Dhttp%253A%252F%252Fwww.mooval.de%252FdeezerAuthCallback
GET /oauth/auth.php?app_id=xxxxxx&redirect_uri=http%3A%2F%2Fwww.mooval.de%2FdeezerAuthCallback&perms=manage_library%2Cdelete_library%2Coffline_access&state=eb05c0fe-48ef-4cce-85c3-ed1d037d7111
HTTP/1.1 Host: connect.deezer.com
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.87 Safari/537.36
DNT: 1
Referer: http://mooval.de/
Accept-Encoding: gzip, deflate, sdch
Accept-Language: de-DE,de;q=0.8,en-US;q=0.6,en;q=0.4
Cookie: xxx
HTTP/1.1 302 Found
Date: Wed, 30 Mar 2016 12:37:23 GMT
Server: Apache
Set-Cookie: sid=fr7ae7be4cd40c37855e22e876961fce0c3ec235; path=/; domain=.deezer.com; HttpOnly
Expires: Thu, 19 Nov 1981 08:52:00 GMT
Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0
Pragma: no-cache
P3P: policyref="/w3c/p3p.xml" CP="IDC DSP COR CURa ADMa OUR IND PHY ONL COM STA"
Location: https://connect.deezer.com/login.php?app_id=155151&redirect_type=refresh&redirect_link=http%3A%2F%2Fwww.mooval.de%2FdeezerAuthCallbackhttps%3A%2F%2Fconnect.deezer.com%2Foauth%2Fauth.php%3Fstate%3Deb05c0fe-48ef-4cce-85c3-ed1d037d7111%26perms%3Doffline_access%252Cmanage_library%252Cdelete_library%26format%3Dwindow%26app_id%3Dxxxxx%26redirect_uri%3Dhttp%253A%252F%252Fwww.mooval.de%252FdeezerAuthCallback
X-Host: blm-web-49
Content-Length: 0
Keep-Alive: timeout=3, max=500
Connection: Keep-Alive
Content-Type: text/html; charset=utf-8

angularjs restangular customPUT with Slim php restful framework

I am trying to update database using SLIM php. But the form data values passed in are showing blank. I have been successful in posting (customPOST) the values.
Here is the code:
AngularJs:
UpdateCategoryFormData:function(category,catId){
formData=new FormData();
angular.forEach(category, function (fieldData, field) {
formData.append(field, fieldData);
});
return Restangular.one('category/update',catId)
.withHttpConfig({transformRequest: angular.identity})
.customPUT(formData, undefined, {}, {'Content-Type': undefined});
}
SLIM php:
$app->put('/category/update/:catId',function($catId) use($app){
$data=$app->request->put();
print_r($data);
$catName=$app->request->put('catName');
$catParent=$app->request->put('catParent');
Result is:
array()
echo $catName;
I am getting a blank as the value of $catName;
Here is the copy of the headers:
Request Method:PUT
Status Code:200 OK
Response Headers
view source
Connection:Keep-Alive
Content-Length:10
Content-Type:text/html
Date:Fri, 28 Aug 2015 03:48:28 GMT
Keep-Alive:timeout=5, max=100
Server:Apache/2.4.9 (Win32) PHP/5.5.12
X-Powered-By:PHP/5.5.12
Request Headers
view source
Accept:application/json, text/plain, */*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Content-Length:249
Content-Type:multipart/form-data; boundary=----WebKitFormBoundary4gUX2gCt7zCICZNN
User-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2489.0 Safari/537.36
Request Payload
------WebKitFormBoundary4gUX2gCt7zCICZNN
Content-Disposition: form-data; name="catName"
Some Category
------WebKitFormBoundary4gUX2gCt7zCICZNN
Content-Disposition: form-data; name="catParent"
45
------WebKitFormBoundary4gUX2gCt7zCICZNN--
Can someone help pls!

302 redirect after CORS preflight

I'm running into a problem with a 302 redirect after my CORS preflight has successfully returned a 200 status. I'm currently building an app using Laravel 4.1 and Angular 1.2 as well as my own OAUTH2 server.
The error that Chrome/FF/Safari are sending back to me is:
XMLHttpRequest cannot load http://localhost.api/api/v1/tracks?$filter=id%20eq%20guid%27d7de10ba-e353-455b-a3cb-ced9b4965141%27&. The request was redirected to 'http://localhost.api/session/invalid', which is disallowed for cross-origin requests that require preflight.
I assume whats causing my issue is the "redirect" thats happening - as my normal CORS requests all work as expected.
My configuration for my Access-Control-Allow-* headers is fairly open right now during testing.
'paths' => array(
'^/api/' => array(
'allow_origin'=> array('*'),
'allow_headers'=> array('Content-Type', 'Authorization'),
'allow_methods'=> array('POST', 'PUT', 'GET', 'DELETE', 'OPTIONS'),
'max_age' => 0
),
'^/session/' => array(
'allow_origin'=> array('*'),
'allow_headers'=> array('Content-Type', 'Authorization'),
'allow_methods'=> array('GET', 'OPTIONS'),
'max_age' => 0
)
The redirect in question is in a pre-filter thats checking the validity of an OAUTH2 access token
public function filter($route, $request, $data = null)
{
// Get the authorization header or fail
if ($authorization = Request::header('Authorization', false)) {
list($type, $token) = explode(' ', $authorization);
if (is_null($auth = OAuth2::token($token)->first())) {
return Redirect::to('session/invalid');
}
$tokenExpiryDate = Carbon::createFromTimeStamp($auth->access_token_expires);
// If we don't have a Bearer authentication header
// or if the token has expired. Then redirect to an
// expired session route
if ( 'bearer' != strtolower($type)
|| Carbon::now()->gt($tokenExpiryDate)
) {
return Redirect::route(
'expiredSession',
array('expiry' => $tokenExpiryDate->timestamp)
);
}
} else {
// The authentication header is invalid, redirect to let the user know.
return Redirect::to('session/invalid');
}
}
All these requests worked when I tried debugging using POSTMAN, but after my research I've basically found that extensions don't necessarily have to play by the same rules. As well as I noticed my requests using POSTMAN never send any preflight OPTIONS requests when I initiate a simple GET, POST, etc..
Here are the headers of both an OPTIONS request as well as a GET request to follow it that is returning my error
OPTIONS Request
Remote Address:127.0.0.1:80
Request URL:http://localhost.api/api/v1/tracks?$filter=id%20eq%20guid%27d7de10ba-e353-455b-a3cb-ced9b4965141%27&
Request Method:OPTIONS
Status Code:200 OK
Request Headers
Accept:*/*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:accept, authorization
Access-Control-Request-Method:GET
Cache-Control:no-cache
Connection:keep-alive
DNT:1
Host:vegas.ine.com
Origin:http://localhost.angular
Pragma:no-cache
Referer:http://localhost.angular/admin/
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/34.0.1847.131 Safari/537.36
Response Headers
Access-Control-Allow-Headers:content-type, authorization
Access-Control-Allow-Methods:POST, PUT, GET, DELETE, OPTIONS
Access-Control-Allow-Origin:http://localhost.angular
Cache-Control:no-cache
Connection:close
Content-Type:text/html
Date:Thu, 01 May 2014 16:22:19 GMT
Server:Apache/2.2.26 (Unix) DAV/2 PHP/5.4.24 mod_ssl/2.2.26 OpenSSL/0.9.8y
Set-Cookie:laravel_session=eyJpdiI6IktOZjlTM1ZVNUx0TEhoaTczY3dQcDBKRWlvbnppbDA3QTdqSENJdTc2R1U9IiwidmFsdWUiOiJEZ2ltXC9mNm1Qa20rV3BVRlNHTXgySGtUeVlpNjNZcGFudDFBWDJJekl1MEVNVlhSRE5WWk5YZDNxUkZuU0VEVytcL3NLNlVBXC9hZWtJQzdHU2FqVWtMdz09IiwibWFjIjoiYTYxYjEwNjlmYmI2MjMwNmE4MzlkYjIwNGZlNzA4Y2ViZGVkZmU1MTQzMzc5NmU2YzI2ZGExNzYxY2U5ZjdiMCJ9; expires=Thu, 01-May-2014 18:22:19 GMT; path=/; httponly
X-Frame-Options:SAMEORIGIN
X-Powered-By:PHP/5.4.24
GET Request
Remote Address:127.0.0.1:80
Request URL:http://localhost.api/api/v1/tracks?$filter=id%20eq%20guid%27d7de10ba-e353-455b-a3cb-ced9b4965141%27&
Request Method:GET
Status Code:302 Found
Request Headers
Accept:application/json, text/plain, */*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Authorization:Bearer 6Ss4XPrPM5jQD7Es0dz7TPRQ76hGA69vT9K94pst
Cache-Control:no-cache
Connection:keep-alive
DNT:1
Host:vegas.ine.com
Origin:http://localhost.angular
Pragma:no-cache
Referer:http://localhost.angular/admin/
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/34.0.1847.131 Safari/537.36
Response Headers
Access-Control-Allow-Origin:http://localhost.angular
Cache-Control:no-cache
Connection:Keep-Alive
Content-Type:text/html; charset=UTF-8
Date:Thu, 01 May 2014 16:22:19 GMT
Keep-Alive:timeout=5, max=100
Location:http://localhost.api/session/invalid
Server:Apache/2.2.26 (Unix) DAV/2 PHP/5.4.24 mod_ssl/2.2.26 OpenSSL/0.9.8y
Set-Cookie:laravel_session=eyJpdiI6InlnREVPcUJTcyswMnRLanFDSlZ6QWFBVXZWMGdMNVNLYWxNTHRJVUlkalk9IiwidmFsdWUiOiJ4aXN5U0dcL1NYeGQrcUVzWFhYV3o2MWhcL25hQTlhcVUxbWxkN2R6SG9KZDNKaGNLTkRQY2FyTitpVHNGZzYxVVRtZUhoZGZRWE9GWjZRaDd1VVwvZUZuUT09IiwibWFjIjoiY2EzZTViZGIzZmVlMDcwZjdhMzBjOWQxYTgwZWNlYTJiMDk3ODdlZTk3NTYxMDNmM2YyODJjOGIxMzBmMmJlMiJ9; expires=Thu, 01-May-2014 18:22:20 GMT; path=/; httponly
Transfer-Encoding:chunked
Vary:Authorization
X-Clockwork-Id:1398961340.2239.1349476325
X-Clockwork-Version:1.5
X-Frame-Options:SAMEORIGIN
X-Powered-By:PHP/5.4.24
I have done something like this and it worked fine for me
//pattern to allow origins
$allowedOriginPattern = /** YOUR PATTERNS **/;
$allowedOrigin = "";
if (preg_match($allowedOriginPattern, $_SERVER['HTTP_ORIGIN'])) {
$allowedOrigin = $_SERVER['HTTP_ORIGIN'];
}
/**
* set http content type
*/
header('Content-Type: application/json;charset=UTF-8');
header('Access-Control-Allow-Origin: ' . $allowedOrigin);
header('Access-Control-Allow-Methods: DELETE, HEAD, GET, OPTIONS, POST, PUT');
header('Access-Control-Allow-Headers: Content-Type, Content-Range, Content-Disposition, Content-Description');
header('Access-Control-Max-Age: 1728000');
I have added this code in laravel index.php
Here is the reference for CORS
http://www.w3.org/TR/cors/#cross-origin-request-with-preflight-0
Spent an hour and this trying to redirect to a subdomain
Instead just used javascript after a successful response
window.location.href = resp.data.redirect