使用NodeJS开发Shopify公共应用时如何获取当前登录店铺？

@shopify/koa-shopify-auth提供的verifyRequest中间件校验通过后，会把当前店铺的授权信息写入ctx.state.shopify对象，而非ctx.session，你取值的位置错误导致拿到null，修改取值路径即可正常拿到数据。

你目前的/test接口没有加授权校验中间件，无法拿到当前登录店铺的上下文信息，正确实现步骤如下：

1. 给需要调用Shopify API的后端接口都加上verifyRequest()中间件，自动校验请求的合法性，同时注入当前店铺的授权信息
2. 从ctx.state.shopify中直接获取当前店铺域名shop和对应授权凭证accessToken，无需硬编码
3. 优先使用Shopify官方SDK封装的请求工具调用API，不需要自己用axios拼接请求头和地址，避免出错

修改后的接口代码示例 #

router.get("/test2", verifyRequest(), async(ctx) => {
  // 从正确的位置取授权信息
  const { shop, accessToken } = ctx.state.shopify;
  console.log(shop);
  console.log(accessToken);
  ctx.body = { status: 'success', shop, accessToken };
})

router.get("/test", verifyRequest(), async (ctx) => {
  const { shop, accessToken } = ctx.state.shopify;
  // 用官方Rest客户端调用接口，不需要手动拼接地址和请求头
  const client = new Shopify.Clients.Rest(shop, accessToken);
  const shopInfo = await client.get({
    path: 'shop',
  });
  ctx.body = shopInfo.body;
});

前端请求方式 #

你使用Shopify CLI创建的嵌入式应用，前端调用后端接口时，使用官方提供的authenticatedFetch方法发送请求即可，会自动携带授权所需的参数，不需要你手动拼接店铺参数，示例如下：

import { authenticatedFetch } from "@shopify/app-bridge-utils";
import { useAppBridge } from "@shopify/app-bridge-react";

// 组件内调用
function FetchButton() {
  const app = useAppBridge();
  const fetch = authenticatedFetch(app);

  const getShopInfo = async () => {
    const res = await fetch("/test");
    const data = await res.json();
    console.log('店铺信息：', data);
  };

  return <button onClick={getShopInfo}>获取店铺数据</button>;
}

• 你当前使用的MemorySessionStorage仅适用于开发环境，生产环境需要替换为持久化存储方案（如Redis、MySQL等），否则服务重启后所有店铺需要重新授权
• 不要硬编码私有应用的access token，OAuth流程中拿到的accessToken是对应当前登录店铺的专属凭证，适配所有安装你应用的店铺

内容的提问来源于stack exchange，提问作者IonicMan