I have a fetch request to delete some lists from my backend, but the console is giving me a complaint. The console says "Uncaught (in promise)."
This is my fetch() in the frontend:
const handleClickGarbage = (key) => { // for deleting a grocery list
const temp = loginUserr;
try {
console.log('inside click garbage');
const accessToken = temp.accessToken;
console.log(accessToken);
const param = key;
console.log(param);
fetch(`http://localhost:3010/v0/grocerylists?listName=${param}`, {
method: 'DELETE',
headers: new Headers({
'Authorization': 'Bearer ' + accessToken,
}),
})
.then((results) => {
if (!results.ok) {
throw results;
}
console.log(results);
getCurrentGroceryListTabInfo(); // get the current tab info again because we just updated the info
});
} catch (e) {
console.log(e);
}
};
This is my user.js:
exports.deleteGroceryList = async (req, res) => {
const listNamee = req.query.listName;
const memberIdd = req.userID;
console.log('inside delete gl');
console.log(listNamee);
console.log(memberIdd);
const deleted = await db.deleteGroceryList(listNamee, memberIdd);
console.log('user.js line 286)\n');
console.log(deleted);
if (deleted === null) {
res.status(400).send();
} else {
console.log('user.js line 292)\n');
res.sendStatus(200);
}
};
This is my db.js:
exports.deleteGroceryList = async (listNamee, memberIdd) => {
const listName = listNamee;
const memberId = memberIdd;
const select = 'DELETE FROM grocery_list WHERE list_name = $1 AND member_id = $2 RETURNING *';
const query = {
text: select,
values: [listName, memberId],
};
const {rows} = await pool.query(query);
console.log('db.js line 495)\n');
console.log(rows);
if (rows.length > 0) {
return rows.length;
} else {
return null;
}
};
And this is my openapi.yaml:
/grocerylists:
delete:
description: Deletes a grocery list from user's existing grocery lists'
security:
- bearerAuth: []
parameters:
- name: listName
in: query
description: name of grocery list to delete
schema:
type: string
responses:
200:
description: Removed list from grocery lists successfully
401:
description: Unauthorised
400:
description: Bad Request
content:
application/json:
schema:
$ref: '#/components/schemas/Error'
default:
description: unexpected error
content:
application/json:
schema:
$ref: '#/components/schemas/Error'
I suspect it is something wrong with my api because console.logging results in the front end shows that user.js returned a status code of 200.:
But then the console also says uncaught promise:
You used .then() syntax to handle Promise. When you choose to use .then() syntax, you should catch the error with .catch(), and you don't have that in your code. Just add catch() method to a Promise that fetch returns.
fetch(`http://localhost:3010/v0/grocerylists?listName=${param}`, {
method: 'DELETE',
headers: new Headers({
'Authorization': 'Bearer ' + accessToken,
),
})
.then((results) => {
if (!results.ok) {
throw results;
}
console.log(results);
getCurrentGroceryListTabInfo(); // get the current tab info again because we just updated the info
})
.catch((error) => {
console.log('ERROR: ', error)
});
Related
This code is being used in a Sveltekit web application.
In the first step I get a user jwt token from an api like : dashboard.example.com/auth/local
and in the second step I'm using the response of the first api call to get full information from an api endpoint like this : example.com/api/users/token
This is an endpoint in an Sveltekit application:
import { json as json$1, error } from '#sveltejs/kit';
import axios from 'axios';
import md5 from 'md5';
import { SITE_ADDRESS } from '$lib/Env';
let userToken;
/** #type {import('#sveltejs/kit').RequestHandler} */
export async function POST({ request }) {
const bodyData = await request.json();
let identifier = bodyData.data.identifier;
let password = bodyData.data.password;
let loginToken = bodyData.data.loginToken;
let newLoginToken = md5(identifier + password + process.env.SECURE_HASH_TOKEN);
let dataResult = await axios
.post(`${import.meta.env.VITE_SITE_API}/auth/local`, {
identifier: identifier,
password: password
})
.then((response) => {
return response.data;
})
.then((response) => {
let userSummaryData = response;
userToken = md5(
userSummaryData.user.username + userSummaryData.user.id + process.env.SECURE_HASH_TOKEN
);
let userCompleteData = axios
.post(`${SITE_ADDRESS}/api/users/${userToken}`, {
data: {
userID: userSummaryData.user.id,
username: userSummaryData.user.username
}
})
.then((response) => {
return {
userJWT: userSummaryData.jwt,
userSummary: userSummaryData.user,
userFullSummary: response.data.userFullSummary
};
});
return userCompleteData;
})
.catch((error) => {
// console.log(' ---- Err ----');
});
if (dataResult && newLoginToken == loginToken) {
return json$1(
{
userJWT: dataResult.userJWT,
userSummary: dataResult.userSummary,
userFullSummary: dataResult.userFullSummary
},
{
headers: {
'cache-control': 'private, max-age=0, no-store'
}
}
);
} else if (dataResult && newLoginToken != loginToken) {
throw error(400, 'Something wrong happened');
}
throw error(401, 'Something wrong happened');
}
This code is work perfectly in localhost. But when I test it on host I get error 401.
and the question is :
Why this works on localhost but doesn't work on the server?
How can I improve this kind of promises (I'd like to use the response of the first api call in the second api call and return both
as a result)
I want to make a call to my backend (registerSanctumFacebook method) after a facebook Graph request to get user profile info (email), however I'm getting the following error:
await is only allowed within async functions
Pretty self explanatory, the problem is, I don't know how to make graph start method to work with async-await...
const getInfoFromToken = async (token) => {
const PROFILE_REQUEST_PARAMS = {
fields: {
string: 'email',
},
};
const profileRequest = new GraphRequest(
'/me',
{token, parameters: PROFILE_REQUEST_PARAMS},
(error, user) => {
if (error) {
console.log('login info has error: ' + error);
} else {
//this.setState({userInfo: user});
console.log('user:', user);
}
},
);
new GraphRequestManager().addRequest(profileRequest).start();
let response = await registerSanctumFacebook(user.email,user.id);
};
How I call getTokenInfo method:
const loginWithFacebook = async () => {
LoginManager.logInWithPermissions(['email']).then(
login => {
if (login.isCancelled) {
console.log('Login cancelled');
} else {
AccessToken.getCurrentAccessToken().then(data => {
const accessToken = data.accessToken.toString();
console.log('accessToken',accessToken);
getInfoFromToken(accessToken);
});
}
},
error => {
console.log('Login fail with error: ' + error);
},
);
};
As per your problem statement, I think you should add await on this line
await new GraphRequestManager().addRequest(profileRequest).start();
await will only work if the function after await keyword is also async.
or declare registerSanctumFacebook as async
I know this has been asked many times but what I am facing is a really annoying problem.
I have my server which returns error string with status code 500. When i use axios and catch the error, i can log it easily, but when i return it, i can try everything but its gives me undefined, or it doesn't append anything.
export const submitCheckout = async (betImport, ticket_id, token) => {
const res = await axios({
method: "post",
url: rootUrl + "bets/checkout/" + ticket_id,
headers: {
"x-auth-token": token,
},
data: {
betImport,
},
}).catch(({ response }) => {
console.log(response.status) //this works
return response;
});
return res.data;
};
//HERE I CALL THE FUNCTION
const res = await submitCheckout(sum, ticket_id, token);
//here i can access only the body of the error, even if i try to append something to it.
if (res.ticket_id) {
emptyTicket();
setmodal({
show: true,
title: "SUCCESS",
subtitle: "BET PLACED",
maxwin: `${res.maxWin}`,
ticketId: `${res.ticket_id}`,
account_sum: `${res.account_sum}`,
});
ModifyAccountUser(user, res.account_sum);
} else {
setmodal({
title: "ERROR",
show: true,
status: `${res.status}`,
error: `${res}`,
});
if (res.toString().includes("Token")) history.push("/login");
}
//WHAT I WANT TO DO
export const submitCheckout = async (betImport, ticket_id, token) => {
const res = await axios({
method: "post",
url: rootUrl + "bets/checkout/" + ticket_id,
headers: {
"x-auth-token": token,
},
data: {
betImport,
},
}).catch(({ response }) => {
return {...response, response.status}; //this returns the body only,
return {res: response, status: response.status}; //this crashes,
return response + "-"+ response.status}; //this was my desperation attack and failed as well
});
return res.data;
};
Throw an error and put your response inside it as a string. Then access it in your promise with error.message:
async function foo(){
try{
const res = await ax.post("url", {params})
return res
}
catch(err){
throw new Error("my error message")
}
}
//then
foo()
.then(res=> do stuff)
.catch(err=> err.message)
You can try this.
try {
let res = await Axios({
method: {method},
URL: {url},
data: {body}
});
let data = res.data;
return data;
} catch (error) {
console.log(error.response); // this is the main part. Use the response property from the error object
return error.response;
}
I am running unit test for API call that is serving post request. I am passing request body and must get back response as account data. But I am getting only assertion error
Note: The data is fetched from Azure
spec.js
const accounts=require('./accounts');
const should=require('chai').should();
const chai=require('chai');
const chaiAsPromised=require('chai-as-promised');
chai.use(chaiAsPromised);
chai.should();
....
beforeEach(function()
{
mockResponse=
[
{
"AccountId": "xyz",
"AccountState": "Active"
}
]
it('Should get account from Azure API', function() {
return accounts.getActivatedAccounts(req.body.customerNumber).
should.eventually.equal(mockResponse);
});
**JavascriptFile**
function getActivatedAccounts(accounts) {
let promise = new Promise(function(resolve, reject) {
fetch(Url , { headers: config.headersAPIM})
.then(response => response.json())
.then(accounts => {
if (accounts) {
Accounts[accounts] = [];
for (account in accounts) {
let accountType = accounts[account]['type]'];
Accounts[email].push(accounts[account]);
}
let reply = {
status : "SUCCESS",
data : Accounts[accounts]
}
resolve(reply);
} else {
let reply = {
status : "SUCCESS",
data : accounts
}
resolve(reply);
}
})
.catch(err => {
console.log("Error: Could not find accounts");
console.log('Error:' + err);
let reply = {
status:"FAILURE",
err: "Error: Could not find accounts. " + err
}
resolve(reply);
})
});
return promise;
}
I am not able to give javascript file that is calling the service, I will give it in the answer section
Sounds like you're asking about the Chai assertion.
equal uses strict equality so unless the two objects are literally the same object it will fail.
eql uses a deep equality comparison and will pass if the objects have the same properties and values.
Here is a simple example:
const chai = require('chai');
const chaiAsPromised = require('chai-as-promised');
chai.use(chaiAsPromised);
chai.should();
const getActivatedAccounts = () =>
Promise.resolve({ status: 'SUCCESS', data: ['some', 'data'] });
it('Should get account from Azure API', function () {
return getActivatedAccounts()
.should.eventually.eql({ status: 'SUCCESS', data: ['some', 'data'] }); // Success!
});
In my bot I have a section where the user can search for knowledge articles using a keyword. The knowledge articles are stored in a service now table. The bot is supposed to return all of the articles that match the keyword in a carousel format but whenever I click the search button nothing happens. Code below:
const search = async (turnContext) => {
const knowledgeBaseTopic = turnContext.activity.value.knowledgeBaseTopic;
const message = await new Promise(resolve => {
axios.request({
url: `url + topic`,
method: 'get',
baseURL: 'url',
auth: {
username: 'username',
password: 'password'
}
},
(error, response, body) => {
console.log(error);
var stuff = [];
let messageWithCarouselOfCards = MessageFactory.carousel(stuff);
for (var i = 0, len = body.result.length; i < len; i++) {
stuff.push(
CardFactory.heroCard(body.result[i].short_description, ['imageUrl1'], [`${ process.env.SN_KB_Resp_URl }${ body.result[i].number }`])
);
}
resolve(messageWithCarouselOfCards);
});
});
return turnContext.sendActivity(message);
};
I took my axios request and put it in a .js file completely seperate to the bot to ensure that the request was finding results. Code below:
const axios = require('axios')
const getArticles = async () => {
try {
axios.request({
url: 'url',
method: 'get',
baseURL: 'url',
auth: {
username: 'username',
password: 'password'
},
}
)
}
catch (error) {
console.error(error)
}
}
const countArticles = async () => {
try{
let articles = await getArticles()
console.log(`${Object.entries(articles.data.message).length}`)
} catch (error) {
console.error(error)
}
}
countArticles()
When running this .js file it fails with the error:
TypeError: Cannot read property 'data' of undefined
Any idea what I'm doing wrong with my request?