I am currently working on an Angular application that utilizes OneDrive/Sharepoint for file storage. Authentication is functioning properly, and I can successfully save files. However, I am encountering an issue when attempting to download a file created and stored using the Angular HttpClient.
The code snippet in question is as follows:
export class MicrosoftService {
private graphUri = 'https://graph.microsoft.com/v1.0';
constructor(private http: HttpClient) {}
public loadFile(id: string, next: (saved: string) => void): void {
this.http.get(this.graphUri + '/me/drive/items/' + id + '/content', { headers: this.getOAuthHeader() })
.subscribe((response: any) => {
console.log(response.toString());
next(response.toString());
});
}
getOAuthHeader(): HttpHeaders {
// code generating OAuth headers, functions correctly
}
}
It's clear that further processing of the response will be needed once it can be received.
The issue arises when the GET
request is initiated, leading to a correct request to Graph, which then results in a 302 redirect to
https://foozlecorporation-my.sharepoint.com/drive/path/_layouts/15/download.aspx?UniqueId=a-bunch-of-url-params
. While downloading content from a REST client works smoothly, attempts to do so in the browser (currently Safari) trigger a Browser cannot load [...url...] due to access control checks
error upon encountering the redirect.
Although my application headers include Access-Control-Allow-Origin: *
, allowing usage of Graph initially, the Sharepoint response does not contain Access-Control-Allow-Origin
. What additional steps should I take?