Dart: HTTP GET with Header - http

I'm working on creating a Flutter application that works with LIFX. I'm trying to follow their instructions here, but I'm having issues adding a header to my HTTP GET request.
TestHttpGet() async {
var httpClient = new HttpClient();
var header = "Bearer $token"; //token hidden
var url = 'https://api.lifx.com/v1/lights/all/state';
String result;
try {
var request = await httpClient.getUrl(Uri.parse(url));
request.headers.set("Authorization", header);
var response = await request.close();
if (response.statusCode == HttpStatus.OK) {
var json = await response.transform(UTF8.decoder).join();
print(json);
var data = JSON.decode(json);
result = data['brightness'].toString();
} else {
result =
'Error getting response:\nHttp status ${response.statusCode}';
}
} catch (exception) {
result = 'Failed parsing response';
}
This returns with Error getting response: Http status 404. I've tried various ways of request.headers .set .add [HttpHeaders.Authorization] = "header" all return with a 404. Any advice would be appreciated.

You can pass a Map<String, String> to the http.get call as the headers parameter like this:
await httpClient.get(url, headers: {
'Authorization': 'Bearer $token',
});

In order to set headers you can't set the entire variable since it is set as final. What you need to do is set the value of the individual array items which are also known as the individual "headers" in this case.
For example :
http.Request request = http.Request('GET', uri);
request.headers['Authorization'] = 'Bearer $token';

I believe dart makes all the fields of a HttpHeader to lowercase.
https://github.com/flutter/flutter/issues/16665
The argument for that is because "Field names are case-insensitive". (otherwise it is not HTTP compliant)
https://www.rfc-editor.org/rfc/rfc2616#section-4.2
Let me know if you found a workaround for this.

Related

DioError [DioErrorType.RESPONSE]: Http status error [405]

I am creating a post request Using Dio,
this is my FormData params,
FormData formData = FormData.fromMap({
'wallet_id': '${dropdownValue.walletId}',
'member_id': '${_loginModel.memberId}',
'draw_amount': withdrawalAmountContoller.text,
'login_password': passwordController.text,
});
then I am passing params like this,
Response response = await dio.post(url, data: params);
But I am getting an error on request,
ERROR[DioError [DioErrorType.RESPONSE]: Http status error [405]] => PATH: https://vertoindiapay.com/pay/api/withdraw
E/flutter ( 6703): [ERROR:flutter/lib/ui/ui_dart_state.cc(157)] Unhandled Exception: DioError [DioErrorType.RESPONSE]: Http status error [405]
E/flutter ( 6703): #0 DioMixin._request._errorInterceptorWrapper. (package:dio/src/dio.dart:848:13)
Please help me solve this. My URL is=> https://vertoindiapay.com/pay/api/withdraw
Although this is working fine in postman,
Future<void> signUpUser() async {
final formData = {
'username': 'test1',
'password': 'abcdefg',
'grant_type': 'password',
};
try {
Dio _dio = new Dio();
_dio.options.contentType = Headers.formUrlEncodedContentType;
final responseData = await _dio.post<Map<String, dynamic>>('/token',
options: RequestOptions(
method: 'POST',
headers: <String, dynamic>{},
baseUrl: 'http://52.66.71.229/'),
data: formData);
print(responseData.toString());
} catch (e) {
final errorMessage = DioExceptions.fromDioError(e).toString();
print(errorMessage);
}
}
class DioExceptions implements Exception {
DioExceptions.fromDioError(DioError dioError) {
switch (dioError.type) {
case DioErrorType.CANCEL:
message = "Request to API server was cancelled";
break;
case DioErrorType.CONNECT_TIMEOUT:
message = "Connection timeout with API server";
break;
case DioErrorType.DEFAULT:
message = "Connection to API server failed due to internet connection";
break;
case DioErrorType.RECEIVE_TIMEOUT:
message = "Receive timeout in connection with API server";
break;
case DioErrorType.RESPONSE:
message =
_handleError(dioError.response.statusCode, dioError.response.data);
break;
case DioErrorType.SEND_TIMEOUT:
message = "Send timeout in connection with API server";
break;
default:
message = "Something went wrong";
break;
}
}
String message;
String _handleError(int statusCode, dynamic error) {
switch (statusCode) {
case 400:
return 'Bad request';
case 404:
return error["message"];
case 500:
return 'Internal server error';
default:
return 'Oops something went wrong';
}
}
#override
String toString() => message;
}
Please try passing the params as JSON encoded.
Response response = await dio.post(url, data: json.encode(params));
Hope this helps!
I had the same error, the BaseOptions was having different method name, other than POST... when i changed it back to POST it worked. Not sure if DIO package accepts using other than POST methods to call a Post method in API.
So I had this issue. So I found out that the headers you use in Postman should match the headers you are using in Dio. Like for example
headers: {
'Accept': "application/json",
'Authorization': 'Bearer $token',
},
and my Postman looks like this Postman
Apparently Dio behaves like postman when it comes to headers too so apparently if the headers from postman mis-match then it will throw an error.
Well in plain terms Dio would infer the content-type by itself just like postman would do.
Try to pass content type
final response = await Dio().post(Url,
options: Options(contentType: 'multipart/form-data'), data: formData);
This particular problem occurs when the response you expect (in JSON) doesn't match the response you are looking forward to receiving.
if this is your code,
Response response = await dio.post(url, data: params);
Check the Response model if it matches with the JSON it receives in the Postman response.
i had the same error the problem come from your server. your action to the server may be get datas [FromBody] use [FromForm] it will work. for me i resolved like that
eg public DataResponseModel UpdateFormalize([FromForm] FormalizeDto dto){
//somes code
}

How do I set headers on Flutter/Dart http Request object?

I need a way to set the headers of the dart http Request object to application/JSON.
I want to build a Request object to send to my backend API. I set the body to my JSON object, but when it gets sent, it defaults the headers to text/html instead of application/json.
I have tried using the built-in method
http.post(url,dynamic body);
but unfortunately this method places the body in the parameters of the URL and I need it in the actual body of the request.
So instead I built an http Request object, and manually set the URL and body but like I said, it sets the headers to text/html.
I have read the docs for https://pub.dev/documentation/http/latest/http/Request-class.html, but unfortunately, I haven't found a way to set the headers.
postRequest(uri) async {
Uri url = Uri.tryParse("https://ptsv2.com/t/umt4a-1569012506/post");
http.Request request = new http.Request("post", url);
request.body = '{mediaItemID: 04b568fa, uri: https://www.google.com}';
var letsGo = await request.send();
print(letsGo.statusCode);
}
Much thanks for any possible solutions!
Ps. this is my first ask on Stack Overflow so I apologize if I made any errors in posting.
Solved!
postRequest(uri) async {
Uri url = Uri.tryParse("https://ptsv2.com/t/umt4a-1569012506/post");
http.Request request = new http.Request("post", url);
request.headers.clear();
request.headers.addAll({"content-type":"application/json; charset=utf-8"});
request.body = '{mediaItemID: 04b568fa, uri: https://www.google.com}';
var letsGo = await request.send();
print(letsGo.statusCode);
}
I was having some issues with the Request object default setting the encoding.
By manually specifying utf-8, the server I am contacting accepts it.
for the post or get any request you can Add Header like this -
var permAddUrl = 'your requested url';
var bodyParameters = {
'Email': email,
'MobileNo': mobileNumber,
};
await http.post(
requesturl,
headers: { 'Content-Type': 'application/x-www-form-urlencoded',
"Authorization":"$token",
},
body: bodyParameters,).then((response) {
var data = json.encode(response.body);
print(data);
setState(() {
if(response.statusCode == 200){
//var statesList = data['data'];
UtilAction.showSnackBar(context, " Details Submitted Successfully");
}
});
});

flutter: HTTP get request - disable encoding parameters

I'm trying to make a demo app with flutter and trying to fetch products from a demo magento site.
This is my code:
Future<List<Product>> fetchProducts() async {
final params = <String, String>{
'searchCriteria[filter_groups][0][filters][0][condition_type]': 'in',
'searchCriteria[filter_groups][0][filters][0][field]': 'type_id',
'searchCriteria[pageSize]': '20',
'searchCriteria[filter_groups][0][filters][0][value]': 'simple,configurable,bundle',
'searchCriteria[currentPage]': '1',
'searchCriteria[sortOrders][0][field]': 'created_at',
'searchCriteria[sortOrders][0][direction]': 'DESC'
};
var uri = Uri.parse('https://demo.com/rest/v1/default/products');
uri = uri.replace(queryParameters: params);
print(uri);
final response =
await http.get(uri, headers: {HttpHeaders.authorizationHeader: "Bearer qb7157owxy8a29ewgogroa6puwoafxxx"});
if (response.statusCode == 200) {
// If the call to the server was successful, parse the JSON.
final data = json.decode(response.body);
final products = data["items"] as List;
return products.map<Product>((json) => Product.fromJson(json)).toList();
} else {
// If that call was not successful, throw an error.
throw Exception('Failed to load post');
}
}
When I debugged, the response was 400 - Bad request. I guess that because the uri was encoded to include percentage characters as I printed as below:
So how can I disable encoding the uri?
Thank you, guys.
I believe you should replace:
var uri = Uri.parse('https://demo.com/rest/v1/default/products');
uri = uri.replace(queryParameters: params);
print(uri);
with:
var uri = Uri.https('demo.com', '/rest/v1/default/products', params);
more on this: Uri.https
more on: replace
example result:
regardless of this, if I try with your params, the library behaves normal and encodes the special characters. (see more here)
if we put the actual request in the browser to check the response:
https://demo.mage-mobile.com/rest/v1/default/products?searchCriteria[filter_groups][0][filters][0][condition_type]=in&searchCriteria[filter_groups][0][filters][0][field]=type_id&searchCriteria[pageSize]=20&searchCriteria[filter_groups][0][filters][0][value]=simple%2Cconfigurable%2Cbundle&searchCriteria[currentPage]=1&searchCriteria[sortOrders][0][field]=created_at&searchCriteria[sortOrders][0][direction]=DESC
we get the following response:
And this brings me to my initial suspicion: the API does not support this call.
Maybe you should also check this type of param from your code: 'searchCriteria[filter_groups][0][filters][0][condition_type]', it seems you are trying to acces some information from a collection but you actually writing a string...
try removing the quotes (' bla bla ') from these params id... also try to put the request direcly in the browser(or postman) to see it work.
About the encoding (changing [ to %5B) -- this is normal and it should happen.

Flutter: How to http POST image to Microsoft Cognitive Services

I am trying to POST an image taken from the camera to Microsoft Cognitive Service's Face API (using the Face - Detect method). However, when I try it returns the 'Response 415':
{
"error": {
"code": "BadArgument",
"message": "Invalid Media Type."
}
}
Here is my code for this method:
final bytes = image.readAsBytesSync();
var uri = Uri.parse("https://australiaeast.api.cognitive.microsoft.com/face/v1.0/detect?returnFaceId=true&returnFaceLandmarks=false");
var request = new http.MultipartRequest("POST", uri);
var multipartFile = new http.MultipartFile.fromBytes('url', bytes, contentType: new MediaType('image', 'jpeg'));
request.headers['Ocp-Apim-Subscription-Key'] = "9c261636281d42c0947d89fe3982df73";
request.headers['Content-Type'] = "application/octet-stream";
request.files.add(multipartFile);
var response = await request.send();
print(request);
print(response.statusCode);
response.stream.transform(utf8.decoder).listen((value) {
print(value);
}
I used the Flutter Image Picker plugin to take the picture and get it to show up fine on the screen. All other operations I've tried with Microsoft Cognitive Services work fine - it is only uploading this image that is giving me problems.
I think you don't need a MultipartRequest but just a Request and assign the bodyBytes property:
final bytes = image.readAsBytesSync();
var uri = Uri.parse("https://australiaeast.api.cognitive.microsoft.com/face/v1.0/detect?returnFaceId=true&returnFaceLandmarks=false");
var request = new http.Request("POST", uri)
..headers['Ocp-Apim-Subscription-Key'] = "9c261636281d42c0947d89fe3982df73"
..headers['Content-Type'] = "application/octet-stream"
..bodyBytes = bytes;
var response = await request.send();
print(request);
print(response.statusCode);
response.stream.transform(utf8.decoder).listen((value) {
print(value);
});

How to get custom response header in angular 2?

I am new to angular 2 and currently working with angular 2.2.1 in which I am successfully able to post request and get success response however when I try to get Authorization header from response I always get null whether I am able to get Content-Type header. Below is my solution so far.
service.ts login method:
login(model: LoginModel) {
let requestUrl = '/someurl';
let requestPayload = JSON.stringify(model);
let headers = this.getHeaders(false); // ... Set all required headers
let options = new RequestOptions({ headers: headers }); // Create a request option
return this.http.post(requestUrl, requestPayload, options) // ...using post request
//.map((res: Response)) // ...and calling .json() on the response to return data
.subscribe((res: Response) => {
var payload = res.json();
var authorization = res.headers.get('Authorization');
var contentType = res.headers.get('Content-Type');
console.log(payload, contentType, authorization)
});
}
Header Helper
getHeaders(isSecureAPI: boolean) {
let headers = new Headers({ 'Content-Type': 'application/json', 'Accept': 'application/json' });
if (isSecureAPI) {
headers.append('Authorization', 'GetFromSession');
headers.append('X-UserID', 'GetFromSession');
}
return headers;
}
Fiddler track:
Angular Console Output
So anyone can guide me what I am possibly doing wrong?
Header was allowed but not exposed on CORS server however adding headers.add("Access-Control-Expose-Headers", "Authorization, X-Custom"); on server did the job :)
I've been trying to find a solution and came across this
Let's say I'm using the Microsoft Cors WebAPI 2 Nuget package, and I have the following global configuration in my WebApiConfig.cs:
...
var corsAttr = new EnableCorsAttribute("http://localhost:4200", "*", "*");
config.EnableCors(corsAttr);
...
The EnableCorsAttribute constructor accepts a 4th string parameter to globally allow any additional headers:
var corsAttr = new EnableCorsAttribute("http://localhost:4200", "*", "*", "X-Foo, X-Bar, X-Baz");

Resources