Using the contents of a public GitHub raw in a textarea

Viewed 58

I have a html page where the user is supposed to enter an url to a public GitHub raw in an input form (the id "url" below); I then want to display the code in the page that the url points to in my page's text area (the id "program" below).

The snippet generates the error "Cross origin requests are only supported for HTTP." which I understand is for security reasons. Can anybody suggest the proper way to do this?

Cheers/JC

function urlButtonClicked(){

    var xhttp = new XMLHttpRequest();
    var theUrl;
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            theUrl = document.getElementById("url").value;
            document.getElementById("program").value = xhttp.responseText;
        }
    };
    xhttp.open("GET", theUrl, true);
    xhttp.send();

}

EDIT

Never mind. I got it to work by changing the code above to:

function urlButtonClicked(){

    var theUrl = document.getElementById("url").value;
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            document.getElementById("program").value = xhttp.responseText;
        }
    };
    xhttp.open("GET", theUrl, true);
    xhttp.send();

}
1 Answers

Yes it is possible. Had this in notes:

fetch('https://api.github.com/repos/webdev23/source_control_sentry/readme')
  .then(v => v.json()).then((function(v){
     //console.log(v)
     out.innerHTML = atob(v['content'])
  })
)
<div id="out"></div>

Cross origin requests are only supported for HTTP.

This error is a limitation of CORS request. The Github allows cross origin requests (CORS enabled), but your page must be https://.

Related