Securing nested access tokens in JavaScript: Best practices

FB.api({user-id},
    {
        "fields":"context",
        "access_token": anAccessToken
    }, function (response) {
        console.log(response);
    })

I am currently retrieving mutual friends using the context parameter. However, I need to provide both the app_scoped_userid and my access token from OAuth in order for this to work.

I am hesitant about including these strings in my client-side code because someone could potentially misuse them to access any data that the user has granted permission to my app.

Is there a more secure solution available? (I have considered moving the API call to the server side, but it goes against the lightweight client-heavy server structure that I am aiming for.)

Should I be concerned about the security implications of this setup?

javascriptfacebookfacebook-graph-api

Answer №1

I believe there might be some confusion in how you are utilizing this feature. As outlined in the documentation at https://developers.facebook.com/docs/graph-api/reference/v3.0/user.context/mutual_friends, the correct request format should be:

/{friend_id}?fields=context{mutual_friends}

The JS SDK should handle the Access Token (from the logged-in User) automatically. There is no need to explicitly provide it in the request:

FB.api('/{friend_id}?fields=context{mutual_friends}', function(response) {
  console.log(response);
});

In order to obtain the {friend_id}, you can first query /me/friends to retrieve the current User's friends list and then select a specific friend from there.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Issue: The variable THREE has not been defined within the FBXLoader code

Currently, I am utilizing the module version of three.js in order to execute imports from a client-side JavaScript file structure. The core functionality of THREE is working correctly. However, I am encountering an issue when attempting to use it with FBX ...

javascriptnode.jsthree.jsnode-modulesfbx

What is the method for renaming Props in Vue components?

I recently embarked on my VueJS journey and attempted to implement v-model in a component, following an example I found. <template> <div class="date-picker"> Month: <input type="number" ref="monthPicker" :value="value.month" @in ...

javascriptvue.jsvuejs2

Catalog indexed in a JSON document

I'm currently facing an issue with extracting data from a JSON file and populating a list with that information. HTML : <ol id="dataT"> </ol> JavaScript : function GetData(index) { var xhttp = new XMLHttpRequest(); xhttp.onre ...

javascripthtmljson

Error: The react.js application is unable to access the property 'classList' of a null object

I've encountered a bug that's been causing me some trouble. Every time I try to run my react application, I keep getting an error message that reads TypeError: Cannot read property 'classList' of null. As someone who is new to react, I& ...

javascriptreactjs

Using ReactJS to pass an onClick event to a different component

Is there a way to implement the onClick event on an anchor tag to update state in another component? Utilizing onClick in Card.js Component import React from 'react' import PropertyLightbox from '../global/PropertyLightbox' const Car ...

javascriptreactjs

What is the best way to retrieve the js window object within emscripten's EM_JS function?

I'm looking to access the window.location in an EM_JS method in order to call a JavaScript method from C++. My attempted approach was: EM_JS(const char*, getlocation, (), { let location = window.location; let length = lengthBytesUTF8(location ...

javascriptc++webassemblyemscripten

java code unicode feature in csharp

Here's the code I am using: $(document).ready(function () { var breadCrumps = $('.breadcrumb'); breadCrumps.find('span').text("<%= ArticleSectionData.title %>"); }); The 'title' property contains values en ...

c#javascriptjqueryasp.netunicode

Creating dynamic dropdowns with Ajax and HTML on the code side

I have developed a script that generates a drop-down menu and updates the .box div with a new color and image. Below is the HTML & Java code: <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> <div> ...

javascriptjqueryhtmlcss

Beginner's guide to integrating the @jsplumb/browser-ui into your Vuejs/Nuxtjs project

I am working on the integration of @jsplumb/browser-ui community edition into my application. After receiving a recommendation from the team at jsplumb, I decided to utilize @jsplumb/browser-ui. However, I am facing difficulty in understanding how to begin ...

javascriptvue.jsnuxt.jsjsplumb

How can I configure a unique error log format in Winston?

I am facing an issue with the default error log format in Winston, as it includes too much unnecessary information such as date,process,memoryUsage,os,trace. How can I remove these unwanted details from the log? logging.js const express = require('e ...

javascriptnode.jsexpresswinston

Bootstrap 2.0.3: Accordion Collapse feature no longer functioning

Previously, my accordion functioned perfectly with Bootstrap 2.0.2, utilizing data-toggle="collapse" and data-parent="#selector". However, after upgrading to version 2.0.3, the accordion stopped working as expected. While it still opens and closes the des ...

javascripttwitter-bootstraphtml-tableaccordion

Retrieve the data stored in an array of objects

code props.thumbnails.forEach(value=>{ console.log(value.photo.thumbnail_url); }) error TypeError: Cannot read property 'thumbnail_url' of undefined Trying to loop through props.thumbnails array and access the thumbnail_url pro ...

javascriptreactjsforeachjsx

Decoding JSON using Android Facebook SDK

I am having trouble parsing JSON code while working with the Facebook SDK on Android. Despite watching numerous tutorials, I still find myself struggling. { "id": "1000004577", "friends": { "data": [ // JSON data here ] } ...

androidjsonfacebookfacebook-graph-api

What is the best way to display a particular JavaScript variable in an HTML document?

Is there a way to display the value of a Javascript variable in an HTML form, such as showing it on the screen? Below is my JavaScript code: <script type="text/javascript"> var howLongIsThis = myPlayer.duration(); </script> The variable howL ...

javascripthtml

Is there a way to incorporate multiple plan tiers on Stripe's platform?

//api/stripe import { auth, currentUser } from "@clerk/nextjs/server"; import { NextResponse } from "next/server"; import { prismadb } from "@/lib/prismadb"; import { stripe } from "@/lib/stripe"; import { absoluteUr ...

javascriptnext.jsstripe-payments

Obtain a collection of keys that share identical values

In my JavaScript code, I have an array of objects structured like this: objArray = [ {"date":"07/19/2017 12:00:00 AM","count":"1000","code":"K100"}, {"date":"07/21/2017 12:00:00 AM","count":"899","code":"C835"}, {"date":"07/23/2017 12:00:00 AM","cou ...

javascriptarraysjson

Errors in Javascript unit testing: despite being stubbed, functions are still being activated

I have encountered issues while writing unit tests, and I am currently facing errors that I am trying to troubleshoot. The specific unit test concerns the index.ts file, which calls the features/index.ts file. To simulate the default export from features/ ...

javascripttypescriptunit-testingsinon

Obtain the template as a string within Vue

Let's examine the scenario of having a single file component in Vue with the following structure: // Article.vue <template> <div> <h1>{{title}}</h1> <p>{{body}}</p> </div> </template> If w ...

javascriptvue.js

How to reset or clear the RangePicker in Ant Design for React

I am working with a component similar to this one and I am looking for a way to make it automatically reset after the user selects a date. Currently, once a date is selected, it remains as is until manually cleared. Current behavior: https://i.sstatic.ne ...

javascriptreactjsdateantd

A step-by-step guide on toggling between light mode and dark mode using water.css

Implementing the water.css on my website, I have this JavaScript code: function setTheme(themeName) { localStorage.setItem('theme', themeName); document.documentElement.className = themeName; } // function to toggle between light and dark ...

javascripthtmlcss