Attempting simple javascript read/print operation against my parse.com database - javascript

I'm confused on how to get the javascript to run.
I have a base installation of a parse project on my mac and I have deployed it over and over to my custom parse.com provided sitename.parse.com without error.
I ran "parse new gwhizcloud" which created a simple directory structure. I replaced the index.html with the following content, then ran "parse deploy". So far so good. But when I hit my web site all I get is "User Emails" printed to the web page.
Here are my directory contents that I am publishing
cloud/main.js
config/global.json
public/index.html
All the files are pristine except for index.html which is listed out below
What am I missing?
Also, where do I look to find the console.log output?
Even my "alert" calls below do not seem to fire.
Here is my index.html
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width">
<script type="text/javascript" src="jquery-1.8.1.min.js"></script>
<script type="text/javascript" src="http://www.parsecdn.com/js/parse-1.2.13.min.js"></script>
<script>
var GWUserObject;
$(document).ready(function() {
Parse.initialize("1U8vTfgwwNSGr<private>y4pawka6x", "Xv3zic5bRl<private>BwhYFqpcpda");
GWUserObject = Parse.Object.extend("User");
console.log( "i feel ready to score!" );
var query = new Parse.Query(GWUserObject);
query.find({
success: function(results) {
alert("Successfully retrieved " + results.length + " of them.");
var s = '';
for(var i=0, len<results.length; i++) {
var result = results[i];
alert(object.id + ' - ' + result.get('email'));
s+= '<p>';
s+= '<b>id:</b> '+ result.objectId + '::';
s+= '<b>Username:</b> '+ result.attributes.username + '::';
s+= 'Email verified: ' + result.attributes.emailVerified + '::';
s+= 'Email: ' + result.attributes.email + '<br/>';
s+= '</p>'
}
$("#list").html(s);
},
error: function(error)
{
alert("Error: " + error.code + " " + error.message);
}
});
});
</script>
<style>
body {
margin-left: 25px;
margin-right: 25px;
font-family: arial;
}
input {
width: 100%;
height: 25px;
}
textarea {
width: 100%;
}
</style>
</head>
<body>
<h2>User Emails</h2>
<div id="list">
</div>
</body>
</html>

Resolved:: Had a syntax error in this line: for(var i=0, len

Related

Azure's Cognitive Services Emotion API returns 404

I am trying to build a web application which is supposed to use Microsoft Azures Cognitve Services Emotion API.
I use JavaScript (jQuery) to send a AJAX-request to my assigned endpoint-server.
This is my attempt:
<!DOCTYPE html>
<html>
<head>
<title>JSSample</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
</head>
<h2>Face Rectangle</h2>
<ul id="faceRectangle">
</ul>
<h2>Emotions</h2>
<ul id="scores">
</ul>
<body>
<script type="text/javascript">
$(function() {
var params = { };
$.ajax({
url: "https://westus.api.cognitive.microsoft.com/emotion/v1.0?" + $.param(params),
beforeSend: function(xhrObj){
xhrObj.setRequestHeader("Content-Type","application/json");
xhrObj.setRequestHeader("Ocp-Apim-Subscription-Key","<key>");
},
type: "POST",
data: '{"url": "<some picture's URL>"}',
}).done(function(data) {
var faceRectangle = data[0].faceRectangle;
var faceRectangleList = $('#faceRectangle');
for (var prop in faceRectangle) {
faceRectangleList.append("<li> " + prop + ": " + faceRectangle[prop] + "</li>");
}
var scores = data[0].scores;
var scoresList = $('#scores');
for(var prop in scores) {
scoresList.append("<li> " + prop + ": " + scores[prop] + "</li>")
}
}).fail(function(err) {
alert("Error: " + JSON.stringify(err));
});
});
</script>
</body>
</html>
The exact error response from the server is:
Error: {"readyState":4,"responseText":"{ \"error\": { \"code\": \"ResourceNotFound\", \"message\": \"resource not found.\" } }","status":404,"statusText":"Resource Not Found"}
obviously the server cannot answer my request. Can somebody interpret the server's error response or see a flaw in my code?
Based on the official documentation, the request URL of Emotion API should be:
https://westus.api.cognitive.microsoft.com/emotion/v1.0/recognize

Sign-in with google account on website

I just started using google API, so i feel like i am walking in the dark.
What i want to do:
It is a very common feature. I want my site to have a Google account Sign-In Button using javascipt, and make sure that a given gmail is valid and maybe extract some basic information from the account.
What do i found:
I have followed the instructions from here:
https://developers.google.com/+/web/signin/javascript-flow .
and copied the code in the last steps of the instructions. I have entered my CLIENT_ID that i got when i followed the instructions in the 'tutorial' but my button just doesn't work. I also searched for some examples and are quite different from the code i found in the google site. I feel that i am missing something (actually i think that i am doing something stupid :) ).
And Here is my code
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1">
<meta name="google-signin-clientid" content="'MY_CLIENT_ID'.apps.googleusercontent.com" />
<meta name="google-signin-scope" content="https://www.googleapis.com/auth/plus.login" />
<meta name="google-signin-requestvisibleactions" content="http://schema.org/AddAction" />
<meta name="google-signin-cookiepolicy" content="single_host_origin" />
<script src="https://apis.google.com/js/client:platform.js" async defer></script>
<script type="text/javascript">
function signinCallback(authResult) {
if (authResult['status']['signed_in']) {
// Update the app to reflect a signed in user
// Hide the sign-in button now that the user is authorized, for example:
document.getElementById('signinButton').setAttribute('style', 'display: none');
} else {
// Update the app to reflect a signed out user
// Possible error values:
// "user_signed_out" - User is signed-out
// "access_denied" - User denied access to your app
// "immediate_failed" - Could not automatically log in the user
console.log('Sign-in state: ' + authResult['error']);
}
}
function render() {
alert("1");
// Additional params including the callback, the rest of the params will
// come from the page-level configuration.
var additionalParams = {
'callback': signinCallback
};
alert("2");
// Attach a click listener to a button to trigger the flow.
var signinButton = document.getElementById('signinButton');
signinButton.addEventListener('click', function() {
gapi.auth.signIn(additionalParams); // Will use page level configuration
alert("3");
});
}
</script>
</head>
<body>
<button id="signinButton">Sign in with Google</button>
</body>
</html>
I have added some alerts, but nothing pops-up and did not used anywhere the 'client secret' password or the JavaScript origins. Also, in the place of 'MY_CLIENT_ID' is actually my client ID.
I don't know if this makes any difference, but my site is not yet on a server. Just working locally (with internet of course!)
Do you know what i got wrong?
Check your console, maybe there are some errors.
Try this example from https://google-developers.appspot.com/+/demos/signin_demo_trigger:
<html>
<head>
<title>Google+ Sign-in button demo: JavaScript flow</title>
<style type="text/css">
html, body { margin: 0; padding:0;}
#signin-button {
padding: 5px;
}
#oauth2-results pre { margin: 0; padding:0; width: 600px;}
.hide { display: none;}
.show { display: block;}
</style>
<script type="text/javascript">
var loginFinished = function(authResult) {
if (authResult) {
console.log(authResult);
var el = document.getElementById('oauth2-results');
var label = '';
toggleDiv('oauth2-results');
if (authResult['status']['signed_in']) {
label = 'User granted access:';
gapi.auth.setToken(authResult);
} else {
label = 'Access denied: ' + authResult['error'];
}
el.innerHTML =
label + '<pre class="prettyprint"><code>' +
// JSON.stringify doesn't work in IE8.
'{<br />' +
' "id_token" : "' + authResult['id_token'] +'",<br />' +
' "access_token" : "' + authResult['access_token'] + '",<br />' +
' "state" : "' + authResult['state'] + '",<br />' +
' "expires_in" : "' + authResult['expires_in'] + '",<br />' +
' "error" : "' + authResult['error'] + '",<br />' +
' "error_description" : "' + authResult['error_description'] + '",<br />' +
' "authUser" : "' + authResult['authuser'] + '",<br />' +
' "status" : {"' + '<br />' +
' "google_logged_in" : "' + authResult['status']['google_logged_in'] + '",<br />' +
' "method" : "' + authResult['status']['method'] + '",<br />' +
' "signed_in" : "' + authResult['status']['signed_in'] + '"<br />' +
' }<br />' +
'}</code></pre>';
} else {
document.getElementById('oauth2-results').innerHTML =
'Empty authResult';
}
};
function toggleDiv(id) {
var div = document.getElementById(id);
if (div.getAttribute('class') == 'hide') {
div.setAttribute('class', 'show');
} else {
div.setAttribute('class', 'hide');
}
}
var options = {
'callback' : loginFinished,
'approvalprompt' : 'force',
'clientid' : '841077041629.apps.googleusercontent.com',
'requestvisibleactions' : 'http://schema.org/CommentAction http://schema.org/ReviewAction',
'cookiepolicy' : 'single_host_origin'
};
function startFlow(){
toggleDiv('startFlow');
gapi.auth.signIn(options);
}
</script>
<script src="https://apis.google.com/js/client:platform.js" type="text/javascript"></script>
</head>
<body>
<div id="startFlow">
<a class="button button-blue" href="javascript:startFlow();">Click me</a>
to trigger the sign-in flow with
<a href="/+/web/signin/reference#gapi.auth.signIn"
target="_parent"><code>gapi.auth.signIn()</code></a>
</div>
<div id="oauth2-results" class="hide"></div>
<div style="font: 12px sans-serif, Arial; margin-left: 0.5em; margin-top: 0.5em">Reload the example or open in a new window</div>
</body>
</html>
<!-- Sign in with Google+ only work on working website -->
<html lang="en">
<head>
<script src="https://apis.google.com/js/platform.js?onload=renderApp" async defer></script>
</head>
<body>
<div class="g-signin2" id="customBtn">Sign in with Google+</div>
<script>
function onSignIn(googleUser) {
// Useful data for your client-side scripts:
var profile = googleUser.getBasicProfile();
console.log("ID: " + profile.getId()); // Don't send this directly to your server!
console.log('Full Name: ' + profile.getName());
console.log('Given Name: ' + profile.getGivenName());
console.log('Family Name: ' + profile.getFamilyName());
console.log("Image URL: " + profile.getImageUrl());
console.log("Email: " + profile.getEmail());
// The ID token you need to pass to your backend:
var id_token = googleUser.getAuthResponse().id_token;
console.log("ID Token: " + id_token);
};
</script>
<script>
var renderApp = function() {
// GOOGLE_CLIENT_ID should be create from https://developers.google.com/identity/sign-in/web/devconsole-project
gapi.load('auth2', function(){
auth2 = gapi.auth2.init({
client_id: 'GOOGLE_CLIENT_ID.apps.googleusercontent.com',
cookiepolicy: 'single_host_origin',
});
attachSignin('customBtn'); //Function called for click
});
};
function attachSignin(customBtn) {
auth2.attachClickHandler(customBtn, {}, onSignIn, function(error) {
console.log(JSON.stringify(error, undefined, 2));
});
}
</script>
</body>
</html>

Node JS Socket IO Chat issue

I am developing a one to one chat application using node js and socket .io
but when i try running my chat.html it gives an error "Reference Error io is not defined".
I googled this issue and i found a solution it says use cdn, i tried that too . but this time error was different it is "cannot find method connect"
socket.io.js is there at node_modules\socket.io\lib
when i tried to access it through browser its says " cannot get socket.io.js"
here i am pasting my code . please help me on this
Server.js
var app = require('express').createServer();
var io = require('socket.io').listen(app);
var fs = require('fs');
app.listen(8080);
app.get('/', function (req, res) {
res.sendfile(__dirname + '/chat.html');
});
var usernames = {};
function check_key(v) {
var val = '';
for (var key in usernames) {
if (usernames[key] == v)
val = key;
}
return val;
}
io.sockets.on('connection', function (socket) {
socket.on('sendchat', function (data) {
io.sockets.emit('updatechat', socket.username, data);
});
socket.on('adduser', function (username) {
socket.username = username;
usernames[username] = socket.id;
socket.emit('updatechat', 'SERVER', 'you have connected');
socket.emit('store_username', username);
socket.broadcast.emit('updatechat', 'SERVER', username + ' has connected: ' + socket.id);
io.sockets.emit('updateusers', usernames);
});
socket.on('disconnect', function () {
delete usernames[socket.username];
io.sockets.emit('updateusers', usernames);
socket.broadcast.emit('updatechat', 'SERVER', socket.username + ' has disconnected');
});
socket.on('check_user', function (asker, id) {
io.sockets.socket(usernames[asker]).emit('msg_user_found', check_key(id));
});
socket.on('msg_user', function (usr, username, msg) {
io.sockets.socket(usernames[usr]).emit('msg_user_handle', username, msg);
fs.writeFile("chat_data.txt", msg, function (err) {
if (err) {
console.log(err);
}
});
});
});
Chat.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="/socket.io/socket.io.js "></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
var my_username = '';
try {
function send_individual_msg(id) {
socket.emit('check_user', my_username, id);
}
var socket = io.connect('http://localhost:8008');
socket.on('connect', function () {
socket.emit('adduser', prompt("What's your name?"));
});
socket.on('msg_user_handle', function (username, data) {
$('#conversation').append('<b>' + username + ':</b> ' + data + '<br>');
});
socket.on('msg_user_found', function (username) {
socket.emit('msg_user', username, my_username, prompt("Type your message:"));
});
socket.on('updatechat', function (username, data) {
$('#conversation').append('<b>' + username + ':</b> ' + data + '<br>');
});
socket.on('store_username', function (username) {
my_username = username;
});
socket.on('updateusers', function (data) {
$('#users').empty();
$.each(data, function (key, value) {
$('#users').append('<div style="cursor:pointer;" onclick="send_individual_msg(\'' + value + '\')">' + key + '</div>');
});
});
$(function () {
$('#datasend').click(function () {
var message = $('#data').val();
if (message == '' || jQuery.trim(message).length == 0)
return false;
$('#data').val('');
socket.emit('sendchat', message);
});
$('#data').keypress(function (e) {
if (e.which == 13) {
$(this).blur();
$('#datasend').click();
}
});
});
}
catch (err) {
alert(err);
}
</script>
</head>
<body>
<div style="float: left; width: 100px; border-right: 1px solid black; height: 300px;
padding: 10px; overflow: scroll-y;">
<b>USERS</b>
<div id="users">
</div>
</div>
<div style="float: left; width: 550px; height: 250px; overflow: scroll-y; padding: 10px;">
<div id="conversation">
</div>
<input id="data" style="width: 200px;" />
<input type="button" id="datasend" value="send" />
</div>
</body>
</html>
Since you are using Express, you should put your client-side socket.io.js file in the
public/javascripts
and in your HTML file the path of your file will be :
javascripts/socket.io.js
Since you are using a static file, that is socketio.js you need to use
//For including static files in expressJS
app.use(express.static(__dirname + '/'));
or
Express provides a built-in middleware express.static to serve static files, such as images, CSS, JavaScript, etc.
You simply need to pass the name of the directory where you keep your static assets, to the express.static middleware to start serving the files directly. For example, if you keep your images, CSS, and JavaScript files in a directory named public, you can do this −
app.use(express.static('public'));
Place your /socket.io/socket.io.js in side public directory

communication from javascript to objective-C

I am loading a HTML file file from server inside UIWebView. In HTML file, we have external links to open and a Javascript function is written to handle that events.I want to open that hyperlinks inside a seperate new webview within the app.
Is there any way that server side javascript method notify to objective-C or any callback function which will call in objective-C and then i can do someting in my code? i have seen the example of WEBViewJavaScriptBridge to communicate between javascript and objective C. but they are using the local HTML file to load and communicate.Bt my HTML file is on server side.It would be great if anyone can help on this.
I am puuting a sample HTML file here. We have two hypelinks "Open" and "Close" on taping on open button a function is called that show alert. so instead of alert i want to pass the retuen callback to objective-C code.
Here it is:-
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width = device-width, initial-scale = 1.0, maximum-scale = 1.0, minimum-scale = 1.0, user-scalable=no"/>
<meta name="HandheldFriendly" content="True"/>
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<title>Test HTML</title>
<script type="text/javascript">
function open(url, offset){
alert("Open Webview with url:"+ url + " & Offset: " + offset);
}
function close(url, offset){
alert("close webview");
}
</script>
</head>
<body>
Open<br>
Close
</body>
</html>
I used webviewjavascriptbridge to communicate javascript and objective C code.
In this example code, note the global variable of bridge.
<!doctype html>
<html><head>
<style type='text/css'>
html { font-family:Helvetica; color:#222; }
h1 { color:steelblue; font-size:24px; margin-top:24px; }
button { margin:0 3px 10px; font-size:12px; }
.logLine { border-bottom:1px solid #ccc; padding:4px 2px; font-family:courier; font-size:11px; }
</style>
</head><body>
<h1>WebViewJavascriptBridge Demo</h1>
<script>
window.onerror = function(err) {
alert('window.onerror: ' + err)
}
var bridge;
document.addEventListener('WebViewJavascriptBridgeReady', onBridgeReady, false)
function onBridgeReady(event){
alert("Onbridge ready call");
bridge = event.bridge
var uniqueId = 1
function log(message, data) {
var log = document.getElementById('log')
var el = document.createElement('div')
el.className = 'logLine'
el.innerHTML = uniqueId++ + '. ' + message + (data ? ': ' + JSON.stringify(data) : '')
if (log.children.length) { log.insertBefore(el, log.children[0]) }
else { log.appendChild(el) }
}
bridge.init(function(message) {
log('JS got a message', message)
})
bridge.registerHandler('open', function(data, response) {
log('JS handler testJavascriptHandler was called', data)
response.respondWith({ 'Javascript Says':'open open open!' })
})
bridge.registerHandler('testJavascriptHandler', function(data, response) {
log('JS handler testJavascriptHandler was called', data)
response.respondWith({ 'Javascript Says':'Right back atcha!' })
})
var button = document.getElementById('buttons').appendChild(document.createElement('button'))
button.innerHTML = 'Send message to ObjC'
button.ontouchstart = function(e) {
e.preventDefault()
bridge.send('Hello from JS button')
}
document.body.appendChild(document.createElement('br'))
var callbackButton = document.getElementById('buttons').appendChild(document.createElement('button'))
callbackButton.innerHTML = 'Fire testObjcCallback'
callbackButton.ontouchstart = function(e) {
e.preventDefault()
log("Calling handler testObjcCallback")
bridge.callHandler('testObjcCallback', {'foo': 'bar'}, function(response) {
log('Got response from testObjcCallback', response)
})
}
}
function open(url, offset,e)
{
alert(bridge);
//alert("Open Webview with url:Yes Got it");
// alert(document.getElementById(offset).href);
// var bridge = event.bridge;
// alert(bridge);
window.location = url+'?offset='+offset//'myapp:myaction:url:offset'
//requestFromObjc("buttonColor&someParam=1");
}
function close()
{
alert("Open Webview with url:"+ url + " & Offset: " + offset);
}
function requestFromObjc(functionName, objcResult, callback)
{
if (!objcResult)
{
window.location = 'myapp:myaction:param1:param2'
// window.location = "myapp://objcRequest?function=" + functionName + "&callback=" + arguments.callee.name + "&callbackFunc=" + arguments.callee.caller.name;
}
else
{
window[callback](objcResult);
}
}
</script>
<div id='buttons'></div> <div id='log'></div>
<body>
<a id="55" href="javascript:open('http://www.tcm.com', '55',this)">Open</a><br>
Close
</body>
</body></html>
Reference: https://github.com/marcuswestin/WebViewJavascriptBridge
You can communicate with your HTML from objective c with the following webView delagate methods...
- (NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
Please go through the usage of these methods...
I hope this may help you

Can't load friends images with facebook API

I'am following a tutorial from Facebook for making a mobile website application.
But i can't load the images from friends.
I get this:
<img src="[object Object]">
It should work, because i copied the entire code from the example (only changed appId)
Here is the full code:
<html>
<head>
<title>Hello World</title>
<meta name="viewport" content="initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<meta property="og:title" content="Hello world" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="Hello World" />
<meta property="og:description" content="Hello World! This is my mobile web sample app." />
<meta property="og:image" content="http://www.facebookmobileweb.com/hackbook/img/facebook_icon_large.png"/>
</head>
<body>
<div id="fb-root"></div>
<script>
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
<script>
window.fbAsyncInit = function() {
FB.init({ appId: '226909127331855',
status: true,
cookie: true,
xfbml: true,
oauth: true});
FB.Event.subscribe('auth.statusChange', handleStatusChange);
};
</script>
<script>
function handleStatusChange(response) {
document.body.className = response.authResponse ? 'connected' : 'not_connected';
if (response.authResponse) {
console.log(response);
updateUserInfo(response);
}
}
</script>
<div id="login">
<p><button onClick="loginUser();">Login</button></p>
</div>
<div id="logout">
<div id="user-info"></div>
<p><button onClick="FB.logout();">Logout</button></p>
</div>
<script>
function loginUser() {
FB.login(function(response) { }, {scope:'email'});
}
</script>
<style>
body.connected #login { display: none; }
body.connected #logout { display: block; }
body.not_connected #login { display: block; }
body.not_connected #logout { display: none; }
</style>
<div id="user-info"></div>
<script>
function updateUserInfo(response) {
FB.api('/me', function(response) {
document.getElementById('user-info').innerHTML = '<img src="https://graph.facebook.com/' + response.id + '/picture">' + response.name;
});
}
</script>
Get friends<br>
<div id="user-friends"></div>
<script>
function getUserFriends() {
FB.api('/me/friends&fields=name,picture', function(response) {
console.log('Got friends: ', response);
if (!response.error) {
var markup = '';
var friends = response.data;
for (var i=0; i < friends.length && i < 25; i++) {
var friend = friends[i];
markup += '<img src="' + friend.picture + '"> ' + friend.name + '<br>';
}
document.getElementById('user-friends').innerHTML = markup;
}
});
}
</script>
Publish feed story<br>
<script>
function publishStory() {
FB.ui({
method: 'feed',
name: 'I\'m building a social mobile web app!',
caption: 'This web app is going to be awesome.',
description: 'Check out Facebook\'s developer site to start building.',
link: 'http://www.facebookmobileweb.com/hello',
picture: 'http://www.facebookmobileweb.com/hackbook/img/facebook_icon_large.png'
},
function(response) {
console.log('publishStory response: ', response);
});
return false;
}
</script>
Send request<br>
<script>
function sendRequest() {
FB.ui({
method: 'apprequests',
message: 'invites you to learn how to make your mobile web app social',
},
function(response) {
console.log('sendRequest response: ', response);
});
}
</script>
<fb:like></fb:like>
</body>
</html>
Here is the tutorial: https://developers.facebook.com/docs/mobile/web/build/
Try changing your code to this:
'<img src="' + friend.picture.data.url + '"> '
As #Gyan mentioned, take a look at the open graph explorer to see what the underlying data structure looks like.
you are doing only a bit wrong
go for this link face book developer tool for graph api for freindlist link
you will get friends something like
{
"name": "Nishant Porwal",
"id": "522901714",
"picture": {
"data": {
"url": "https://fbcdn-profile-a.akamaihd.net/hprofile-ak-ash4/372008_522901714_1470071180_q.jpg",
"is_silhouette": false
}
}
}
and now see your code
'<img src="' + friend.picture + '"> '
you have to parse
you defently find that you are placing an object instead of placing url so change your code and get url because src always work for image url :) might i am given you an idea where you are wrong
change it to
'<img src="' + friend.picture.data.url + '"> '
General advice is to check the object type returned by your method. Since you are being returned an object, there is likely a property like image you can reference from that object... something like objectName.imageURI

Categories