shopify - Shopify (Node + React) 自定义应用程序：verifyRequest() 问题

问题描述

我正在使用 Node+React 开发一个自定义嵌入式应用程序。

我遵循了官方教程，但是如果我使用 verifyRequest() 中间件，当我浏览我的应用程序页面时，我总是会收到以下错误：

需要有效的商店查询参数

我真的无法理解代码有什么问题。

有人可以帮我吗？

下面是 server.js 代码

require('isomorphic-fetch');
const dotenv = require('dotenv');
const Koa = require('koa');
const next = require('next');
const { default: shopifyAuth } = require('@shopify/koa-shopify-auth');
const { verifyRequest } = require('@shopify/koa-shopify-auth');
const { default: Shopify, ApiVersion } = require('@shopify/shopify-api');
const Router = require('koa-router');
const RedisSessionStorage = require('./middleware/RedisSessionStorage')
const Cookies = require('cookies')

dotenv.config();

Shopify.Context.initialize({
    API_KEY: process.env.SHOPIFY_API_KEY,
    API_SECRET_KEY: process.env.SHOPIFY_API_SECRET,
    SCOPES: process.env.SHOPIFY_API_SCOPES.split(","),
    HOST_NAME: process.env.SHOPIFY_APP_URL.replace(/https:\/\//, ""),
    API_VERSION: ApiVersion.April21,
    IS_EMBEDDED_APP: true,
    SESSION_STORAGE: new Shopify.Session.CustomSessionStorage(
        RedisSessionStorage.storeCallback,
        RedisSessionStorage.loadCallback,
        RedisSessionStorage.deleteCallback,
    ),
});

const port = parseInt(process.env.PORT, 10) || 3001;
const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handle = app.getRequestHandler();
const ACTIVE_SHOPIFY_SHOPS = {[process.env.ACTIVE_SHOPIFY_SHOP]: process.env.SHOPIFY_API_SCOPES}

app.prepare().then(() => {
    const server = new Koa();
    const router = new Router();
    server.keys = [Shopify.Context.API_SECRET_KEY];

    server.use(
        shopifyAuth({
            accessMode: 'offline',
            afterAuth(ctx) {
                const { shop, scope, accessToken } = ctx.state.shopify;
                global.accessToken = accessToken

                ACTIVE_SHOPIFY_SHOPS[shop] = scope;

                ctx.redirect(`/?shop=${shop}`);
            },
        }),
    );

    const handleRequest = async (ctx) => {
        await handle(ctx.req, ctx.res);
        ctx.respond = false;
        ctx.res.statusCode = 200;
    };

    router.get("/", async (ctx) => {
        const shop = ctx.query.shop;
        if (ACTIVE_SHOPIFY_SHOPS[shop] === undefined) {
            ctx.redirect(`/auth?shop=${shop}`);
        } else {
            await handleRequest(ctx);
        }
    });

    router.get("(/_next/static/.*)", handleRequest);
    router.get("/_next/webpack-hmr", handleRequest);

    router.get("(.*)", verifyRequest({accessMode: 'offline'}), handleRequest);

    server.use(router.allowedMethods());
    server.use(router.routes());

    server.listen(port, () => {
        console.log(`> Ready on http://localhost:${port}`);
    });
});

标签： shopify

shopify - Shopify (Node + React) 自定义应用程序：verifyRequest() 问题

问题描述

解决方案

推荐阅读