Hello, I am encountering a small problem with the API key. I would like to fetch data from a file located in a SharePoint library using JavaScript. I created an application on SharePoint and granted it the following permissions: ** I used Postman to generate an access token, but when I try to use this access token, it doesn't work either on Postman or in JavaScript. I successfully generated an access token, but when I try to use it, I encounter an error. Error on Postman: Error on JS (Here is my JavaScript code: Could you please help me resolve this issue? Thank you.

Hi @ MOUSSAOUI Mohammed The 00000002-0000-0000-c000-000000000000 is the application ID for Azure AD Graph API, which has been deprecated and cannot be used to call MS Graph API. You should request a token for MS Graph API, please follow this documentation . Additionally, if the audience of the token you request in JS is MS Graph API, do not apply it to SharePoint REST API, otherwise it will still throw a 401 error. Hope this helps. If the reply is helpful, please click Accept Answer and kindly upvote it. If you have additional questions about this answer, please click Comment .

Microsoft Graph API error: Access token validation failure. Invalid audience.

Answer accepted by question author

CarlZhao-MSFT 46,411 Reputation points

2024-08-21T02:37:18.9166667+00:00

Hi @MOUSSAOUI Mohammed

The 00000002-0000-0000-c000-000000000000 is the application ID for Azure AD Graph API, which has been deprecated and cannot be used to call MS Graph API. You should request a token for MS Graph API, please follow this documentation.

Additionally, if the audience of the token you request in JS is MS Graph API, do not apply it to SharePoint REST API, otherwise it will still throw a 401 error.

Hope this helps.

If the reply is helpful, please click Accept Answer and kindly upvote it. If you have additional questions about this answer, please click Comment.
Please sign in to rate this answer.

1 person found this answer helpful.
MOUSSAOUI Mohammed 40 Reputation points

2024-08-21T07:40:48.5533333+00:00

Hello,

Thank you for your response. I used these settings, which generated an access token for me, but when I try to use it, I still encounter an error.

Could you please help me resolve this issue?

Thank you

CarlZhao-MSFT 46,411 Reputation points

2024-08-21T07:46:28.55+00:00

This is because you lack the necessary permissions. Try giving the Sites.ReadWrite.All application permission for your app and grant admin consent.

MOUSSAOUI Mohammed 40 Reputation points

2024-08-21T07:47:45.93+00:00

Hello,

Thank you for your response. I used these settings, which generated an access token for me, but when I try to use it, I still encounter an error.

Could you please help me resolve this issue?

Thank you

CarlZhao-MSFT 46,411 Reputation points

2024-08-21T08:41:05.4933333+00:00

Hi @MOUSSAOUI Mohammed

Is the issue solved?

MOUSSAOUI Mohammed 40 Reputation points

2024-08-21T09:06:19.83+00:00

thanks @CarlZhao-MSFT, I added the permission you told me, now with Postman it works, but with javascript I get a 401 error.

Error JS :

Code JS :

CarlZhao-MSFT 46,411 Reputation points

2024-08-21T09:39:08.68+00:00

Hi @MOUSSAOUI Mohammed

As I mentioned in my answer, do not use the Graph API token to call the SharePoint REST API, otherwise it will throw a 401 error. You should use that token to call the Graph API or request a dedicated token for the SharePoint REST API.

MOUSSAOUI Mohammed 40 Reputation points

2024-08-21T10:08:31.28+00:00

Can you tell me how to do this please, it's the first time I've used this.

$(document).ready(function() { fetchCSV(); }); async function fetchCSV() { const siteUrl = "https://awex.sharepoint.com"; const fileUrl = "/sites/Intranet/Documents%20partages/AdUserlast180days.csv"; const accessToken = ''; try { const response = await fetch(`${siteUrl}/_api/web/GetFileByServerRelativeUrl('${fileUrl}')/$value`, { method: 'GET', headers: { 'Authorization': 'Bearer ' + accessToken, 'Accept': 'text/csv', }, mode: 'no-cors' }); if (!response.ok) { throw new Error(`Erreur HTTP ! Statut : ${response.status}`); } const csvData = await response.text(); console.log(csvData); console.log('Fichier chargé avec succès'); // Traitez le CSV si nécessaire // Par exemple, utilisez PapaParse pour l'analyser // const parsedData = Papa.parse(csvData, { header: true }); // console.log(parsedData); } catch (error) { console.error('Erreur lors de la récupération du fichier CSV :', error); } }

CarlZhao-MSFT 46,411 Reputation points

2024-08-22T02:36:39.38+00:00

Hi @MOUSSAOUI Mohammed

It depends on which API you want to call.

If you want to call the SharePoint REST API, then keep the current script unchanged and pass a token with an audience for the SharePoint REST API.

When obtaining the token, you need to change the scope to:

POST /{tenant}/oauth2/v2.0/token HTTP/1.1 //Line breaks for clarity Host: login.microsoftonline.com:443 Content-Type: application/x-www-form-urlencoded client_id=00001111-aaaa-2222-bbbb-3333cccc4444 &scope=https://{tenant-name}.sharepoint.com/.default &client_secret=qWgdYAmab0YSkuL1qKv5bPX &grant_type=client_credentials

Please note that you need to grant your application the corresponding SharePoint REST API permissions in Azure AD, not the Graph API permissions.

If you want to call the Graph API, then keep the original token unchanged and modify your script as follows.

const graphUrl = "https://graph.microsoft.com"; const siteId = "xxxxxxxxxxxxxxxx"; const itemId = "xxxxxxxxxxxxxxxxx"; const accessToken = '{MS Graph API token}'; const response = await fetch(`${graphUrl}/sites/'${siteId}'/drive/items/'${itemId}'`)

By the way, I’m not a JS expert, so you might need to make some other changes to your JS based on the actual call.

Additionally, if you want to know which API your token belongs to, you can decode the current token using jwt.ms and check the aud claim.

MOUSSAOUI Mohammed 40 Reputation points

2024-08-30T09:00:39.4533333+00:00

Hello @CarlZhao-MSFT,

Merci pour ton aide.

I tried the second option but I get an error:

Here is my code:

$(document).ready(function() { fetchCSV(); }); async function fetchCSV() { const siteUrl = "https://......sharepoint.com"; const fileUrl = "/sites/....../......../AdUserlast180days.csv"; const graphUrl = "https://graph.microsoft.com"; const siteId = ".....sharepoint.com,78248ad1-96.......0a3"; const itemId = "01K2X..........AAT4F"; const accessToken = 'eyJ.......'; try { const response = await fetch(`${graphUrl}/sites/${siteId}/drive/items/${itemId}`, { method: 'GET', headers: { 'Authorization': 'Bearer ' + accessToken, 'Accept': 'text/csv', }, }); if (response.ok) { console.log('Fichier CSV chargé avec succès.'); // Exemple d'ajout d'un message de succès à l'élément HTML avec l'id "message" $('#message').text('CSV file loaded successfullyCSV file loaded successfully.').css('color', 'green'); aitez. const data = await response.text(); console.log(data); // Affiche le contenu du CSV dans la console } else { console.error('Error retrieving CSV fileError retrieving CSV file :', response.statusText); } } catch (error) { console.error('Error retrieving CSV fileError retrieving CSV file :', error); } }
Sign in to comment

Use comments to ask for clarification, additional information, or improvements to the question.