http.post problem after Flutter 2 upgrade - flutter

I have just updated to Flutter 2. I updated all the dependencies including http. Now I have a problem with the following:
Future<UserLogin> fetchStaff(String pUserName, String pPassword) async {
final response = await http
.post(Uri.encodeFull('$kBaseUrl/LoginService/CheckLogin'),
headers: {'Content-Type': 'application/json', 'Accept': 'application/json'},
body: '{ "pUser": "$pUserName", "pPassword": "$pPassword"}')
.timeout(Duration(seconds: kTimeOutDuration));
I'm getting an error on the: Uri.encodeFull('$kBaseUrl/LoginService/CheckLogin'
"The argument type 'String' can't be assigned to the parameter type 'Uri'."
$kBaseUrl = 'https://subdom.mydomain.com:443/mobile';
What do I need to change?

Post method used to take string previously, now they have modified to Uri
so used, Uri.parse to get the uri
.post(Uri.parse(Uri.encodeFull('$kBaseUrl/LoginService/CheckLogin'))

Like the error says, this is because post function expects a Uri and you have passed a String (returned by Uri.encodeFull) to it. You need to use Uri.parse to pass a Uri to it.
final response = await http
.post(Uri.parse('$kBaseUrl/LoginService/CheckLogin'),

If you had a String, such as:
String strUri="${yourBaseUrl}/yourPath/yourFile";
Using
http.post(Uri.parse(strUri),
headers: {...},
body: {...},
);
is enough to get all working back.
You may try Uri.tryParse(strUri) to handle null if the uri string is not valid as a URI or URI reference.

Related

Dart TypeError : type 'JSString' is not a subtype of type 'int' for a Http POST request

I'm building an application using flutter where the user provides a string and a set of values must be returned.
I'm unable to figure out what is the cause for the issue.I tried all the solutions provided to the questions similar to this issue but weren't successful.Any help would be really appreciated.
I converted the actual code to dart only, for easy testing online using dartpad.
import 'dart:convert' as convert;
import 'package:http/http.dart' as http;
final body = <String, String>{
"id": '1',
"language": "en",
"text": "I love this service",
};
final headers = <String, String>{
"content-type": "application/json",
"X-RapidAPI-Key": "7f980b3d2cmsh1d666b571febd6ep11df80jsna27f76c06e6b",
"X-RapidAPI-Host": "big-five-personality-insights.p.rapidapi.com",
};
void main(List<String> arguments) async {
final response = await http.post(
Uri.parse('https://big-five-personality-insights.p.rapidapi.com/api/big5'),
headers: headers,
body: [
convert.jsonEncode(body),
],
);
if (response.statusCode == 201) {
// If the server did return a 201 CREATED response,
// then parse the JSON.
print('success');
print(convert.jsonDecode(response.body));
} else {
// If the server did not return a 201 CREATED response,
// then throw an exception.
print('fail');
throw Exception('Failed to get a response.');
}
}
You have a bad value for the body argument of http.post.
The documentation for the method states:
body sets the body of the request. It can be a String, a List or a Map<String, String>. [...] If body is a List, it's used as a list of bytes for the body of the request.
Since the API you are talking to requires an array to be sent, you want to wrap the body in a list before converting it all to json (note how the brackets have shifted inside the convert method:
final response = await http.post(
Uri.parse('https://big-five-personality-insights.p.rapidapi.com/api/big5'),
headers: headers,
body: convert.jsonEncode([body]),
);
Sidenote: The API responds with statusCode 200 on a successful request, not 201; at least in my testing.
The body parameter of a post method sets the body of the request. It can be a String, a List or a Map<String, String>. If it's a String, it's encoded using encoding and used as the body of the request. The content-type of the request will default to "text/plain".
As you passed it as a List, then it expects it to be a List of integers, but you are passing it a List type (or in this specific case List type). Here is a fixed code.
final response = await http.post(
Uri.parse('https://big-five-personality-insights.p.rapidapi.com/api/big5'),
headers: headers,
body: convert.jsonEncode(body),
);

Why put flutter returning bad request?

I am making a mobile app using Flutter & Dart. I have a put request that updated a database. The request keeps giving a bad request 400. The code is as follow:
Future<void> updateStudent(int id, Student newStudent) async {
var res = await http.put(
Uri.parse('https://10.0.2.2:7030/api/Student/{id}?Id=7'),
headers: {
"Accept": "application/json",
"content-type": "application/json"
},
body: json.encode({
'id': newStudent.id,
'dep_id': newStudent.depId,
'name_ar': newStudent.nameAr,
'name_en': newStudent.nameEn,
'name_moth': newStudent.nameMoth,
'birth': newStudent.birth,
}));
}
I tried many suggestions. Also I tried to do the request this way code. But same issue.
The API is working just fine with postman but for some reason it does not with Flutter. I postman I used query params and body with raw json There is something wrong but I am not able to find it.
Any idea or suggestions?
Update
I debugged the request and it showing an error on "BodyField" stating the Bad state: Cannot access body fields of a Request without "content-type : application/x-www-form-urlencoded
Even though I am using json.
I also tried to change the content type but it is giving unsupported media type.
in postman I am using put method with this url
https://localhost:7030/api/Student/{id}?Id=7
Change your url and body to this:
var url = Uri.https('https://10.0.2.2:7030', 'api/Student/{id}');
var res = await http.put(
url,
headers: {
"Accept": "application/json",
"content-type": "application/json"
},
body: {
'id': newStudent.id,
'dep_id': newStudent.depId,
'name_ar': newStudent.nameAr,
'name_en': newStudent.nameEn,
'name_moth': newStudent.nameMoth,
'birth': newStudent.birth,
});
you already add id in body, no need to put it in url too.

How to make a POST request with httpclient in net core and javascript

Im having a very bad time triying to figure out this problem, I have a web API made in net core 6 with Entity Framework, in this web api I have to consume a third party API. If a try to make a POST request directly the Swagger UI it works perfectly:
POST in Swagger
HOWEVER, if i made a post request in javascript using fetch it return a 400 error, that to be honest doesn't say much:
400 error response
I know there is no missing data in my post request, I checked a lot, in fact there is no field call "data".
Here is the code to make a fetch in the frontend:
return fetch(apiURL, {
method: 'POST',
headers: {
'Content-Type': 'text/plain',
},
body: JSON.stringify(data)
})
.then(response => response.json())
Here is the post method in net core
[HttpPost]
public async Task<string> PostProductAsync(string data)
{
HttpResponseMessage response = await _client.PostAsync(path, new StringContent(data, Encoding.UTF8, "application/json"));
response.EnsureSuccessStatusCode();
var json = await response.Content.ReadAsStringAsync();
return json;
}
I'm a bit confused. What could i be doing wrong.
UPDATE
I followed each instruction in the answers section, and I can say that it makes a lot of sense to put [FromBody] in the POST method since in the fetch method I am sending the data in the body.
However this led me to a new parsing error: parsing error after POST request
I have been searching in other forums about this error, it seems that what is recommended in this case is to make a class Unexpected character encountered while parsing value: . Path '', line 1, position 1
Now, the problem that i have with this approach its that i have quite a big json to post, witch means that i will have to create a lot of classes to make this possible. Its there any way to this without creating a class?
So far i tried the following changes in the POST method:
Adding [FromBody]
[HttpPost]
public async Task<string> PostProductAsync([FromBody] string data)
{
HttpResponseMessage response = await _client.PostAsync(path, new StringContent(data, Encoding.UTF8, "application/json"));
response.EnsureSuccessStatusCode();
var json = await response.Content.ReadAsStringAsync();
return json;
}
This one leads to the parsing error mentioned before.
Adding [FromBody] and changing string to object
[HttpPost]
public async Task<string> PostProductAsync([FromBody] object data)
{
HttpResponseMessage response = await _client.PostAsync(path, new StringContent(data.ToString(), Encoding.UTF8, "application/json"));
response.EnsureSuccessStatusCode();
var json = await response.Content.ReadAsStringAsync();
return json;
}
This one leads to a non valid JSON is not a valid JSON error
Your Swagger UI is sending your data as a Query parameter, but you are trying to post it through body in your fetch. They are two different methods of post. I recommend you use body only.
Change your controller method to use the [FromBody] parameter attribute:
PostProductAsync([FromBody] string data)
More information from https://learn.microsoft.com/en-us/aspnet/web-api/overview/formats-and-model-binding/parameter-binding-in-aspnet-web-api#using-frombody
Defaults for a string, in your case:
If the parameter is a "simple" type, Web API tries to get the value from the URI. Simple types include the .NET primitive types (int, bool, double, and so forth), plus TimeSpan, DateTime, Guid, decimal, and string, plus any type with a type converter that can convert from a string. (More about type converters later.)
So the default behavior is what Swagger is currently using.
Since you want to pass json type data,you need to use 'Content-Type': 'application/json' in fetch,and then use [FromBody]in action.
fetch:
return fetch(apiURL, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(data)
})
.then(response => response.json())
action:
[HttpPost]
public async Task<string> PostProductAsync([FromBody]string data)
{
HttpResponseMessage response = await _client.PostAsync(path, new StringContent(data, Encoding.UTF8, "application/json"));
response.EnsureSuccessStatusCode();
var json = await response.Content.ReadAsStringAsync();
return json;
}
In your case, you can bind model in two ways.
Simple type model binding approach
Since you are accepting simple type string value in controller, you can use 'Content-Type': 'application/x-www-form-urlencoded' in fetch and you can pass parameter data in the URL as following:
At fetch:
let apiURL = `https://localhos:8080/Test/data`;
return fetch(apiURL, {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: null
}).then(response => response.json())
Complex type model binding approach
Let's assume you're now posting complex object type data. To post data from request body Content-Type should be application/json. And add [FromBody] in the action to define the location to get data from request. Here's the example code snippet.
At fetch:
return fetch(apiURL, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(data)
}).then(response => response.json())
At controller:
[HttpPost]
public async Task<string> PostProductAsync([FromBody]string data)
{
HttpResponseMessage response = await _client.PostAsync(path, new StringContent(data, Encoding.UTF8, "application/json"));
response.EnsureSuccessStatusCode();
var json = await response.Content.ReadAsStringAsync();
return json;
}
On a side note, please avoid using text/plain as Content-Type to avoid security issues.
Hope this helps you and here's for your further reference for model binding in ASP.NET Core.

How to set the responseType in the dio api call using retrofit in flutter?

I am trying to set the response type in one of an API call to bytes, but in retrofit I am not finding any option to set the response type.
I am using dio as http client.
#GET(API.blah_blah)
// I want to set the response Type I want to get, instead of json I need bytes
Future<dynamic> getSomething();
something like this in the generated file.
final _result = await _dio.request('some api url',
queryParameters: queryParameters,
options: RequestOptions(
method: 'GET',
// responseType: ResponseType.bytes,// this I have manually added
extra: _extra,
baseUrl: baseUrl),
data: _data);
Try this:
#GET(API.blah_blah)
#DioResponseType(ResponseType.bytes)
Future<HttpResponse<List<int\>>> getSomething();

Converting my Postman Call to Dart/Flutter API Call

I hope to use nutritionix api to get food information for the users of my application, I manage to get the call to work in Postman, however I cannot convert it to dart code. I am getting this error: '{message: Unexpected token " in JSON at position 0}'
Here is my (POST) postman call:
Here is my attempt at converting that to dart code:
Future<void> fetchNutritionix() async {
String url = 'https://trackapi.nutritionix.com/v2/natural/nutrients';
Map<String, String> headers = {
"Content-Type": "application/json",
"x-app-id": "5bf----",
"x-app-key": "c3c528f3a0c68-------------",
"x-remote-user-id": "0",
};
String query = 'query: chicken noodle soup';
http.Response response =
await http.post(url, headers: headers, body: query);
int statusCode = response.statusCode;
print('This is the statuscode: $statusCode');
final responseJson = json.decode(response.body);
print(responseJson);
//print('This is the API response: $responseJson');
}
Any help would be appreciated! And, again thank you!
Your postman screenshot shows x-www-form-urlencoded as the content-type, so why are you changing that to application/json in your headers? Remove the content type header (the package will add it for you) and simply pass a map to the body parameter:
var response = await http.post(
url,
headers: headers,
body: {
'query': 'chicken soup',
'brand': 'acme',
},
);
Also you can now generate Dart code (and many other languages) for your Postman request by clicking the Code button just below the Save button.
click the three dotes button in request tab and select code option then select your language that you want convert code to
review the query you're posting
your Postman input is x-www-form-urlencoded instead of plain text
String query = 'query: chicken noodle soup';
why don't you try JSON better
String query = '{ "query" : "chicken noodle soup" }';