I have a react app hosted in an s3 bucket behind a cloudfront distribution. This talks to a django server. Login works correctly on all browsers (confirmation that credentials are correct, and no fundamental connection issues). Once logged in, the app redirects to a page that does a simple GET request via fetch (to a url that requires authentication). This works successfully on all browsers on desktop (macos) except safari, which gets a 401 unauthorised error. Similarly, I get a 401 unauthorised error on every browser on iOS.
I've tried flushing the DNS of the mac, to no avail. I'm totally stumped. If it didn't work at all, that would be fine, but working everywhere apart from safari?
fetch code:
componentDidMount() {
fetch(`${apiRoot}/info`, {
method: "GET",
headers: {
Accept: "application/json",
"Content-Type": "application/json",
Authorization: `Token ${this.props.auth.token}`
}
})
.then(response => response.json())
.then(data => {
this.setState({
Name: data.name,
Email: data.email
});
});
}