React-Native fetch post with encodeURIComponent value - react-native

I am going to use fetch to post
const token = 'ABCD123:A'
await fetch(path, {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
body: token=encodeURIComponent(token),
});
encodeURIComponent(token) should be ABCD123%3AA
My server should get encoded value, decode value and then store to DB.
But in my api server, it gets non-encode body: token=ABCD123:A
Should server gets encoded value?
And I have tested same encoded value on Postman, my server is getting encoded value.
As my server gets different value, is it Fetch API problem or my fetch request issue?


I think you forgot to make Object for Body,
const token = 'ABCD123:A'
await fetch(path, {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
body: {
'token':encodeURIComponent(token)
}
});

Related

How to handle the plain/text POST request in the cypress

I have a postman collection and It's POST call and the request body is type of plain/text and I just want to automate this using cy.request but I'm not sure how to pass the test body in the cy.request body section and it returned 400 bad request if I run the below code.
cy.request({
url: `${url}/user`,
method: "POST",
headers: {
'Content-Type': 'plain/text'
},
body: {
"confirmEmail": "true"
}
}).then(res =>{
cy.task('log',"Email id "+res.body.emailAddress);
return res.body;
});
}
The above request return .json response but the input request if text format and the same working fine in the postman tool.
Passing the request body in the below format in the postman tool and its working fine.
confirmEmail=true

My assumption is in the request body our endpoint is expecting a boolean value, but you are passing a string. So changing "confirmEmail": "true" to "confirmEmail": true should work.
cy.request({
url: `${url}/user`,
method: 'POST',
headers: {
'Content-Type': 'plain/text',
},
body: {
confirmEmail: true,
},
}).then((res) => {
cy.log(res.body.emailAddress) //prints email address from response body
})
In case you need to pass parameters in your URL you can directly use qs
cy.request({
url: `${url}/user`,
method: 'POST',
qs: {
confirmEmail: true,
},
headers: {
'Content-Type': 'plain/text',
},
}).then((res) => {
cy.log(res.body.emailAddress) //prints email address from response body
})

How to run GraphQL request in Pre-Request Script section in postman?

I want to run a query before the actual request runs and get a value from the pre-request response and set it in a collection variable.
I have a problem running the following as I used to do it while testing REST APIs.
This is what I tried to do
const getUserBeforeUpdate = {
url: pm.environment.get("base-url"),
method: 'POST',
header: {
'content-type': 'application/json',
'Authorization': `Bearer ${pm.environment.get("token")}`},
body: JSON.stringify({query: '{ user { profile {id} } }'})
};
pm.sendRequest(getUserBeforeUpdate, function(err, response) {
pm.expect(response.code).to.eql(200);
// set collection variable from the response
});
but I get a console error stating
There was an error in evaluating the Pre-request Script: Error: Unexpected token u in JSON at position 0
What's the right way to chain requests in graphql?

Collection variable are accessible via collectionVariables. This should work for you:
const getUserBeforeUpdate = {
url: pm.collectionVariables.get("base-url"),
method: 'POST',
header: {
'content-type': 'application/json',
'Authorization': `Bearer ${pm.collectionVariables.get("token")}`},
body: JSON.stringify({query: '{ user { profile {id} } }'})
};
pm.sendRequest(getUserBeforeUpdate, function(err, response) {
pm.expect(response.code).to.eql(200);
// set collection variable from the response
});

I was able to fix this by changing the url value to the actual url directly as a string. I'm not sure why getting the variable from environment didn't work yet.

I don't have the ability to run you request but would this work?
const getUserBeforeUpdate = {
url: `${pm.environment.get("base-url")}`,
method: 'POST',
header: {
'content-type': 'application/json',
'Authorization': `Bearer ${pm.environment.get("token")}`},
body: JSON.stringify({
query: 'query { user { profile { id } } }'
})
};
pm.sendRequest(getUserBeforeUpdate, function(err, response) {
pm.expect(response.code).to.eql(200);
// set collection variable from the response
});

How to send POST request with empty key and value as object in react native

I'm trying to send request to get data but API needs value as an object and empty key (not null)
Every post request must be sent as application/x-www-form-urlencoded And must send all the data through a single object. The key must be empty
This is how i can send request via postman
POST: http://www.car.go.th/api/MobileApp/getModelCar
Headers: Key = Content-Type , Value = application/x-www-form-urlencoded
Body: Key = , Value = {"brand":"CHEVROLET","BodyType":"2040050811314debb706d02b33eca8e7"}
This is my react-native code
fetch('http://www.car.go.th/api/MobileApp/getModelCar', {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: JSON.stringify({
'': { "brand": "CHEVROLET","BodyType":"2040050811314debb706d02b33eca8e7"}
}),
})
I got error response "Value cannot be null.\r\nParameter name: value" because API only accept empty key which my code have ' ' before :{"brand":"CHEVROLET"...}

This worked for me check, Add your api in global
var postValues = {
brand: "CHEVROLET",
BodyType: 2040050811314debb706d02b33eca8e7
}
fetch(`${Global.APIUrl}`, {
method: 'POST',
body: JSON.stringify(postValues)
}).then(res => res.json())
.then(
(result) => {
"YOUR CONDITIONS from result"
}
)

How do i get the status of my response when using fetch in react-native?

I am making Log In page for my react native application. My api sends different response when my username and password are valid and invalid. So I want to track and save the status of my response in some state variable and then later perform function accordingly. Please suggest me way to do that.
doSignUp() {
console.log("inside post api");
fetch('MyApiUrl', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
password: this.state.password,
email:this.state.email,
name: this.state.firstname,
last_name :this.state.last_name,
mobile:this.state.mobile,
ssn:"2222222"
})
}).then((response) => {console.log('response:',response.status);
response.json()}
.then((responseData) => {
console.log("inside responsejson");
console.log('response object:',responseData)
console.log('refresh token:',responseData[0].token.refresh_token)
console.log('access token:',responseData[0].token.access_token);
}).done();
}

As far as I understand you want to know the http status code of your fetch request.
Usually your response object includes a "status" property. So you should be able to receive the status code by using this:
response.status
In case of a successful request this will return 200.

Post 'x-www-form-urlencoded' content with aurelia-fetch-client

The question is simple: how do I post x-www-form-urlencoded content with Aurelia Fetch client?
I need to make the post to a simple ASP.NET Web API server that is using OWIN and Katana for authentication.
An example of what I have already tried:
var loginDTO = new FormData();
loginDTO.append('grant_type', 'password');
loginDTO.append('email', 'test');
loginDTO.append('password', 'test');
return this.http
.fetch(config.router.token, {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
body: loginDTO
});
Obviously, that didn't work as intended. How is the correct way to go about posting the data presented in the example?

The aurelia-fetch-client is built on Fetch specification, and it seems that Fetch always sends FormData as Content-Type: multipart/form-data.
To get around this, you have to convert the parameters to a query string and then set the content-type to x-www-form-urlenconed. You can use jQuery or a custom function to convert the object to a query string. Like this:
//jQuery.param returns something like ?param=1&param2=2 and so on
//params = a plain javascript object that contains the parameters to be sent
this.http.fetch(url, {
body: $.param(params),
method: 'post',
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
})
.then(response => response.json())
.then(response => {
//your magic here
});
Not a good solution, I know, but that's the easiest way I found so far.

You would use FormData like this:
function sendForm() {
var formData = new FormData();
formData.append('email', 'test#test.com');
formData.append('password', '123456');
http.post(url, formData);
}