Javascript 如何将API脚本(来自Dribble)添加到我的Gatsby站点

Javascript 如何将API脚本(来自Dribble)添加到我的Gatsby站点,javascript,gatsby,Javascript,Gatsby,我想把我的运球帖子放到我的盖茨比网站上 我在这篇文章中遵循了教程,在这里我从Dribble生成了我的访问令牌(一个允许我的gatsby站点访问我的Dribble帖子的唯一代码) 在我的盖茨比站点中,我很难找到在哪里添加调用API的脚本 我曾尝试将它粘贴到我的gatsby-node.js文件中(过去我认为脚本应该放在这里) 我是个新手。。如果调用运球API的脚本如下所示: // Set the Access Token var accessToken = '9f061d26c5a8be96b17a

我想把我的运球帖子放到我的盖茨比网站上

我在这篇文章中遵循了教程,在这里我从Dribble生成了我的访问令牌(一个允许我的gatsby站点访问我的Dribble帖子的唯一代码)

在我的盖茨比站点中,我很难找到在哪里添加调用API的脚本

我曾尝试将它粘贴到我的gatsby-node.js文件中(过去我认为脚本应该放在这里)

我是个新手。。如果调用运球API的脚本如下所示:

// Set the Access Token
var accessToken = '9f061d26c5a8be96b17a81718959a67dd54ca9669ca41752777193f7cc5be7c3';

// Call Dribble v2 API
$.ajax({
    url: 'https://api.dribbble.com/v2/user/shots?access_token='+accessToken,
    dataType: 'json',
    type: 'GET',
    success: function(data) {  
      if (data.length > 0) { 
        $.each(data.reverse(), function(i, val) {                
          $('#shots').prepend(
            '<a class="shot" target="_blank" href="'+ val.html_url +'" title="' + val.title + '"><div class="title">' + val.title + '</div><img src="'+ val.images.hidpi +'"/></a>'
            )
        })
      }
      else {
        $('#shots').append('<p>No shots yet!</p>');
      }
    }
});
我如何添加脚本,以便API脚本在运球中调用我的投篮链接回它


我原以为这是一个简单的解决方案,但我已经为运球/盖茨比的融合挣扎了好几天了(

您是否考虑过使用该产品从运球api采购?您是否考虑过使用该产品从运球api采购?
const path = require('path');
const { createFilePath } = require('gatsby-source-filesystem');

// Look at every node when it is created
exports.onCreateNode = ({node, getNode, actions}) => {
    // Check for markdown nodes
    const { createNodeField } = actions;
    if(node.internal.type === 'MarkdownRemark') {
        // Create a slug out of the markdown filepath name
        const slug = createFilePath({
            node,
            getNode,
            basePath: 'projects'
        });
        // Add the newly created slug to the node itself
        createNodeField({
            node,
            name: 'slug',
            value: `/project${slug}`
        });
    }
};

exports.createPages = ({ graphql, actions }) => {
    const { createPage } = actions
    return new Promise((resolve, reject) => {
      graphql(`
        {
          allMarkdownRemark {
            edges {
              node {
                fields {
                  slug
                }
              }
            }
          }
        }
      `).then(result => {
        result.data.allMarkdownRemark.edges.forEach(({ node }) => {
          createPage({
            path: node.fields.slug,
            component: path.resolve(`./src/templates/project.js`),
            context: {
              // Data passed to context is available in page queries as GraphQL variables.
              slug: node.fields.slug,
            },
          })
        })
        resolve()
      })
    })
    };