javascript - fetch API returning an empty string

Question

I am trying to get a page's HTML using fetch API. Here is my code.

var quizUrl = 'http://www.lipsum.com/';
var myHeaders = new Headers();
myHeaders.append('Content-Type', 'text/html');
fetch(quizUrl,{
    mode: 'no-cors',
    method: 'get',
    headers: myHeaders
}).then(function(response) {
    response.text().then(function(text) {
        console.log(text);
    })
}).catch(function(err) {
  console.log(err)
});

It returns empty string. Any guesses why it doesn't work?

Answer 1

I guess this might help, use as below:

fetch('/url/to/server')
.then(res => {
    return res.text();
})
.then(data => {
    $('#container').html(data);
});

And in server side, return content as plain text without setting header content-type.

I used $('#container') to represent the container that you want the html data to go after retrieving it.

The difference with fetching json data is using res.json() in place of res.text() And also, don't append any headers