Chrome webextensions: how to get content-length header using fetch api

I’m developing a chrome webextension and I’m trying to use fetch api to get content-length header using a code similar with

fetch("http://example.com/", {
    method: "GET"
}).then(response => console.log(response.headers.get("content-length")));

But I get a null value in console. Why?

Other info:

  • I have permission in extension manifest
  • The same code works ok in firefox version of this webextension
  • The XMLHTTPRequest variant works ok in chrome, so probably I’m missing some extra parameters to fetch function

Chrome Extension onload

Just started looking into chrome extensions, i followed the docs and got it loaded in the browser, i wanted to make a fetch call when the user clicks the button in the address bar, all the docs who examples of onclick events, so i changed it to a onload event, however it does not seem to be working, ive pasted my code below for the popped up state. is this the right way to do this, just basically or have a missed something?



  
    Welcome
  

  




    

Test Extension

go to website

Nam eu est ac urna tincidunt viverra. Vivamus vel condimentum ex, vel scelerisque risus. Suspendisse id est odio. Proin a velit eu lectus molestie interdum non non sapien. Etiam lacinia feugiat consequat. Nulla vel nulla eleifend, molestie lacus sit amet, viverra diam. Vivamus mattis euismod velit. Praesent iaculis tincidunt lobortis. Proin pulvinar auctor vehicula. Sed ac justo vitae ex aliquam aliquet id quis lacus.

Can’t return JSON field from Fetch response.json() (but can see it from console.log)

I’m developing a Chrome extension and in my background.js i have a function

async function getData() {
  var resp = await (await fetch("https://www.example.com/json")).json();
  console.log(resp.field);
  alert(resp.field);
  return resp.field;
}

When i call the function (var x = getData()) alert and console.log show the content of the field (expected behavior), but then it returns a resolved Promise object. What am i missing?

Why can browser extensions use “fetch” without cross-origin permissions?

When XMLHttpRequest is being used to do cross-origin requests, permissions are required via manifest.json, as stated here: https://developer.chrome.com/apps/xhr

But when using fetch, it doesn’t need it and can requests to all ressources.

What makes fetch different than XMLHttpRequest that it works without persmissions? Or is that just bug?

Set cookies from different hostnames does not work with fetch

For the context i am developing an app using Server side rendering and i need to access my cookies on server side to make authenticated api calls.

I’m trying to make api calls to another domain using fetch api with cross-fetch configured to handle cors.

Here are the issues:

First on chrome in network panel i only have the options request displayed but i still retrieve the data in my code so technically it’s working but i can’t see it in chrome why? (Usually with cors i can see the second request so i may have missed something)

Second considering i am on localhost and i make a request to anotherdomain.com my cookies are set on localhost by when i refresh i don’t have them anymore why?

Here is the code i am using to configure fetch request:
https://gist.github.com/Paul-louisB/7170b62daf9ec02b2fac7ea901efefaa

And here are the headers i have in my response: enter image description here

Thanks!