首页 > 解决方案 > 如何使用 apollo 在 nuxt express 中间件中向我的 shopify graphql.json 发出 graphql 请求?

问题描述

因此,我在 nuxt 中制作了一个快速服务器中间件,并制作了一个 graphql 查询,它将通过 shopify 的产品句柄(通过 slug 获取产品)获取我的数据。但是我一直遇到 500 和 400 个状态代码错误,这些错误没有提供我的代码中的问题所在。有时,请求甚至处于待处理状态。这是我的代码:

<script>
   //This is my vue component
   import axios from 'axios';
      // import { productByHandle } from '~/apollo/queries/productByHandle'
   export default {
       
        data() {
            return {
                product: {},
                handle: String
            }
        },
        
         async mounted() {
            this.handle = this.$route.params.handle
            // console.log(this.$apollo.query)
            // const query = await this.$apollo.query({
            //   query: productByHandle,
            //   variables() {
            //     return {handle: this.$route.params.handle}
            //   }
            // })
            // console.log(query) 
            console.log(this.handle) 
          // this.oneProduct = this.$apollo
          // console.log(this.$route.query)
          const result = await axios.post('/api/shopify/graphql')
          // , {
          //       params: {
          //           handle: "test"
          //       }
            // }
          console.log(result)
          //  this.product = result.data.product
        },
        
        // apollo: {
        //   $loading: true, 
        //   productByHandle: {
        //     prefetch: true,
        //     query: productByHandle,
        //     variables () {
        //         return { handle: this.$route.params.handle }
        //     }
        //   },
        // },

       
    }
    </script>
    

这是我的快速服务器中间件:

const { Router } = require('express')
const router = Router()
const axios = require('axios')
const url = require("url");
const gql = require('graphql-tag')
const bodyParser = require('body-parser')

router.post('/shopify/graphql', async (req, res, next) => {
  // const queryData = url.parse(req.url, true).query
   const graphQuery = gql` query productByHandle ($handle: String!) {
     productByHandle(handle: "arcteryx-covert-lt-pullover-trui") {
         id
         title
        handle
    }
  }`;
  const shopify = await axios.post('https://<shop_id>:<shop_password>@<shop_name>.myshopify.com/admin/api/2021-10/products.json',{
    query: graphQuery,
  });

})




module.exports = router

我的路由文件中的 index.js(导入路由并使用它们):

const express = require('express')

// Create express instance
const app = express()

// Require API routes
const shopify = require('./routes/shopify')

// Import API Routes
app.use(shopify)

// Export express app
module.exports = app

// Start standalone server if directly running
if (require.main === module) {
  const port = process.env.PORT || 4000
  app.listen(port, () => {
    // eslint-disable-next-line no-console
    console.log(`API server listening on port ${port}`)
  })
}

我在控制台中遇到的错误

所以我不知道如何通过我的 express 中间件查询我的 shopify 数据,我已经尝试了 1.5 天并且我没有想法(我也是服务器中间件,graphql 的新手,我还不太擅长 javascript .)。

标签: node.jsexpressgraphqlnuxt.jsshopify

解决方案


推荐阅读