title: Best way to call Facebook API /{user-id}/picture?access_token=xxxxxx from server?
body: <p>I'm currently develop an app that need to display user profile picture. My App using "Page Scope Id" so all API call returned user id as page scope id. So can not using /{user-id}/picture without access_token.</p>
  
  <p><a href="https://i.stack.imgur.com/y20fy.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/y20fy.png" alt="enter image description here"></a></p>
  
  <p>There is one way to do is return page_access_token from server to client, then display image as: <code>&lt;img src="//graph.facebook.com/{user-id}/picture?access_token=xxxxx" /&gt;.</code> But this is not secure, because it render page_token in DOM. So I want to get this picture through my server. Example:</p>
  
  <ol>
  <li>there's an API to get Facebook user picture, e.g: <code>//my-server.com/api/{user-id}/picture</code></li>
  <li>Client display picture by <code>&lt;img src="//my-server.com/api/{user-id}/picture" /&gt;</code></li>
  <li>API <code>"//my-server.com/api/{user-id}/picture"</code> will get access_token base on caller user. Then send and request to Facebook API <code>/{user-id}/picture?access_token=xxxxxx</code> to get picture, then return it to client.</li>
  </ol>
  
  <p>This is absolute possible, but there's some issue that I don't resolve:</p>
  
  <p>Every time client call to server to get picture, the server need to check session to get facebook_token of user, then call facebook API. So, if I have 100 API call to server, the server need to check 100 times. It's very bad.</p>
  
  <p>There's a situation that cache image on server side maybe not helpful. Imagine there're two users call to API to get profile picture:</p>
  
  <ol>
  <li>User A, have server token token1, call to API:
  
  <ul>
  <li>Call <code>myserver.com/api/{user-id}/picture</code></li>
  <li>Server will check the token was sent with cookie to get user on server, then get facebook_page_token of this user</li>
  <li>Server call to Facebook API with facebook_page_token to get image,</li>
  <li>Server cache this image</li>
  </ul></li>
  <li>User B, have server token token2, call to the same API:
  
  <ul>
  <li>Call <code>myserver.com/api/{user-id}/picture</code></li>
  <li>...if we use cache, that's mean we don't need to check token for this user.</li>
  <li>Check the cache, if there's on cache then return cache, otherwise, back to 1's steps.
  I think this will work properly, but what if user B has not permission on page, that's mean user B do not have permission to read this API.</li>
  </ul></li>
  </ol>
  
  <p>Can anyone help me resolve this issue, please note that I don't want to show page_access_token to client.</p>
  
  <p>Thank you very much!</p>