I'm trying to post data using axios.
handleAddClickAxios = (token, title, text, category, creationDate) => {
const api = "http://localhost:3000/tasks/";
console.log("login clicked");
let data = JSON.stringify({
title: title,
text: text,
category: category,
creationDate: creationDate,
done: false
});
console.log(data);
axios.post(api, data, {
headers: {
Authorization: `Bearer ${token}`,
"Content-Type": "application/json"
}
});
};
Now I have 400 error, in some options I got Unauthorized error. I tried many times, but i failed.
Console:
Apptask -
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJfaWQiOiI1ZGNmZjFhMjQzZWUwNTJmNmNkMjAzYzgiLCJpYXQiOjE1NzQ1ODQzMDl9.P9cKtljoFXbCo6X540tQ27d_jeouOwwRJ6HKhpsy-PY
asdad
App.js:100 login clicked
App.js:108
{"title":"asdad","text":"aaaaaaaaaa","category":"","creationDate":"2019-10-0,
9:31","done":false} :3000/tasks/:1 POST http://localhost:3000/tasks/
400 (Bad Request)
Request details in devtools:
You need to send data without JSON.stringify like this:
let data = {
title,
text,
category,
creationDate,
done: false
};
Also your creationData is not valid, it must be in this format:
"2019-11-24T09:06:29.271Z"
Related
I'm trying to receive an access token from the Zoom api via Oauth. No matter what form I try and send the body as, 'Content-Type': 'application/json' or Content-Type:application/x-www-form-urlencoded, it always errors to { reason: 'Missing grant type', error: 'invalid_request' }.
var options = {
method: "POST",
url: "https://zoom.us/oauth/token",
body: JSON.stringify({
grant_type: "authorization_code",
code: process.env.AUTH_CODE,
}),
redirect_uri: "https://zoom.us",
};
var header = {
headers: {
Authorization:
"Basic " +
Buffer.from(process.env.ID + ":" + process.env.SECRET).toString("base64"),
},
"Content-Type": "application/json",
};
var tokCall = () =>
axios
.post("https://zoom.us/oauth/token", options, header)
.then((response) => {
console.log(response);
})
.catch((error) => {
console.log(error.response);
});
tokCall();
I'm fairly certain the answer lies in either the data type in which Oauth is receiving the data, or where/if it's receiving the body at all. Any suggestions would be gratefully received.
The error is being thrown because you're sending the data as the body of the post request when the Request Access Token Zoom API is expecting to find them as query parameters which you might know as query strings.
Reference
https://marketplace.zoom.us/docs/guides/auth/oauth#local-test
Image of page from link to highlight the use of query parameters and content-type requirement for API call
Change
var options = {
method: "POST",
url: "https://zoom.us/oauth/token",
body: JSON.stringify({
grant_type: "authorization_code",
code: process.env.AUTH_CODE,
}),
redirect_uri: "https://zoom.us",
};
to
var options = {
method: "POST",
url: "https://zoom.us/oauth/token",
params: {
grant_type: "authorization_code",
code: process.env.AUTH_CODE,
redirect_uri: "<must match redirect uri used during the app setup on zoom>"
},
};
The Content-Type header should be set to application/x-www-form-urlencoded as this is a requirement of the zoom API itself.
BTW, axios requires you to name the body field/object of your request as data and also there's no need for JSON.stringify() method since axios does that for you under-the-hood
Though it's a late answer, I'd like to share it since it took me some time to complete this using Axios.
So to make Zoom authorization, you need to do:
Base64 encode the secret and client id
const base64EncodedBody =
Buffer.from(`${ZOOM_CLIENT_ID}:${ZOOM_CLIENT_SECRET}`).toString('base64');
URI encode the grant_type, code and redirect_uri
const data =
encodeURI(`grant_type=authorization_code&code=${code}&redirect_uri=${redirectUri}`);
Send the request
const response = await axios.post('https://zoom.us/oauth/token', data, {
headers: {
Authorization: `Basic ${base64EncodedBody}`,
'Content-Type': 'application/x-www-form-urlencoded',
'Content-Length': Buffer.byteLength(data),
},
});
I am trying to make a login authentication in angular, in which when we are entering email id and password we are getting a token. So for authentication, we have to send that header in the api get request but i am not able to do it.
My code is shown below
onSubmit(form:NgForm) {
this.http.post('https://pikreview.com/rest/user.php?f=authenticate',
JSON.stringify({
email: "a#gmail.com",
password: "12345"
})
).subscribe(res => {
localStorage.setItem('token', res.token);
var authToken = localStorage.getItem('token');
console.log("token is " + authToken);
var headers: HttpHeaders = new HttpHeaders({
'token': `${authToken}`,
'Access-Control-Allow-Credentials': true,
});
var req = new HttpRequest('GET',
'https://www.pikreview.com/rest/user.php', {
headers: headers,
withCredentials: true
}
);
this.http.request(req).subscribe(data => {
console.log(data);
})
}, error => {
console.log("something went wrong");
});
}
And one thing i have seen that whenever i pass token header there is something set-cookie generated which has token value on authentication page but on profile page it is not getting the same token and i think therefore it is showing invalid token.So,if anyone knows something about it and can solve my problem,please reply as soon as possible.
You just simple call the api with ur custom header, use HttpHeaders like this:
const httpOptions = {
headers: new HttpHeaders({
'Authorization': "YOUR_TOKEN"
})
}
this.http.get('http://localhost:5000/getUser',httpOptions)
How can i return the result of post method in api and also 201 status code? In this code the status code is 200 how can i change it to 201?
var request = require('request');
request({
method: 'POST',
url: 'URLPATH',
headers: {
'Content-Type': 'application/json',
'Authorization': 'Basic Key'
},
body: {
"id":"1","message":"I am Good Developer."
}
}, function (error, response, body) {
console.log('Status:', response.statusCode); //get 201 status but received 200
console.log('Headers:', JSON.stringify(response.headers));
console.log('Response:', body);
});
Here you are calling a web service, is the web service that respond with 200 and not 201.
You need to change the web service code, no the client code.
I'm trying to send a http request to Githubs graphql api(v4). My guess is that the format of my query is wrong. The code below is used to send a POST request to the api.
app.get('/fetch-data', function(req, res, next) {
const access_token = settings.dev.TOKEN;
const query = {query: { viewer: { 'login': 'muckbuck' } }};
const options = {
uri: 'https://api.github.com/graphql',
method: 'POST',
headers: {
'Accept': 'application/json',
'Authorization': "Bearer " + access_token,
'User-Agent': 'request',
'contentType': "application/graphql",
},
data: query
};
function callback(error, response, body) {
console.log(response.body)
if (!error && response.statusCode == 200) {
console.log(body);
console.log('lol');
}
}
request(options, callback);
});
The error message that I get:
{"message":"Problems parsing JSON","documentation_url":"https://developer.github.com/v3"}
I believe your GraphQL is malformed in that the query key is supposed to contain a string, not a complex structure. See also this example from the GitHub API documentation.
You may also want to set Content-Type to application/json as is recommended by the GraphQL introduction. application/graphql does not seem to be a registered media type and appears to alter the behaviour of GraphQL.
I have error meantime angular2 post rest data to NodeJS backend.
I see POST is done, server is LOG correct data, but error is showing up on browser.
An error occurred:
SyntaxError: JSON.parse: unexpected end of data at line 1 column 1 of the JSON data
My NG2 call and service:
onSubmit(form:FormGroup) {
let userform: FormGroup = form.value;
console.log("userform: ", userform);
if (form.valid) {
console.log(form.value);
this.appService.signIn(userform)
.subscribe(form => console.log('subscribe: ', form))
} else {
console.log("Form is not VALID!");
}
}
SERVICE:
signIn(dataUser: Object): Observable<User> {
dataUser = JSON.stringify(dataUser);
debugger;
let headers = new Headers({
'Content-Type': 'application/json',
'Access-Control-Allow-Origin': 'http://127.0.0.1:3005'
});
let options = new RequestOptions({ headers: headers });
console.log("data: ", dataUser, "\nHeaders: ", headers);
return this.http
.post( this.signInUrl, dataUser, options)
.map( (res:Response) => res.json().data || { } as User )
.catch(this.handleError);
}
and nodeJS:
app.post('/login', function (req, res) {
console.log("Recived login request!");
console.log("Request: ", req.body);
res.header({
'Content-Type': 'application/json',
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'GET,PUT,POST,DELETE',
'Accept': 'q=0.8;application/json;q=0.9'
})
res.end();
});
In post we have: "{"username":"username","password":"password"}".
What I'am making wrong? Please for help or solution.
Awwwww. That was my bad, Take care of your NodeJS Server response. After get POST, should be sended any res.json({status: "OK"}) or sommething similar, to get response. This error was not because of Angular2, but because of NodeJS. Browser get empty response from nodeJS, or it was not JSON format.