Problem
=======
As you may know the User Profile Picture is stored in My Site Host site collection. The User Profile property PictureURL store the location of the picture. But the problem I ran in to is cross domain issue in the SharePoint Hosted App. The app was located in the app domain and the PictureURL points to my-host site collection.
Example:
https://{your tenant}-my.sharepoint.com:443/User%20Photos/Profile%20Pictures/userid_yourtenant_com_MThumb.jpg
I used the following blog reference to solve the issue.
User profile picture in SP hosted app
http://mysharepointlearnings.wordpress.com/2014/02/02/user-profile-picture-in-sp-hosted-app/
So why I am still blogging, because still ran in to issue with the account name passed in the query string. I spent some time to figure out I thought it can be useful to someone.
The AccountName user profile property was (999999 is to scrub the data)
AccountName = i:0#.f|membership|999999@{your tenant}.com
Passing the account name as the above sting will create an issue and will not return your image.
Solution
=======
You will need to encode the AccountName value. As shown below.
var accountName = encodeURIComponent(
personProperties.get_userProfileProperties()[‘AccountName’]);

var qsSPHostUrl = getQueryStringParameter(‘SPHostUrl’);

var picUrl = decodeURIComponent(
qsSPHostUrl +
“/” +
_spPageContextInfo.layoutsUrl +
“/userphoto.aspx?size=L&accountname=”)
+ accountName ;
// Finally apply the src attribute with the value.
$get(“imgUserPhoto”).src = picUrl;

The value in the SRC attribute will be as following. Your picture should show up.
https://{your tenant}.sharepoint.com/sites/PankajSandBox/_layouts/15/userphoto.aspx?size=L&accountname=i%3A0%23.f%7Cmembership%7C999999%40{your tenant}.com