首页 > 解决方案 > 对 Shopify 将客户发送到您指定的“应用 URL”的情况感到困惑

问题描述

我已经为使用 node.js 的人们开发了几个 Shopify 自定义应用程序,老实说,这经历了很多试错。这种反复试验导致我得到以下代码:

/* GET home page. */
router.get('/', adminMiddleware, function (req, res, next) {
    const shop = req.query.shop;

    if (req.query.session) {
        // if we're here, that means the app was clicked on in the shopify admin panel
        return res.send({hello: 'world'});
    }

    if (shop) {
        // if we're here, that means this is install initialization
        const state = nonce();
        const redirectUri = forwardingAddress + '/shopify/callback';
        const installUrl = 'https://' + shop +
            '/admin/oauth/authorize?client_id=' + apiKey +
            '&scope=' + scopes +
            '&state=' + state +
            '&redirect_uri=' + redirectUri;

        res.cookie('state', state);
        res.redirect(installUrl);
    } else {
        return res.status(400).send('Missing shop parameter. Please add ?shop=your-development-shop.myshopify.com to your request');
    }
});

因此,根据我完全没有信心的试验和错误,我最终会在以下两种情况下处于我的 Shopify 路由的根目录(如 Shopify 合作伙伴仪表板上的应用 URL 设置中所定义):

  1. 当有人正在安装应用程序时,在这种情况下,我会shop在查询参数中看到一个,或者

  2. 当有人在 Shopify 商店的管理面板中点击我的应用程序时,在这种情况下会有一个req.query.session变量集,如果我愿意,我可以用一些 html+css 来响应(该示例只显示了一个简单的 JSON 响应) .

但是……是这样吗?这是 Shopify 将使用我的根路由的两种情况吗?是检查req.query.shop还是req.query.session区分这两种情况的正确方法?我不确定我是否正确处理了这些东西。

标签: javascriptnode.jsshopifyshopify-app

解决方案


我不是这方面的专家,但我背后有一些应用程序,我也在使用 nodejs,所以如果我知道可以帮助你,请成为我的客人。

首先,我的建议是在这里使用 shopify-cli 设置https://shopify.github.io/shopify-app-cli/它提供了一个在 NextJS 和 Node 上编写的 Shopify App starterkit(它使用 KOA,它包含一个 GraphQL 和为您完成的其他一些事情),它已经为您完成了所有 auth 中间件。我使用的是自定义快递,但由于放弃了对重要 auth express 包的支持,我切换到 koa,然后切换到他们的设置。所以是的,我的建议是使用他们的设置。

至于您的问题,这实际上取决于您的路线上配置的内容。

根据您的应用类型(自定义或公共)以及您是否有代理,shopify 可以发送一些不同的请求。

以下是您可以收到的所有可能的请求(或与我合作过的请求):

  • 初始安装- 此请求包括几个端点,一个用于 URL 生成,一个用于回调验证
  • 输入应用程序- 我不确定此请求是否可以排除会话,当前设置已配置会话,所以我认为可能不包括它
  • 代理请求- 如果您在应用仪表板中设置了代理并且这是最终路由
  • webhook 请求- 如果您注册了 webhook 并且这是您的端点
  • GDPR webhook - 这些是从仪表板配置的,并且是公共应用程序所必需的(但它们的工作方式与 webhook 类似)

这实际上取决于您的应用程序的配置方式,如果您甚至不需要应用程序的仪表板,您可以在同一条路线上拥有所有 5 个请求(这是一个坏主意)或单个请求。

请记住,如果您不想处理此问题,可以将安装和主页设置在不同的路径中,只需将应用程序仪表板中的初始“主页”页面设置为不同的页面即可。

如果您正在使用 Koa,我认为这个包将帮助您更多地了解https://www.npmjs.com/package/@shopify/koa-shopify-auth,因为它受 Shopify 支持。

此外,我没有看到您处理shop查询参数,这可能会导致您的 XSS 攻击,请考虑在将其输出到安装 URL 之前对其进行清理。

所以最后考虑在这里使用startkit,因为之后更容易为公共应用程序提供支持,因为他们对公共应用程序有严格的审查流程,并且当你需要问题时更容易参考他们的社区论坛修复或您需要添加的功能。


推荐阅读