Access-Control-Allow-Origin Fehler bei Verwendung von Behance API + Queryloader?

Question

Das ist interessant. Ich benutze die Behance API, um einige Daten von meinem Profil dort anzurufen, um ein kleines Portfolio-Karussell zu machen. Ich fing an, diese Fehler zu kontrollieren, nachdem ich QueryLoader2 auf meiner Webseite hinzugefügt:

Ich versuchte <?php header('Access-Control-Allow-Origin: *'); ?> an die Spitze meiner Seite hinzufügen, aber keine Änderungen.

Dann habe ich versucht, Header set Access-Control-Allow-Origin * zu meiner .htaccess-Datei hinzuzufügen, um noch keinen Nutzen zu haben.

Einige mehr Code, die hilfreich sein könnten:

Queryloader JavaScript:

<script src="https://cdn.jsdelivr.net/jquery.queryloader2/2.3/jquery.queryloader2.min.js" type="text/javascript"></script> 
<script> 
$(document).ready(function() { 
    $("body").queryLoader2({ 
     percentage:true 
    }); 
}); 
</script> 

Behance API Bootstrap Portfolio Script:

$(function() { 

    var beUsername = 'josephrobee27e', 
     beApiKey = 'ugCqRrCuAuHAD6gvDTmegYXLxO2lWVca', 
     bePerPage = 25, 
     beProjectAPI = '//www.behance.net/v2/users/' + beUsername + '/projects?callback=?&api_key=' + beApiKey + '&per_page=' + bePerPage, 
     beItemWidth = 360, 
     beItemHeight = 282, 
     beLazyLoad = true, 
     beLinkTarget = '_self'; 

    /** 
    * Get Data from Behance API 
    */ 
    if (sessionStorage.getItem('behanceProject')) { 
     setPortfolioTemplate(); 
    } else { 
     // Load JSON-encoded data from the Behance API & Store it in sessionStorage 
     $.getJSON(beProjectAPI, function (project) { 
     sessionStorage.setItem('behanceProject', JSON.stringify(project)); 
      setPortfolioTemplate(); 
     }); 
    } 

    /** 
    * Populate Data 
    */ 
    function setPortfolioTemplate() { 
     var projects = JSON.parse(sessionStorage.getItem('behanceProject')).projects; 
     var portfolio = $('.be__portfolio').html(''); 
     var items = ''; 
     var image = ''; 
     var viewmorelink = ''; 

     $.each(projects, function (i, val) { 
      // If Lazy load is enabled, edit the markup accordingly 
      beLazyLoad ? image = 'src="images/loading.png" data-lazy="' + val.covers.original + '"' : image = 'src="' + val.covers.original + '"'; 

      // Create the items template 
      items += '<div class="be__item be__item__' + val.id + ' col-lg-4 col-md-4 col-sm-6 col-xs-12 desc">'; 
      items += '<div class="project-wrapper">'; 
      items += '<div class="project">'; 
      items += '<div class="photo-wrapper">' 
      items += '<div style="position: relative;padding-bottom: 69%;height: 0;" class="photo">'; 
      items += '<a class="fancybox" target="_blank" href="' + val.url + '" title="' + val.name + '" target="' + beLinkTarget + '">'; 
      items += '<div style="background-image:url(\''+ val.covers.original +'\');background-size:cover;background-position:center;background-repeat: no-repeat;width:370px;height:255px;max-width:100%;position:absolute;top:0;left:0;width:100%;height:100%;"></div>'; 
      items += '</a>'; 
      items += '</div>'; 
      items += '<div class="overlay"></div>'; 
      items += '</div>'; 
      items += '</div>'; 
      items += '</div>'; 
      items += '</div>'; 

      // How many items are shown 
      if ($(".be__slider")[0]){ 
      return i < 8; 
      }else{ 
       return i < bePerPage; 
      } 
     }); 

     // Append items only once 
     portfolio.each(function (index, el) { 
      $(el).append(items); 
      if ($(".be__slider")[0]){ 
      viewmorelink += '<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12 desc">'; 
       viewmorelink += '<div class="project-wrapper">'; 
       viewmorelink += '<div>'; 
       viewmorelink += '<div style="position: relative;padding-bottom: 69%;height: 0;">'; 
       viewmorelink += '<div class="photo vertical-center" style="background-color:#206182;width:370px;height:255px;max-width:100%;position:absolute;top:0;left:0;width:100%;height:100%;">'; 
       viewmorelink += '<a href="http://josephrobertsdesigns.com/index.php/portfolio" class="btn btn-default">'; 
       viewmorelink += '<h2 style="margin-top:0;margin-bottom:0;"><i class="fa fa-clone"></i> View Entire Portfolio</h2>'; 
       viewmorelink += '</a>'; 
       viewmorelink += '</div>'; 
       viewmorelink += '</div>'; 
       viewmorelink += '</div>'; 
       viewmorelink += '</div>'; 
       viewmorelink += '</div>'; 
       $(el).append(viewmorelink); 
      } 
     }); 

     // Create Lazy Load instance for Grid Layout 
     if (beLazyLoad) { 
      var layzr = new Layzr({ 
       container: '.be__grid', 
       selector: '[data-lazy]', 
       attr: 'data-lazy' 
      }); 
     } 

     $(document).ready(function(){ 

     $('.be__slider').slick({ 
      infinite: true, 
      slidesToShow: 3, 
      slidesToScroll: 1, 
      lazyLoad: 'ondemand', 
      prevArrow: '<div class="slick-prev"><i style="color:#206182;font-size: 28px;" class="fa fa-chevron-left"></i></div>', 
      nextArrow: '<div class="slick-next"><i style="color:#206182;font-size: 28px;" class="fa fa-chevron-right"></i></div>', 
      responsive: [{ 
       breakpoint: 768, 
       settings: { 
        slidesToShow: 2, 
        slidesToScroll: 1, 
        arrows: false 
       } 
      }, { 
       breakpoint: 480, 
       settings: { 
        slidesToShow: 1, 
        slidesToScroll: 1, 
        arrows: false, 
       } 
      }] 
     }); 

     });; 

    } 

}); 

scheinen wurden keine Ressourcen auf jemanden zu finden erfahren ein ähnliches Problem. Mein QueryLoader hängt auch bei 94% fest und ich vermute, dass es etwas damit zu tun hat. Irgendein Einblick? Vielen Dank.

Answer 1

Ok, habe keine Ahnung, wie das behoben wurde. Aber im Grunde habe ich festgestellt, dass es seit der letzten Aktualisierung von Queryloader2 CDN einige neue Versionen gab. Also habe ich die gedehnte Version auf meinem Server gehostet und stattdessen angerufen, und das Problem wurde behoben.