Jump to content
Sign in to follow this  
Daniel On The Web

XML DOM Problem

Recommended Posts

Hello and thank you all for bringing me into this forum. I would want to make a website about video games with news, articles, login system, etc., and I'm learning to make it with W3Schools.
My issue is with the XML DOM. I tried to use JavaScript to add XML data (in the form of a news list) to my HTML page, so I used the following JavaScript code:

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
    newsDisplay(xhttp);
    }
};
xhttp.open("GET", "news.xml", true);
xhttp.send();
 
function newsDisplay(xml) {
    var xmlDoc, maxNews, txt, titles, dates;
xmlDoc = xml.responseXML;
maxNews = 5;
txt = "";
titles = xmlDoc.getElementsByTagName("title");
dates = xmlDoc.getElementsByTagName("date");
for (i = 0; i < maxNews; i++) {
 txt += '<a href="news/news_' + + '.html"><div class="news_block">' +
 '<div class="news_title">Noticia' + titles[i].childNodes[0].nodeValue + '</div>' +
 '<div class="news_date">Fecha' + dates[i].childNodes[0].nodeValue + '</div></div></a>';
}
document.getElementById("news").innerHTML = txt;
}

Being:

  • news.xml the file where the news come from, with the <title> and <date> tags in each of the news
  • maxNews the number of news to show in the list (from the first ones in the XML)

But when I test my web page, the console says: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

.

Thank you for any help.

Share this post


Link to post
Share on other sites

You probably should run this on a server. Local AJAX requests are blocked by some browsers for security reasons.

 

If your code is not

xhttp.open("GET", "news.xml", true);

but rather

xhttp.open("GET", "http://example.com/news.xml", true);

then this is not permitted, you can only access files on your site's domain name.

 

There's only one way to load files from example.com with AJAX, and that's by configuring the example.com server to send an Access-Control-Allow-Origin HTTP header.

Share this post


Link to post
Share on other sites

 

You probably should run this on a server. Local AJAX requests are blocked by some browsers for security reasons.

If your code is not

xhttp.open("GET", "news.xml", true);

but rather

xhttp.open("GET", "http://example.com/news.xml", true);

then this is not permitted, you can only access files on your site's domain name.

There's only one way to load files from example.com with AJAX, and that's by configuring the example.com server to send an Access-Control-Allow-Origin HTTP header.

 

So I should create a server using a domain, and then configure it to send an Access-Control-Allow-Origin HTTP header. Am I right?

Share this post


Link to post
Share on other sites

No, the access control header is not necessary if the XML file is on the same server as the page that is requesting it.

 

All you need to do is have both files on a server. Download XAMPP or something similar and set up a test server on your own computer.

Share this post


Link to post
Share on other sites

So, in order to solve the issue, I have to:

  • Download XAMPP or something similar and set up a test server on my own computer.
  • Make sure the page and the XML are both in that server.

I have downloaded XAMPP, but now the question is, how do I create my test server?

Edited by Daniel On The Web

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...