AppBridgeError INVALID_CONFIG：必须提供主机

Question

AppBridgeError INVALID_CONFIG：必须提供主机

Bil*_*sir 6 shopify-app shopify-api-node

我在尝试完成有关开发 Shopify 应用程序的官方 Shopify 教程时遇到错误。

我一直在一步一步地遵循教程，但即便如此，仍然遇到了问题，抛出错误，表明我的配置文件无效，因为它不包含主机。

我的_app.js文件代码如下：

import React from "react";
import App from "next/app";
import Head from "next/head";
import { AppProvider, Frame } from "@shopify/polaris";
import "@shopify/polaris/dist/styles.css";
import translations from "@shopify/polaris/locales/en.json";
import { Provider } from "@shopify/app-bridge-react";
import ClientRouter from "../components/ClientRouter";

class MyApp extends App {
  render() {
    const { Component, pageProps, shopOrigin } = this.props;
    const config = {
      apiKey: API_KEY,
      shopOrigin,
      forceRedirect: true,
    };
    console.log(config);
    return (
      <React.Fragment>
        <Head>
          <title>Sample App</title>
          <meta charSet="utf-8" />
        </Head>
        <Provider config={config}>
          <ClientRouter />
          <AppProvider i18n={translations}>
            <Frame>
              <Component {...pageProps} />
            </Frame>
          </AppProvider>
        </Provider>
      </React.Fragment>
    );
  }
}
MyApp.getInitialProps = async ({ ctx }) => {
  return {
    shopOrigin: ctx.query.shop,
  };
};
export default MyApp;

Run Code Online (Sandbox Code Playgroud)

配置文件的控制台给出了正确的shopOrigin。如果有人提供帮助，我将不胜感激

Answer 1

hna*_*o11 3

目前需要使用App Bridge 版本 2，就像应用程序审核团队指出的那样：

确保您的应用程序位于 Shopify App Bridge 版本 2.0 上，以便将您的应用程序嵌入商家的后台...

因此，我所做的是将商店名称（例如：toys.myshopify.com）保留在我的数据库中，编码为 base64 并在需要时发送“主机”查询参数。

const host = Buffer.from(`${shop}/admin`).toString('base64');
ctx.redirect(`${process.env.HOST}?shop=${shop}&host=${host}`);

Run Code Online (Sandbox Code Playgroud)

请注意我如何在商店值后添加“ /admin ”，这是重要的一步，否则您会收到 404 错误（找不到页面）。

归档时间：	4 年，10 月前
查看次数：	5218 次
最近记录：	4 年，7 月前