Develop Reference

Network Error on formdata POST request React Native

I always get an Error: Network Error when trying to send a formData post request with axios. I tried to use fetch, xmlhttprequest, upgrade and downgrade axios/react-native... but no success. The thing is that sending the same content body on Insomnia/Postman returns a successful 200. Maybe it is something with the react-native way of creating/formatting a formData.
axios: 0.27.2
react-native: 0.64.2
react: 16.13.1
const sendAnswer = async () => {
if (!validateForm()) return false;
setPostLoading(true);
const body = new FormData();
const answersData = answers;
answersData.forEach((answerData) => {
const newAnswer = answerData;
const { tipo_dado: type, resposta: answer } = newAnswer;
if (type === 'imagem' || type === 'assinatura') {
body.append(newAnswer.sub_id, {
name: answer.name,
uri: answer.uri,
type: answer.type,
});
delete newAnswer.resposta;
}
return newAnswer;
});
body.append('formulario_id', formData._id);
body.append('respostas', answersData);
body.append('usuario_id', userData.id);
try {
const formResponse = await api.post(API_ANSWERS, body, {
headers: {
Accept: 'application/json',
'Content-Type': 'multipart/form-data;',
},
transformRequest: (data) => data,
});
} catch (error) {
console.log(error)
} finally {
setPostLoading(false);
}
};
edit: error object
{
"message": "Network Error",
"name": "AxiosError",
"config": {
"transitional": {
"silentJSONParsing": true,
"forcedJSONParsing": true,
"clarifyTimeoutError": false
},
"transformResponse": [
null
],
"timeout": 5000,
"xsrfCookieName": "XSRF-TOKEN",
"xsrfHeaderName": "X-XSRF-TOKEN",
"maxContentLength": -1,
"maxBodyLength": -1,
"env": {
"FormData": null
},
"headers": {
"Accept": "application/json",
"Content-Type": "multipart/form-data",
"Authorization": "secret_token_here"
},
"baseURL": "https://server.com.br",
"method": "post",
"url": "https://server.com.br/api-mobile/",
"data": {
"_parts": [
[
"6256b36ad1d2220009e9d6b1",
{
"name": "rn_image_picker_lib_temp_6dc1b2ae-f170-4f9a-b763-d4be94ccbcd7.jpg",
"uri": "file://data/user/0/br.com.rotaexata.rastreador/cache/rn_image_picker_lib_temp_6dc1b2ae-f170-4f9a-b763-d4be94ccbcd7.jpg",
"type": "image/jpeg"
}
],
[
"6256b36ad1d2220009e9d6b2",
{
"name": "image-1657132824768.png",
"uri": "file://data/user/0/br.com.rotaexata.rastreador/cache/image-1657132824768.png",
"type": "image/png"
}
],
[
"formulario_id",
"6256b36ad1d2220009e9d6b3"
],
[
"respostas",
[
{
"pergunta": "Qual a data?",
"tipo_dado": "data",
"options": [],
"obrigatorio": 0,
"sub_id": "6256b36ad1d2220009e9d6af",
"resposta": "2022-07-19"
},
{
"pergunta": "Qual o horário?",
"tipo_dado": "hora",
"options": [],
"obrigatorio": 0,
"sub_id": "6256b36ad1d2220009e9d6b0",
"resposta": "19:34"
},
{
"pergunta": "Insira uma imagem ",
"tipo_dado": "imagem",
"options": [],
"obrigatorio": 1,
"sub_id": "6256b36ad1d2220009e9d6b1"
},
{
"pergunta": "Assine por favor",
"tipo_dado": "assinatura",
"options": [],
"obrigatorio": 1,
"sub_id": "6256b36ad1d2220009e9d6b2"
}
]
],
[
"usuario_id",
26523
]
]
}
},
"code": "ERR_NETWORK",
"status": null
}
edit2: error response
{
"UNSENT": 0,
"OPENED": 1,
"HEADERS_RECEIVED": 2,
"LOADING": 3,
"DONE": 4,
"readyState": 4,
"status": 0,
"timeout": 5000,
"withCredentials": true,
"upload": {},
"_aborted": false,
"_hasError": true,
"_method": "POST",
"_perfKey": "network_XMLHttpRequest_1011",
"_response": "Unrecognized FormData part.",
"_url": "https://server.com.br/api-mobile/",
"_timedOut": false,
"_trackingName": 1011,
"_incrementalEvents": true,
"_performanceLogger": {
"_timespans": {
"network_XMLHttpRequest_1001": {
"startTime": 1493.8999999985099,
"endTime": 1701.8999999985099,
"totalTime": 208
},
"network_XMLHttpRequest_1002": {
"startTime": 1793,
"endTime": 3764.7999999970198,
"totalTime": 1971.7999999970198
},
"network_XMLHttpRequest_1003": {
"startTime": 1793.699999999255,
"endTime": 2188.5,
"totalTime": 394.80000000074506
},
"network_XMLHttpRequest_1004": {
"startTime": 1794.199999999255,
"endTime": 2632.7999999970198,
"totalTime": 838.5999999977648
},
"network_XMLHttpRequest_1005": {
"startTime": 1928.5,
"endTime": 2613.89999999851,
"totalTime": 685.3999999985099
},
"network_XMLHttpRequest_1006": {
"startTime": 2057.7999999970198,
"endTime": 2880.39999999851,
"totalTime": 822.6000000014901
},
"network_XMLHttpRequest_1007": {
"startTime": 4016.699999999255,
"endTime": 4833.199999999255,
"totalTime": 816.5
},
"network_XMLHttpRequest_1008": {
"startTime": 4017.099999997765,
"endTime": 4855.599999997765,
"totalTime": 838.5
},
"network_XMLHttpRequest_1009": {
"startTime": 4017.5,
"endTime": 4882.89999999851,
"totalTime": 865.3999999985099
},
"network_XMLHttpRequest_1010": {
"startTime": 9463.79999999702,
"endTime": 9774.199999999255,
"totalTime": 310.4000000022352
},
"network_XMLHttpRequest_1011": {
"startTime": 49170.599999997765
}
},
"_extras": {},
"_points": {
"initializeCore_start": 914.2999999970198,
"initializeCore_end": 935.2999999970198
},
"_pointExtras": {},
"_closed": false
},
"_requestId": null,
"_headers": {
"accept": "application/json",
"content-type": "multipart/form-data",
"authorization": "secret_token_here"
},
"_responseType": "",
"_sent": true,
"_lowerCaseResponseHeaders": {},
"_subscriptions": []
}

I solved it. This comment helped me.
When you want to append objects to the formData you need to convert them to JSON, so I converted the main array of objects with JSON.stringify(answersData)
body.append('formulario_id', formData._id);
body.append('respostas', JSON.stringify(answersData));
body.append('usuario_id', userData.id);

In react-native way of creating/formatting a formData works like everywhere.
Anyway let's try to check this:
If you make query to a remote server, make sure you use https format.
If you make query to a local server on android simulator try use "http:// 10.0.2.2:8000/" instead "http:// localhost:8000/" format.
And seems you did mistake in the row: 'Content-Type': 'multipart/form-data;', Try to remove semicolon.
If that won't help you, send me the full error object.

How do I parse the realtor api data to show property data (Realtor API/Rapid)?

’m trying to parse the response data to view property data. However, I searched through all the properties in the response data but none seemed to hold property data.
For anybody who isn’t familiar with realtor API this is the site I’m talking about. The data shows the exact way I want to receive mine
https://rapidapi.com/apidojo/api/realtor/endpoints
fetch("https://realtor.p.rapidapi.com/properties/v2/list-for-rent?sort=relevance&city=New%20York%20City&state_code=NY&limit=200&offset=0", {
"method": "GET",
"headers": {
"x-rapidapi-host": "realtor.p.rapidapi.com",
"x-rapidapi-key": "e5b0286ea4msh1d616284115d5efp16cadcjsn0392ca0398ac"
}
})
.then(response => {
console.log(response.json());
})
.catch(err => {
console.log(err);
});

I was able to use Postman and test this endpoint and found that you likely need to be looking for the properties array and loop through the objects and sub-arrays/objects contained in each parent object of the properties array to get to the details about each property.
Inside of this array are objects that contain the address, latitude, longitude, etc.
I would recommend using Postman if you are not already, doing a GET request when doing so and using the same headers. You should see the same. Using Postman is a great way to test endpoints!
Here is an example of the data that is returned from the results inside of the properties array when hitting your endpoint with a GET request:
"properties": [
...
...
{
"property_id": "R3188507190",
"listing_id": "612930061",
"prop_type": "apartment",
"list_date": "2018-08-20T17:22:00.000Z",
"last_update": "2020-08-25T08:17:00.000Z",
"year_built": 2018,
"listing_status": "active",
"beds": 0,
"prop_status": "for_rent",
"address": {
"city": "Arverne",
"country": "USA",
"county": "Queens",
"lat": 40.589922,
"line": "190 Beach 69th St",
"postal_code": "11692",
"state_code": "NY",
"state": "New York",
"time_zone": "America/New_York",
"neighborhood_name": "Rockaway Peninsula",
"neighborhoods": [
{
"id": "8c06e34c-3044-5621-aea4-b59d9ddde719",
"level": "macro_neighborhood",
"name": "Rockaway Peninsula"
}
],
"lon": -73.79765
},
"client_display_flags": {
"presentation_status": "for_rent",
"is_showcase": true,
"lead_form_phone_required": true,
"price_change": 0,
"has_specials": false,
"is_mls_rental": false,
"is_rental_community": true,
"is_rental_unit": false,
"is_co_star": true,
"is_apartmentlist": false,
"suppress_map_pin": false,
"suppress_phone_call_lead_event": true,
"price_reduced": false,
"allows_cats": true,
"allows_dogs": true,
"allows_dogs_small": true,
"allows_dogs_large": true
},
"agents": [
{
"primary": true
}
],
"lead_forms": {
"form": {
"name": {
"required": true,
"minimum_character_count": 1
},
"email": {
"required": true,
"minimum_character_count": 5
},
"move_in_date": {
"required": true,
"default_date": "2020-09-01T12:00:00Z",
"minimum_days_from_today": 1,
"maximum_days_from_today": 180
},
"phone": {
"required": true,
"minimum_character_count": 10,
"maximum_character_count": 11
},
"message": {
"required": false,
"minimum_character_count": 0
},
"show": false
},
"show_agent": false,
"show_broker": false,
"show_provider": false,
"show_management": false
},
"lot_size": {
"size": 0,
"units": "sqft"
},
"building_size": {
"units": "sqft"
},
"rdc_web_url": "https://www.realtor.com/realestateandhomes-detail/190-Beach-69th-St_Arverne_NY_11692_M31885-07190",
"rdc_app_url": "move-rdc://www.realtor.com/realestateandhomes-detail/190-Beach-69th-St_Arverne_NY_11692_M31885-07190",
"community": {
"baths_max": 1,
"baths_min": 1,
"beds_max": 1,
"beds_min": 1,
"contact_number": "(844) 454-2289",
"id": 1839240,
"name": "The Tides At Arverne By The Sea",
"price_max": 2195,
"price_min": 2195,
"source_id": "46dfexj",
"sqft_max": 659,
"sqft_min": 659
},
"data_source_name": "co-star",
"source": "community",
"page_no": 1,
"rank": 1,
"list_tracking": "type|property|data|prop_id|3188507190|list_id|612930061|comm_id|1839240|page|rank|data_source|co-star|property_status|product_code|advantage_code^1|1|3K2|E8|0^^$0|1|2|$3|4|5|6|7|8|9|G|A|H|B|C|D|I|E|J|F|K]]",
"photo_count": 19,
"photos": [
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f75218736o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f3178227471o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f3306091863o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f1799178643o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f884518299o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f1142482343o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f624998745o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f3641852832o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f2581754924o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f1976580515o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f586291969o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f2803556443o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f3294921843o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f852583007o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f4164216811o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f3902720508o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f850731407o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f2027588413o.jpg"
},
{
"href": "https://ar.rdcpix.com/610e208fe79b9533c5e103166312b312c-f805760224o.jpg"
}
]
},
...
...
]
If the response is not returning the data you expect then it could be that the format of your fetch GET request code is not quite right.
EDIT: In fact, that is exactly the problem I do believe. So, it should probably work if you try to structure your fetch similarly to this:
let url = 'https://realtor.p.rapidapi.com/properties/v2/list-for-rent?sort=relevance&city=New%20York%20City&state_code=NY&limit=200&offset=0';
fetch(url, {
method: 'GET',
headers: {
'Content-Type': 'application/json',
'x-rapidapi-host': 'realtor.p.rapidapi.com',
'x-rapidapi-key': 'e5b0286ea4msh1d616284115d5efp16cadcjsn0392ca0398ac'
}})
.then((response) => {
return response.json();
})
.then((data) => {
console.log(data);
});

How to debug 406 HTTP response in client side JS?

I am making a POST request from my web app to a local instance of elasticsearch. If I run the POST request with curl, I get an appropriate response:
curl -XPOST "http://localhost:9200/my-index/_search" -H'content-type: application/json'
-d'{
"highlight": {
"fragment_size": 200,
"number_of_fragments": 1,
"fields": {
"title": {},
"description": {}
}
},
"_source": [
"id",
"nps_link",
"title",
"description"
],
"aggs": {
"states": {
"terms": {
"field": "states.keyword",
"size": 30
}
},
"world_heritage_site": {
"terms": {
"field": "world_heritage_site"
}
},
"visitors": {
"range": {
"field": "visitors",
"ranges": [
{
"from": 0,
"to": 10000,
"key": "0 - 10000"
},
{
"from": 10001,
"to": 100000,
"key": "10001 - 100000"
},
{
"from": 100001,
"to": 500000,
"key": "100001 - 500000"
},
{
"from": 500001,
"to": 1000000,
"key": "500001 - 1000000"
},
{
"from": 1000001,
"to": 5000000,
"key": "1000001 - 5000000"
},
{
"from": 5000001,
"to": 10000000,
"key": "5000001 - 10000000"
},
{
"from": 10000001,
"key": "10000001+"
}
]
}
},
"acres": {
"range": {
"field": "acres",
"ranges": [
{
"from": -1,
"key": "Any"
},
{
"from": 0,
"to": 1000,
"key": "Small"
},
{
"from": 1001,
"to": 100000,
"key": "Medium"
},
{
"from": 100001,
"key": "Large"
}
]
}
}
},
"query": {
"bool": {
"must": [
{
"match_all": {}
}
]
}
},
"size": 20
}'
Yet, when I make the POST request using fetch, I get the error POST http://localhost:9200/my-index/_search net::ERR_ABORTED 406 (Not Acceptable). How can I view the Accept header format that elastic search is responding with? For reference, my JS code is below:
const response = await fetch("http://localhost:9200/my-index/_search", {
method: "POST",
headers: {
'Content-Type': 'application/json'
},
mode: 'no-cors',
body: JSON.stringify(body),
});
Any thoughts? Thank you!

JSON append response with attribute from link

I have and API endpoint in Zapier where I am calling all approved leave requests from a payroll system. as data.
const options = {
url: 'https://api.somepayroll.com/api/v1/leaves/requests',
method: 'GET',
headers: {
'Accept': 'application/json',
'Authorization': `Bearer ${bundle.authData.access_token}`,
'X-CLIENT-SECRET': bundle.authData.client_secret,
'X-CLIENT-ID': bundle.authData.client_id,
'X-STATUS': bundle.inputData.status
},
params: {
}
}
return z.request(options)
.then((response) => {
response.throwForStatus();
const results = z.JSON.parse(response.content);
// You can do any parsing you need for results here before returning them
return results.content;
});
That gets me the following response:
[
{
"employeeId": "1",
"requestId": 5487,
"hours": 8,
"leaveFromDate": "19-Feb-2020",
"leaveToDate": "19-Feb-2020",
"reason": "Birthday Party",
"status": "Pending",
"payElement": "Annual Leave",
"leaveBalanceType": {
"leaveType": "Annual",
"name": "Annual Leave",
"unit": "hours",
"organisationSpecific": false
},
"payElementId": 50,
"daysConsumed": 0,
"daysCurrent": 0,
"daysRemaining": 0,
"quantityConsumed": 0,
"quantityCurrent": 0,
"quantityRemaining": 8,
"additionalApprovalAcquired": false,
"leaveInDays": false,
"links": [
{
"rel": "self",
"href": "https://api.somepayroll.com/api/v1/leaves/requests/5487"
},
{
"rel": "employee",
"href": "https://api.somepayroll.com/api/v1/employees/1"
},
{
"rel": "payelement",
"href": "https://api.somepayroll.com/api/v1/payelements/AL"
}
],
"id": "5487"
},
{
"employeeId": "1",
"requestId": 5551,
"hours": 8,
"leaveFromDate": "23-Jan-2020",
"leaveToDate": "23-Jan-2020",
"reason": "Camping",
"status": "Pending",
"payElement": "Annual Leave",
"leaveBalanceType": {
"leaveType": "Annual",
"name": "Annual Leave",
"unit": "hours",
"organisationSpecific": false
},
"payElementId": 50,
"daysConsumed": 0,
"daysCurrent": 0,
"daysRemaining": 0,
"quantityConsumed": 0,
"quantityCurrent": 0,
"quantityRemaining": 8,
"additionalApprovalAcquired": false,
"leaveInDays": false,
"links": [
{
"rel": "self",
"href": "https://api.somepayroll.com/api/v1/leaves/requests/5551"
},
{
"rel": "employee",
"href": "https://api.somepayroll.com/api/v1/employees/1"
},
{
"rel": "payelement",
"href": "https://api.somepayroll.com/api/v1/payelements/AL"
}
],
"id": "5551"
}
]
What I am trying to do is also grab the name of the employee from the link in the response https://api.somepayroll.com/api/v1/employees/1 since it is only giving me the ID number. Is is possible to cross link data like that and match on employeeID and get the data called firstName to be part of this result?

it should handle by back-end however you can call link from response and get extra data,

I update the same video ID, but the youtube-api v3 still show "Video not found"

I used google js api Link1and youtube v3 api Link2
I want use js to update my video, the js code for listing videos:
var requestOptions = {
playlistId: playlistId,
part: 'snippet',
//id: ['uY3InyzU79U','nOoHrAR50f8'],
myRating:'like',
maxResults: 9
};
if (pageToken) {
requestOptions.pageToken = pageToken;
pToken=pageToken;
}
var request = gapi.client.youtube.videos.list(requestOptions);
request.execute(somefunction());
The json response:
[
{
"id": "gapiRpc",
"result": {
"kind": "youtube#videoListResponse",
"etag": "\"Wes3wj_Yozi4a9GfHnpc8qG73KI/8qQBat1N6baCDG6C3Eed_XV_sZo\"",
"pageInfo": {
"totalResults": 3,
"resultsPerPage": 9
},
"items": [
{
"id": "nOoHrAR50f8",
"kind": "youtube#video",
"etag": "\"Wes3wj_Yozi4a9GfHnpc8qG73KI/f7JZaoHeZG-CDYzXVRw2Q11Lins\"",
"snippet": {
"publishedAt": "2013-05-30T05:37:50.000Z",
"channelId": "UCx0RClYCMhtsOXRlSyRcuRA",
"title": "Webcam video from May 30, 2013 3:36 PM",
"description": "",
"thumbnails": {
"default": {
"url": "https://i3.ytimg.com/vi/nOoHrAR50f8/default.jpg"
},
"medium": {
"url": "https://i3.ytimg.com/vi/nOoHrAR50f8/mqdefault.jpg"
},
"high": {
"url": "https://i3.ytimg.com/vi/nOoHrAR50f8/hqdefault.jpg"
},
"standard": {
"url": "https://i3.ytimg.com/vi/nOoHrAR50f8/sddefault.jpg"
}
},
"channelTitle": "foretribe1",
"tags": [
"test",
"webcam"
],
"categoryId": "22"
}
}
]
}
}
]
the update video js code:
var requestOptions = {
part:'snippet',
id: String(id),
snippet:{ title: "ok update"}
};
var request = gapi.client.youtube.videos.update(requestOptions);
request.execute(nothing());
the request json：
[{"jsonrpc":"2.0",
"id":"gapiRpc",
"method":"youtube.videos.update",
"params": {
"part":"snippet",
"id":"nOoHrAR50f8",
"snippet":{"title":"ok update"}
},
"apiVersion":"v3"
}]
you can see here the id is the same as the list request json， but I still get the error respond:
[
{
"error": {
"code": 500,
"message": "Video not found",
"data": [
{
"message": "Video not found"
}
]
},
"id": "gapiRpc"
}
]
I also test on Link2, but also get 500 error.

You need wrap your updates in a 'resource' attribute:
gapi.client.youtube.videos.update({
fields: "snippet",
part: "snippet",
resource: {
id: "vid_id",
snippet: {
description: "updating vid",
}
}
});
Remember to set other attributes in the snippet (like categoryId, tags, etc.); otherwise, you'll get another error or they'll be unset.
Probably the best way to do this is to first retrieve the video snippet using gapi.client.youtube.videos.list and alter the snippet, then call gapi.client.youtube.videos.update passing in the altered snippet in the resource attrbute.