我的Behance API密钥无效

Question

I've tried to use a multitude of different scripts with my Behance API key to try and create an online portfolio updated automatically through my managing of my Behance Profile. 我尝试通过Behance API密钥使用多种不同的脚本来尝试创建通过管理我的Behance个人资料自动更新的在线投资组合。

The one I'm using now is the simplest I've found, using only jQuery, JSON, and is integrated with Bootstrap by Twitter. 我现在使用的是我发现的最简单的一种，仅使用jQuery，JSON，并与Twitter的Bootstrap集成。

Here's my source code: 这是我的源代码：

HTML: HTML：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>Bootstrap Portfolio with Behance API &amp; jQuery</title>

  <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
  <link href="//cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.5.8/slick.min.css" rel="stylesheet">
  <link href="//cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.5.8/slick-theme.min.css" rel="stylesheet">
  <link href="vendor/prism.css" rel="stylesheet">

  <!-- http://fontpair.co/ -->
  <link href="//fonts.googleapis.com/css?family=Quando|Judson" rel="stylesheet">

  <!-- Demo stylesheet -->
  <link href="demo.css" rel="stylesheet">
</head>

<body class="demo">

  <div class="demo-intro">
      <div class="container">
          <div class="row">
              <div class="col-lg-8 col-lg-offset-2">
                  <a href="http://siamkreative.com/">
                      <img src="https://secure.gravatar.com/avatar/f634817190acb57d0f3e61e7c68eabbb?s=160" alt="Julien Vernet" class="avatar img-circle">
                  </a>
                  <h1>Bootstrap Portfolio<br> with Behance API &amp; jQuery</h1>
                  <p class="lead">If you're using Behance to showcase your projects and you would like to embed your portfolio on your site, look no further.</p>
                  <p>This quick example show you how to retrieve your projects from Behance using their API, store the data in the browser, and display it using Bootstrap 3 markup. To render the template we use jQuery, but you could also use a template engine such as <a href="http://beebole.com/pure/">pure.js</a> or <a href="http://handlebarsjs.com/">handlebars</a>. Find the most suitable template engine <a href="https://garann.github.io/template-chooser/">here</a>.</p>
                  <div class="btn-group" role="group">
                      <a href="#grid" class="btn btn-lg btn-default">Grid Layout</a>
                      <a href="#slider" class="btn btn-lg btn-primary">Slider Layout</a>
                  </div>
              </div>
          </div>
      </div>
  </div>

  <div class="demo-grid" id="grid">
      <div class="container">
          <h2>Grid Layout <small>Using Bootstrap Grid</small></h2>
          <div id="be_grid" class="row be__portfolio be__grid">Loading...</div>
      </div>
  </div>

  <div class="demo-slider" id="slider">
      <div class="container">
          <h2>Slider Layout <small>Using Slick Carousel</small></h2>
          <div id="be_slider" class="row be__portfolio be__slider">Loading...</div>
      </div>
  </div>

  <div class="demo-source" id="source">
      <div class="container">
          <h2>Source code</h2>
          <!-- http://prismjs.com/plugins/file-highlight/ -->
          <pre class="line-numbers" data-src="https://raw.githubusercontent.com/SiamKreative/Bootstrap-Portfolio-Behance-API/master/jquery.behance.js"></pre>
      </div>
  </div>

  <div class="demo-comments">
      <div class="container">
          <div class="row">
              <div class="col-lg-8 col-lg-offset-2">
                <h3>Leave your feedback below :)</h3>
                <br>
                <div id="disqus_thread"></div>
              </div>
          </div>
      </div>
  </div>

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
  <script src="http://cdnjs.cloudflare.com/ajax/libs/layzr.js/1.4.3/layzr.min.js"></script>
  <script src="http://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.5.8/slick.min.js"></script>
  <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-smooth-scroll/1.5.6/jquery.smooth-scroll.min.js"></script>
  <script src="vendor/prism.js"></script>
  <script src="jquery.behance.js"></script>
  <script>
  $(function() {
    $('a').smoothScroll();
  });
  </script>
  <script>
  (function() {
    var d = document, s = d.createElement('script');
    s.src = '//siamkreative.disqus.com/embed.js';
    s.setAttribute('data-timestamp', +new Date());
    (d.head || d.body).appendChild(s);
  })();
  </script>

</body>
</html>

Here's the jQuery: 这是jQuery：

$(function () {

var beUsername = 'josephrobee27e',
    beApiKey = 'ugCqRrCuAuHAD6gvDTmegYXLxO2lWVca',
    bePerPage = 12,
    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 = '';

    $.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-4 col-xs-6 col-xxs-12">';
        items += '<a href="' + val.url + '" title="' + val.name + '" target="' + beLinkTarget + '">';
        items += '<img class="img-responsive" ' + image + ' width="' + beItemWidth + '" height="' + beItemHeight + '" alt="' + val.name + '">';
        items += '</a>';
        items += '</div>';

        // How many items are shown
        return i < bePerPage;
    });

    // Append items only once
    portfolio.each(function (index, el) {
        $(el).append(items);
    });

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

    // Slider Layout
    $('.be__slider').slick({
        infinite: true,
        slidesToShow: 3,
        slidesToScroll: 1,
        lazyLoad: 'ondemand',
        responsive: [{
            breakpoint: 768,
            settings: {
                slidesToShow: 2,
                slidesToScroll: 1
            }
        }, {
            breakpoint: 480,
            settings: {
                slidesToShow: 1,
                slidesToScroll: 1
            }
        }]
    });
}

});

I see no issues in the code. 我看不到代码中的任何问题。 However this is all that is displayed: 但是，这就是所有显示的内容： 屏幕截图

Lastly here's a screen shot of the JSON file it's pulling, so I know that it's printing the information the script requires: 最后，这是要提取的JSON文件的屏幕截图，所以我知道它正在打印脚本所需的信息：

屏幕截图

Any help will be seriously appreciated. 任何帮助将不胜感激。 I honestly have no clue what I'm doing wrong. 老实说，我不知道我在做什么错。 I included my username and API key because I thought maybe my account was set up wrong and maybe someone could help me with that also. 我提供了username和API key因为我认为我的帐户设置有误，也许有人可以帮助我。

Answer 1

出于任何原因证明该应用程序无法在本地计算机上运行。

我的Behance API密钥无效

问题描述

1 个解决方案

解决方案1
0 2016-08-13 18:52:10

我的Behance API密钥无效

问题描述

1 个解决方案

解决方案1 0 2016-08-13 18:52:10

解决方案1
0 2016-08-13 18:52:10