Why do I have problems to fetch users name in javascript?
I am working on a Javascript, HTML and CSS proyect. What I want is to get the name of a user using its Id. I use fetch to do that but I am getting some problems.
function getUserName(userId) {
let userTemp = window.API_HOST + '/users/' + userId;
return fetch(userTemp, {
headers: { authorization: localStorage.access_token },
})
.then(response => response.json())
.then(response => {
console.log('El nombre es: ' + response.name);
return response.name;
});
}
The problem here is that response.name is a promise object and not the actual name. I tried to use stringify but it did not work. Any suggestions?
EDIT:
I need to call that function in a place like this:
function showOffer(newOffer) {
if (newOffer.user_id === JSON.parse(localStorage.current_user)._id) {
const wrapper = document.createElement('div');
wrapper.className = 'wrap';
const prodHolder = document.getElementById('demo').appendChild(wrapper);
const offerBidderId = document.createElement('p');
const offerBidderIdText = document.createTextNode(
'Bidder id: ' + getUserName(newOffer.bidder_id),
);
console.log('New offer bidder id ' + newOffer.bidder_id);
offerBidderId.appendChild(offerBidderIdText);
wrapper.appendChild(offerBidderId);
....
}
Maybe here is the problem?
javascript
asked Nov 21 '18 at 8:07
Mauricio EstevezMauricio Estevez
7319
add a comment |
I am working on a Javascript, HTML and CSS proyect. What I want is to get the name of a user using its Id. I use fetch to do that but I am getting some problems.
function getUserName(userId) {
let userTemp = window.API_HOST + '/users/' + userId;
return fetch(userTemp, {
headers: { authorization: localStorage.access_token },
})
.then(response => response.json())
.then(response => {
console.log('El nombre es: ' + response.name);
return response.name;
});
}
The problem here is that response.name is a promise object and not the actual name. I tried to use stringify but it did not work. Any suggestions?
EDIT:
I need to call that function in a place like this:
function showOffer(newOffer) {
if (newOffer.user_id === JSON.parse(localStorage.current_user)._id) {
const wrapper = document.createElement('div');
wrapper.className = 'wrap';
const prodHolder = document.getElementById('demo').appendChild(wrapper);
const offerBidderId = document.createElement('p');
const offerBidderIdText = document.createTextNode(
'Bidder id: ' + getUserName(newOffer.bidder_id),
);
console.log('New offer bidder id ' + newOffer.bidder_id);
offerBidderId.appendChild(offerBidderIdText);
wrapper.appendChild(offerBidderId);
....
}
Maybe here is the problem?
javascript
asked Nov 21 '18 at 8:07
Mauricio EstevezMauricio Estevez
7319
can you give an example of whatuserIdmight contain as a value?
– Ahmad
Nov 21 '18 at 8:08
If the response.name is type of promise as you said then you would have to use.thenmethod to access its value
– Joven28
Nov 21 '18 at 8:09
@Ahmad the userId is just a long integer
– Mauricio Estevez
Nov 21 '18 at 8:11
If it's a promise, you certainly should do something like : userId.then(function(someParameter) { console.log(someParameter); });
– csblo
Nov 21 '18 at 8:14
Maybe this will help: stackoverflow.com/questions/14220321/…
– Oram
Nov 21 '18 at 8:21
add a comment |
I am working on a Javascript, HTML and CSS proyect. What I want is to get the name of a user using its Id. I use fetch to do that but I am getting some problems.
function getUserName(userId) {
let userTemp = window.API_HOST + '/users/' + userId;
return fetch(userTemp, {
headers: { authorization: localStorage.access_token },
})
.then(response => response.json())
.then(response => {
console.log('El nombre es: ' + response.name);
return response.name;
});
}
The problem here is that response.name is a promise object and not the actual name. I tried to use stringify but it did not work. Any suggestions?
EDIT:
I need to call that function in a place like this:
function showOffer(newOffer) {
if (newOffer.user_id === JSON.parse(localStorage.current_user)._id) {
const wrapper = document.createElement('div');
wrapper.className = 'wrap';
const prodHolder = document.getElementById('demo').appendChild(wrapper);
const offerBidderId = document.createElement('p');
const offerBidderIdText = document.createTextNode(
'Bidder id: ' + getUserName(newOffer.bidder_id),
);
console.log('New offer bidder id ' + newOffer.bidder_id);
offerBidderId.appendChild(offerBidderIdText);
wrapper.appendChild(offerBidderId);
....
}
Maybe here is the problem?
javascript
asked Nov 21 '18 at 8:07
Mauricio EstevezMauricio Estevez
7319
I am working on a Javascript, HTML and CSS proyect. What I want is to get the name of a user using its Id. I use fetch to do that but I am getting some problems.
function getUserName(userId) {
let userTemp = window.API_HOST + '/users/' + userId;
return fetch(userTemp, {
headers: { authorization: localStorage.access_token },
})
.then(response => response.json())
.then(response => {
console.log('El nombre es: ' + response.name);
return response.name;
});
}
The problem here is that response.name is a promise object and not the actual name. I tried to use stringify but it did not work. Any suggestions?
EDIT:
I need to call that function in a place like this:
function showOffer(newOffer) {
if (newOffer.user_id === JSON.parse(localStorage.current_user)._id) {
const wrapper = document.createElement('div');
wrapper.className = 'wrap';
const prodHolder = document.getElementById('demo').appendChild(wrapper);
const offerBidderId = document.createElement('p');
const offerBidderIdText = document.createTextNode(
'Bidder id: ' + getUserName(newOffer.bidder_id),
);
console.log('New offer bidder id ' + newOffer.bidder_id);
offerBidderId.appendChild(offerBidderIdText);
wrapper.appendChild(offerBidderId);
....
}
Maybe here is the problem?
javascript
javascript
asked Nov 21 '18 at 8:07
Mauricio EstevezMauricio Estevez
7319
asked Nov 21 '18 at 8:07
Mauricio EstevezMauricio Estevez
7319
edited Nov 21 '18 at 8:27
Mauricio Estevez
asked Nov 21 '18 at 8:07
Mauricio EstevezMauricio Estevez
7319
asked Nov 21 '18 at 8:07
Mauricio EstevezMauricio Estevez
7319
asked Nov 21 '18 at 8:07
Mauricio EstevezMauricio Estevez
7319
7319
can you give an example of whatuserIdmight contain as a value?
– Ahmad
Nov 21 '18 at 8:08
If the response.name is type of promise as you said then you would have to use.thenmethod to access its value
– Joven28
Nov 21 '18 at 8:09
@Ahmad the userId is just a long integer
– Mauricio Estevez
Nov 21 '18 at 8:11
If it's a promise, you certainly should do something like : userId.then(function(someParameter) { console.log(someParameter); });
– csblo
Nov 21 '18 at 8:14
Maybe this will help: stackoverflow.com/questions/14220321/…
– Oram
Nov 21 '18 at 8:21
add a comment |
can you give an example of whatuserIdmight contain as a value?
– Ahmad
Nov 21 '18 at 8:08
If the response.name is type of promise as you said then you would have to use.thenmethod to access its value
– Joven28
Nov 21 '18 at 8:09
@Ahmad the userId is just a long integer
– Mauricio Estevez
Nov 21 '18 at 8:11
If it's a promise, you certainly should do something like : userId.then(function(someParameter) { console.log(someParameter); });
– csblo
Nov 21 '18 at 8:14
Maybe this will help: stackoverflow.com/questions/14220321/…
– Oram
Nov 21 '18 at 8:21
can you give an example of what
userId might contain as a value?– Ahmad
Nov 21 '18 at 8:08
can you give an example of what
userId might contain as a value?– Ahmad
Nov 21 '18 at 8:08
If the response.name is type of promise as you said then you would have to use
.then method to access its value– Joven28
Nov 21 '18 at 8:09
If the response.name is type of promise as you said then you would have to use
.then method to access its value– Joven28
Nov 21 '18 at 8:09
@Ahmad the userId is just a long integer
– Mauricio Estevez
Nov 21 '18 at 8:11
@Ahmad the userId is just a long integer
– Mauricio Estevez
Nov 21 '18 at 8:11
If it's a promise, you certainly should do something like : userId.then(function(someParameter) { console.log(someParameter); });
– csblo
Nov 21 '18 at 8:14
If it's a promise, you certainly should do something like : userId.then(function(someParameter) { console.log(someParameter); });
– csblo
Nov 21 '18 at 8:14
Maybe this will help: stackoverflow.com/questions/14220321/…
– Oram
Nov 21 '18 at 8:21
Maybe this will help: stackoverflow.com/questions/14220321/…
– Oram
Nov 21 '18 at 8:21
add a comment |
1 Answer
1
active
oldest
votes
fetch returns always a Promise. So you have to handle it with then or async/await.
You can access it like this:
getUserName(1).then(name => {
console.log('El nombre es: ' + name);
});
or inside an async function:
async function access() {
const name = await getUserName(1);
console.log('El nombre es: ' + name);
}
Nice article about async functions: https://developers.google.com/web/fundamentals/primers/async-functions
answered Nov 21 '18 at 8:23
PhilPhil
1,9411919
This was the answer that helped me the most
– Mauricio Estevez
Nov 21 '18 at 8:32
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53407638%2fwhy-do-i-have-problems-to-fetch-users-name-in-javascript%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
fetch returns always a Promise. So you have to handle it with then or async/await.
You can access it like this:
getUserName(1).then(name => {
console.log('El nombre es: ' + name);
});
or inside an async function:
async function access() {
const name = await getUserName(1);
console.log('El nombre es: ' + name);
}
Nice article about async functions: https://developers.google.com/web/fundamentals/primers/async-functions
answered Nov 21 '18 at 8:23
PhilPhil
1,9411919
This was the answer that helped me the most
– Mauricio Estevez
Nov 21 '18 at 8:32
add a comment |
fetch returns always a Promise. So you have to handle it with then or async/await.
You can access it like this:
getUserName(1).then(name => {
console.log('El nombre es: ' + name);
});
or inside an async function:
async function access() {
const name = await getUserName(1);
console.log('El nombre es: ' + name);
}
Nice article about async functions: https://developers.google.com/web/fundamentals/primers/async-functions
answered Nov 21 '18 at 8:23
PhilPhil
1,9411919
This was the answer that helped me the most
– Mauricio Estevez
Nov 21 '18 at 8:32
add a comment |
fetch returns always a Promise. So you have to handle it with then or async/await.
You can access it like this:
getUserName(1).then(name => {
console.log('El nombre es: ' + name);
});
or inside an async function:
async function access() {
const name = await getUserName(1);
console.log('El nombre es: ' + name);
}
Nice article about async functions: https://developers.google.com/web/fundamentals/primers/async-functions
answered Nov 21 '18 at 8:23
PhilPhil
1,9411919
fetch returns always a Promise. So you have to handle it with then or async/await.
You can access it like this:
getUserName(1).then(name => {
console.log('El nombre es: ' + name);
});
or inside an async function:
async function access() {
const name = await getUserName(1);
console.log('El nombre es: ' + name);
}
Nice article about async functions: https://developers.google.com/web/fundamentals/primers/async-functions
answered Nov 21 '18 at 8:23
PhilPhil
1,9411919
answered Nov 21 '18 at 8:23
PhilPhil
1,9411919
answered Nov 21 '18 at 8:23
PhilPhil
1,9411919
answered Nov 21 '18 at 8:23
PhilPhil
1,9411919
1,9411919
This was the answer that helped me the most
– Mauricio Estevez
Nov 21 '18 at 8:32
add a comment |
This was the answer that helped me the most
– Mauricio Estevez
Nov 21 '18 at 8:32
This was the answer that helped me the most
– Mauricio Estevez
Nov 21 '18 at 8:32
This was the answer that helped me the most
– Mauricio Estevez
Nov 21 '18 at 8:32
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53407638%2fwhy-do-i-have-problems-to-fetch-users-name-in-javascript%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
can you give an example of what
userIdmight contain as a value?– Ahmad
Nov 21 '18 at 8:08
If the response.name is type of promise as you said then you would have to use
.thenmethod to access its value– Joven28
Nov 21 '18 at 8:09
@Ahmad the userId is just a long integer
– Mauricio Estevez
Nov 21 '18 at 8:11
If it's a promise, you certainly should do something like : userId.then(function(someParameter) { console.log(someParameter); });
– csblo
Nov 21 '18 at 8:14
Maybe this will help: stackoverflow.com/questions/14220321/…
– Oram
Nov 21 '18 at 8:21