Home > Mobile >  CORS Issue Using jquery-rss to Parse XML
CORS Issue Using jquery-rss to Parse XML

Time:12-31

I'm trying to use jquery-rss to parse a blog's RSS feed, notably because of its ability to parse within XML nodes for nested HTML elements like images. I have this running perfectly locally (and ironically, since it's usually local development that gives me the most CORS grief):

<!DOCTYPE html>
<html>
<head>
  <meta name="viewport" content="width=device-width, initial-scale=1" /> 
  <title>jquery.rss example</title>
  <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script>
  <script src="jquery.rss.min.js"></script>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
  <script>
    jQuery(function($) {
      $("#rss-feeds").rss("https://blog.sonelp.com/rss.xml",
      {
        limit: 3,
        layoutTemplate: '<div ><div >{entries}</div><div ><a href="https://blog.sonelp.com">View archive</a></div></div>',
        entryTemplate: '<div ><div ><a  href="{url}">{title}</a><img  src="{teaserImageUrl}" /><span >{date}</span></div><div >{shortBodyPlain}</div><div ><a href="{url}"  target="_blank">Read more</div></div>'
      })
    })
  </script>
</head>
<body>
  <div id="rss-feeds"></div>
</body>
</html>

But once I add it to my website, I get the following "mixed content" error:

Mixed Content: The page at 'https://blah.com/' was loaded over HTTPS, but requested an insecure script 'http://www.feedrapp.info/?callback=jQuery16409576896732281612_1640639664174&q=https://blog.sonelp.com/rss.xml&num=3&_=1640639664276'. This request has been blocked; the content must be served over HTTPS.

Note that https is used for both the hosted site where I'm trying to run this code and the actual XML feed -- the issue is clearly jquery-rss' use of the same developer's Feedr replacement solution for Google's now-deprecated Feed API, which is called via http ("...requested an insecure script 'http://www.feedrapp.info..."). I tried correcting this in the jquery-rss script directly, to no avail. Any ideas on how to proceed here?

CodePudding user response:

Rory McCrossan got the answer right in the comments above: I had to ensure the Feedr call of the RSS feed I wanted to parse was using https, not http. It took some doing, but by deleting every instance of ssl and the references to it in this script and then ensuring the constructor for the URL included https by default fixed my issue and I no longer have mixed content errors.

  • Related