javascript - 错误:appbridgeError: APP::ERROR::INVALID_CONFIG: shopOrigin 必须提供
问题描述
我用 Koa 和 Nextjs 制作了 Shopify 应用程序,但出现此错误
appbridgeError: APP::ERROR::INVALID_CONFIG: shopOrigin must be provided
应用程序的行为有点奇怪,因为当我第一次访问时,它运行良好。但是,几个小时后,我收到了这个错误。然后我研究了这个问题,我发现了这个案例。Cookies.get("shopOrigin")
几个小时后,MyApp 类中的内容将为空。
[server.js 的部分代码]
....................
....................
app.prepare()
.then(() => {
var httpServer = http.createServer(serverCallback);
// var httpsServer = https.createServer(config.https.options, serverCallback);
server.use(session({ secure: true, sameSite: 'none' }, server));
server.keys = [SHOPIFY_API_SECRET_KEY];
server.use(
createShopifyAuth({
apiKey: SHOPIFY_API_KEY,
secret: SHOPIFY_API_SECRET_KEY,
scopes: [
'read_products','write_products',
'read_orders', 'write_orders',
'read_customers', 'write_customers',
'read_script_tags', 'write_script_tags'
],
afterAuth(ctx) {
const { shop, accessToken } = ctx.session;
ACCESS_TOKEN = accessToken
ctx.cookies.set('shopOrigin', shop, {
httpOnly: false,
secure: true,
sameSite: 'none',
});
ctx.redirect('/');
},
}),
);
server.use(graphQLProxy({version: ApiVersion.October19}))
server.use(verifyRequest());
server.use(async (ctx) => {
await handle(ctx.req, ctx.res);
ctx.respond = false;
ctx.res.statusCode = 200;
return
});
....................
....................
[_app.js]
....................
....................
class MyApp extends App {
render() {
const { Component, pageProps } = this.props;
const config = { apiKey: API_KEY, shopOrigin: Cookies.get("shopOrigin"), forceRedirect: true };
console.log(`config`)
console.log(config)
return (
<React.Fragment>
<Head>
<title>My LA Meats</title>
<meta charSet="utf-8" />
</Head>
<Provider config={config}>
<AppProvider i18n={translations}>
<ApolloProvider client={client}>
<Component {...pageProps} />
</ApolloProvider>
</AppProvider>
</Provider>
</React.Fragment>
);
}
}
....................
....................
我想这是cookie的问题,我无法确认。你们有同样的问题吗?如果你知道我应该如何解决这个问题,请告诉我。
解决方案
更改 0 行代码后,我遇到了完全相同的错误,这似乎是因为shopOrigin
cookie 是 HttpOnly。为了确认这一点,我会尝试document.cookie
在控制台中运行类似的东西,看看 shopOrigin cookie 是否出现。
在我的情况下,cookie 在 chrome 和 firefox 中可见,一旦我取消了 shopOrigin cookie 的 HttpOnly 列,我就能够加载我的应用程序。但是,这是一个临时修复,因为 cookie 在重新启动 chrome 时重置为 HttpOnly。这令人费解,因为createShopifyAuth()
server.js 中的函数显式创建了 cookie,因此它不是 HttpOnly。
如果您找到解决方案,请告诉我。
推荐阅读
- arcmap - 美国国会选区的周长减去与州边界共有的周长
- reactjs - 如何制作一个 onClick 事件,该事件会弹出一个警报,询问用户是否要退出?
- heroku - Heroke app.json 未生成 SECRET_KEY env var
- python - 如何在 Python 中使用 find 或 select 来抓取特定的段落文本?
- r - 为什么内部调用中的 this lapply 与内部调用中的这个变量赋值不同?
- c# - 在 DataGrid 中放置 WPF 复选框的业务逻辑的位置
- python - 禁止直接分配到相关集的反面。我添加了一个属性并收到此错误
- c++ - 如何在 C++ 中跨模块存储枚举类型/存储类型信息
- undefined - 说 {profilePic} 未定义
- dataframe - 子索引更改时,我可以替换列中的值吗?