Empty AJAX response when URL works fine in browser

dramus
Community Novice

I'm trying to retrieve Canvas data for a project where I work, which self-hosts Canvas for its faculty and students. I'm using Fetch API (but have tried with other ajax methods too). However, anytime I try to GET something I just get an empty response back. Body is null and statusText is empty. 

The thing that's weird is if I access the URL directly in my browser, I see the JSON just fine. But when I Fetch with the exact same URL I just see an empty response. For example, in the browser https://canvas.uchicago.edu/api/v1/users/self shows me my ID, name, sortable name, etc. Hitting that with a GET fetch gives just an empty response.

Status of the call is 200 and I'm not getting any CORS errors or anything like that, so as far as I can tell it's going through OK.

Any thoughts?

Thanks everybody!!

var token = // my temp token here
var url = 'https://canvas.uchicago.edu/api/v1/users/self/';

var headers = new Headers();
headers.append('X-Requested-With','XMLHttpRequest');
headers.append('Authorization',`Bearer ${token}`);

var options = {
  method: 'GET',
  headers:headers,
  credentials: 'same-origin',
  mode:'no-cors'
}

fetch(url, options).then(function(response) {
  console.log(response);
})‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

261157_response.PNG

Labels (1)