返回

Shopify API 报错解决：customerByIdentifier 字段不存在

javascript

Shopify 报错：QueryRoot 类型中不存在 customerByIdentifier 字段

最近遇到一个 Shopify Admin API 的问题，在尝试通过 customerByIdentifier 查询用户信息时，前端报了个错："Error: Field 'customerByIdentifier' doesn't exist on type 'QueryRoot'"。 代码和报错信息看上面，先别慌，咱们来一步步分析。

一、 问题原因分析

从报错信息来看，问题出在 GraphQL 查询语句上，提示 QueryRoot 类型里没有 customerByIdentifier 这个字段。 但是，在 Shopify GraphQL App 里用同样的查询语句又能正常获取到用户信息。这就有点奇怪了。

仔细对比一下两种情况的区别：

  1. 环境差异： Shopify GraphQL App 是 Shopify 官方提供的工具，环境配置和权限都是OK的。 而我们自己写的代码，运行环境是在我们自己的应用服务器上。
  2. API 版本： Shopify API 是有版本控制的，不同版本支持的 GraphQL schema 可能会有差异。 很有可能我们本地开发环境调用的 Shopify API 版本比较老，不支持 customerByIdentifier。
  3. Shopify App权限 : App没有相应的权限读取顾客数据。
  4. 代码问题？ : 即使不是上述原因，我们也要审视下代码是否有细节错误。

二、 解决方案

根据上面的分析，我们可以尝试以下几种解决方案：

1. 检查并更新 Shopify API 版本

首先要确认的就是 API 版本。老的 API 版本肯定不支持新的查询。

原理： Shopify 会定期更新 API，加入新功能和字段。 旧版本可能无法使用新特性。

操作步骤：

  1. 登录 Shopify 后台。
  2. 找到你的应用（Apps）。
  3. 点击应用名称，进入应用详情页面。
  4. 在左侧导航栏，找到 "App setup" (应用设置)。
  5. 查看 "API Access" 部分，应该可以看到当前使用的 API 版本，点击Configuration检查App的权限。
    比如 类似于:"Version: 2023-10" (每个版本维护时间为一年,选择最新的,同时确保Shopify库也是最新的)

修改为你正在使用的或者支持 customerByIdentifier 的最新 API 版本。（从2024-01开始支持customerByIdentifier）例如：

 // 在你的 Shopify 应用初始化配置中，更新 API 版本
 //(这里只给一个示例,实际路径看你具体的Shopify库，和项目结构）
 Shopify.Context.initialize({
 ...
   API_VERSION: ApiVersion.January24, //或者你测试出的能支持该字段的版本.
 ...
});

进阶建议： Shopify 建议使用不指定版本（unstable）的API，它会自动指向最新的稳定版本。但对于生产环境，还是推荐使用指定的稳定版本，避免因 API 自动升级导致兼容性问题。

2. 检查并配置应用权限 (App Scopes)

即使 API 版本正确，如果应用没有读取客户信息的权限，一样会报错。

原理： Shopify 通过权限范围 (scopes) 控制应用能访问哪些数据。需要明确授权才能访问特定数据。

操作步骤：

  1. 在 Shopify 后台，进入你的应用设置。

  2. 找到 "App setup"。

  3. 查看 "API Access" 部分，确保 read_customers 这个 scope 已经勾选。没有的话就勾上。

  4. 点击"save"

    对应的，在代码初始化的地方，也要确认已经请求了这个 scope。比如：

      //...之前的代码
 scopes: ['read_products', 'read_customers'], // 确保有 read_customers
  //...之后的代码

3. 确认 admin.graphql 的正确使用

虽然报错信息提示是 GraphQL 查询语句的问题，但也要确保调用 admin.graphql 的方式是正确的。

原理: 保证你请求的是正确的Shopify店铺的后台GraphQL

操作步骤及代码示例：

  • 确保你的admin对象正确获取了店铺信息并且有权限

    //在loader中确认,使用了正确的 admin 对象
 export const loader = async ({ request }: LoaderFunctionArgs) => {

  const admin = await authenticate.admin(request);
   //.....

  • 检查graphql 请求的内容,admin.admin.graphql确保不是打错字

4. 简化查询和逐步测试

有时候，复杂的查询语句可能会掩盖真正的问题。可以尝试简化查询，逐步排除问题。

原理： 从最简单的查询开始，逐步增加复杂度，更容易定位问题。

操作步骤：

  1. 先测试最基本的客户查询：

    query {
  customers(first: 5) {
    edges {
      node {
        id
        email
      }
    }
  }
}

    如果这个查询能正常工作，说明基本的 GraphQL 查询是没问题的。

  2. 再尝试使用 customerByIdentifier：

    把原来的查询语句里的 $query 直接替换成具体的 email 地址，先排除变量的问题：

      query {
    customerByIdentifier(identifier: {emailAddress: "[email protected]"}) {
      id
    }
  }

如果这个能正常返回数据，说明查询语句本身没问题。再去检查变量传递的部分。
3. 变量注入是否正确

 ```javascript
    //确保注入方式正确
   const response = await admin.admin.graphql(
     `#graphql
       query GetCustomers($query: String!) {
         customerByIdentifier(identifier: {emailAddress: $query}) {
           id
         }
       }
     `,
     {
       variables: { query: email } //检查此处的query
     }
   );
  ```

5.利用Shopify的GraphQL App 调试

如果使用 Shopify GraphQl App能正常返回，但自己代码却不行。 排除前面所说的几个常见错误外。可以查看自己的Header里是否有遗漏。

操作步骤：

  1. 在Shopify后台，安装Shopify GraphQl App
  2. 打开GraphQL APP， 输入一个你可以正常返回数据的graphql 查询。
  3. 打开浏览器的Dev tool,查看具体的请求的header的参数是什么。
  4. 和你的代码进行请求的参数进行对比，找出遗漏的参数进行尝试。

6.使用其他的customer查询字段

如果customerByIdentifier查询就是不行（一般不大可能，可能是新版本bug）,尝试使用id, 或者phone number等作为唯一识别码查询顾客

原理： 使用已支持的稳定方案查询customer,确保核心功能正常。

  query {
  customer(id: "gid://shopify/Customer/5572148363466") {
    displayName
    email
    }
}

三. 额外安全建议

  • 不要在前端暴露敏感信息： API Key、客户邮箱等都属于敏感信息，不要直接暴露在前端代码中。
  • 最小权限原则： Shopify 应用的权限应该遵循最小权限原则，只申请必要的权限。
  • 处理好错误信息 : 对客户邮箱等信息进行脱敏，再返回给前端，不要直接将后台的原始错误信息暴露给前端用户。

希望这些方法能够帮你解决这个问题！