CORS标头来源不等于提供的标头来源

Question

因此，我正在建立一个用于上课的快速网站，该网站使用NASA LANDSAT API比较卫星图像。我一直遇到的问题是，有时网站会加载并正常运行，有时会给我这个错误：

CORS策略已阻止从源“ https://api.nasa.gov/planetary/earth/imagery?lon=-105.27054559999999&lat=40.0149856&date=2017-04-21&cloud_score=True&dim=.14&api_key=DEMO_KEY”访问“ http://creative.colorado.edu”处的XMLHttpRequest：“ Access-Control-Allow-Origin”标头的值为“ http://127.0.0.1:51612” '不等于提供的原点。

我立即注意到该值看起来很像本地值...我发现这很奇怪，因为所有内容都已上载到服务器，并且不再是本地值。 因为它是学校服务器，所以我无法编辑.htcaccess文件，所以我尝试将项目移到我自己的服务器theimmaculatesavage.com中，然后出现此错误：

CORS策略已阻止从源“ https://api.nasa.gov/planetary/earth/imagery?lon=-105.27054559999999&lat=40.0149856&date=2017-04-21&cloud_score=True&dim=.14&api_key=DEMO_KEY”访问“ http://www.theimmaculatesavage.com”处的XMLHttpRequest：“ Access-Control-Allow-Origin”标头的值为“ http://creative.colorado.edu” '不等于提供的原点。

现在，我感到非常困惑，因为请求似乎认为我仍然在colorado.edu服务器上，而我不是。

我尝试简化API调用，以便它不应触发CORS问题，毕竟它只是从API请求具有特定坐标的图像的url。那没用。我尝试使用其他方法进行调用（ajax，getjson，get），但没有一个起作用。

我不知道是什么设置了标头原点，或者为什么它将采用文件所位于的最后一个位置的值。我不精通PHP，并且对jQuery和Javascript具有一定的熟练度，但是这个问题使我感到非常困惑。

请帮助！

这是我的jQuery：

$(document).ready(function () {
//  var xhttp = new XMLHttpRequest();
//  xhttp.open();
//xhttp.setRequestHeader("Content-Type", "application/json; charset=UTF-8");
//xhttp.setRequestHeader("Access-Control-Allow-Origin", "*");
//xhttp.setRequestHeader("Access-Control-Allow-Methods", "GET, POST, PUT, OPTIONS");
//xhttp.setRequestHeader("Access-Control-Allow-Headers", "Content-Type");
//xhttp.setRequestHeader("Access-Control-Request-Headers", "X-Requested-With, accept, content-type");
  //VARIABLES
  var assets;
  var closestDate;
  var firstDate;
  var firstImageIndex;
  var secondImageIndex;
  var picDates;
  var stageOne = 0;
  var stageTwo = 0;
  var lat;
  var lon;
  //PAGE FADE IN
  $(".all").fadeIn(2000);

  //POPUP CLOSEOUT
  $("#close").click(function(){
    $(".popup").fadeOut(1200);
  });

  $(".subbut").click(function (e) {
    //SEARCH SUBMITTED
    if (stageOne == 0 && stageTwo == 0) {
      //INITIAL SEARCH FADES
      $(".popup").fadeOut();
      $("#earlierOne").hide();
      $("#laterTwo").hide();
      $("#laterOne").fadeIn(1200);
      $("#earlierTwo").fadeIn(1200);
    }
    $(".loading").fadeIn();
    e.preventDefault();
    var searchloc = $("#searchit").val();

    //GET COORDINATES FROM SEARCH
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({
      'address': searchloc
    }, function (results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        lat = results[0].geometry.location.lat();
        lon = results[0].geometry.location.lng();
        picDates = getPicList(lat, lon, function (results) {
          //SET ITERATORS AND CALL UPDATES
          firstImageIndex = 1;
          secondImageIndex = assets.length - 1;
          updateFirstImage();
          updateSecondImage();
        });
      } else {
        alert("Something got big wrong: " + status);
      }
    });
    return false;
  });

  $(".timebut").click(function () {
    //PREVIOUS NEXT BUTTONS
    if ($(this).data('name') == "fOne") {
      firstImageIndex++;
      updateFirstImage();
      $("#earlierOne").fadeIn(1200);
    } else if ($(this).data('name') == "bOne") {
      firstImageIndex--;
      updateFirstImage();
    } else if ($(this).data('name') == "bTwo") {
      secondImageIndex--;
      updateSecondImage();
      $("#laterTwo").fadeIn(1200);
    } else if ($(this).data('name') == "fTwo") {
      secondImageIndex++;
      updateSecondImage();
    }
    if (firstImageIndex <= 0) {
      $("#earlierOne").fadeOut();
    } else if (secondImageIndex >= assets.length - 2) {
      $("#laterTwo").fadeOut();
    }
  });

  function updateFirstImage() {
    //UPDATE ITERATOR
    firstDate = assets[firstImageIndex].date;
    updateImgOne(firstDate, lat, lon);
  }

  function updateSecondImage() {
    //UPDATE ITERATOR
    closestDate = assets[secondImageIndex].date;
    updateImgTwo(closestDate, lat, lon);
  }

  function updateImgOne(date, lat, long) {
    //DATE PARSE OLDEST IMG
    var shortDate = date.split('T')[0];
    $("#leftdate").text(shortDate);
    //GET JSON AND REPLACE IMG

    $.getJSON(`https://api.nasa.gov/planetary/earth/imagery?lon=${long}&lat=${lat}&date=${shortDate}&cloud_score=True&dim=.14&api_key=DEMO_KEY`,function(data){
      $("#imgone").css("background-image", "url('" + data.url + "')");
      $(".loading").fadeOut();
    });
//    $.get(`https://api.nasa.gov/planetary/earth/imagery?lon=${long}&lat=${lat}&date=${shortDate}&cloud_score=True&dim=.14&api_key=DEMO_KEY`).done(function (data) {
//      $("#imgone").css("background-image", "url('" + data.url + "')");
//      $(".loading").fadeOut();
//    });
//    $.ajax({
//            url: `https://api.nasa.gov/planetary/earth/imagery?lon=${long}&lat=${lat}&date=${shortDate}&cloud_score=True&dim=.14&api_key=DEMO_KEY`,
//            type: "GET",
//            crossDomain: false,
//            
//            dataType: "json",
//            success: function (response) {
//                $("#imgone").css("background-image", "url('" + data.url + "')");
//                $(".loading").fadeOut();
//                alert("Worked");
//            },
//            error: function (xhr, status) {
//                console.log(status);
//            }
//        });
  };

  function updateImgTwo(date, lat, long) {
    //DATE PARSE NEWEST IMG
    var shortDate = date.split('T')[0];
    $("#rightdate").text(shortDate);
    //GET JSON AND REPLACE IMG
//      $.get(`https://api.nasa.gov/planetary/earth/imagery?lon=${long}&lat=${lat}&date=${shortDate}&cloud_score=True&dim=.14&api_key=DEMO_KEY`).done(function (data) {
//      $("#imgtwo").css("background-image", "url('" + data.url + "')");
//      $(".loading").fadeOut();
//    });
    $.getJSON(`https://api.nasa.gov/planetary/earth/imagery?lon=${long}&lat=${lat}&date=${shortDate}&cloud_score=True&dim=.14&api_key=DEMO_KEY`,function(data){
      $("#imgtwo").css("background-image", "url('" + data.url + "')");
      $(".loading").fadeOut();
    });
  };

  function getPicList(lat, long, callback) {
    //GET ARRAY OF ASSETS FROM DATA
    $.getJSON(`https://api.nasa.gov/planetary/earth/assets?lon=${long}&lat=${lat}&begin=2014-02-01&api_key=ahVokrlHEN7EHTGRokekzQGL86CgcAM2ELyRP71q`,function(data){
      assets = data.results;
      callback();
      //RETURN THE ASSETS
    });
  }

  $(".app").mousemove(function (event) {
    //MOUSE WATCHER
    var bigw = $(window).width();
    var diff = bigw - event.clientX;
    $("#imgone").width(event.clientX);
    $("#imgtwo").width(diff);
  });

});