javascript - 使用 Firebase 进行 Shopify 身份验证验证?
问题描述
我一直在关注本教程,了解如何使用 Node、Nextjs 和 React 构建公共 Shopify 应用程序。
一切都很顺利,但是我现在需要将一些应用程序数据存储在数据库中。为此,我选择了 Firestore。
我正在做的是当用户通过他们的商店验证应用程序时,我使用我的 Next JS 服务器中的 Admin-SDK 将他们的商店和 accessToken 写入文档:
注意:我正在使用 accessMode“离线”,因为我需要一个永久访问令牌,以便我的应用可以在后台发出 Shopify API 请求。我也知道我应该在存储之前对 accessToken 进行真正的加密,但是只是试图让逻辑首先工作
server.use(
createShopifyAuth({
apiKey: SHOPIFY_API_KEY,
secret: SHOPIFY_API_SECRET_KEY,
scopes: ['read_products', 'write_products'],
accessMode: "offline",
async afterAuth(ctx) {
const {shop, accessToken} = ctx.session;
ctx.cookies.set('shopOrigin', shop, {
httpOnly: false,
secure: true,
sameSite: 'none'
});
await getSubscriptionUrl(ctx, accessToken, shop);
await db.collection('shops').doc(shop).set({
name: shop,
accessToken
}, {merge: true});
},
}),
);
我还在使用 Koa 中间件,它验证对我的应用程序的任何请求,以确保它们来自 Shopify 应用程序
server.use(verifyRequest());
我现在想做的是为我的应用添加一种从 Firebase 提取数据的方法。我在其中创建了一个 api 端点,/pages/api/firebase.js
它使用shopOrigin
cookie 来获取商店名称,然后提取该商店的数据。
export default async(req, res) => {
const shop = req.cookies.shopOrigin;
const doc = await db.collection('shops').doc(shop).get()
res.status(200).json({success: true, data: doc.data()});
}
不过,我面临的问题是,用户可以简单地更改该 cookie 值并为另一家商店提取数据。该verifyRequest
函数似乎没有检查调用它的 shopOrigin 名称是否来自调用它的商店。
有谁知道我如何验证这些请求,以便调用我的 API 的商店只能访问该存储数据(通过 Next 服务器上的 admin-sdk)?
解决方案
考虑到这一点,我可以使用自定义身份验证方法。
在 Next server.js 文件中,以下使用商店名称创建自定义令牌,然后将该令牌设置在 cookie 中。例如,它随后在 shop 集合中创建一个文档,其中文档 ID 作为商店名称。
async afterAuth(ctx) {
const {shop, accessToken} = ctx.session;
await getSubscriptionUrl(ctx, accessToken, shop);
const customToken = await admin.auth().createCustomToken(shop)
ctx.cookies.set('shopOrigin', shop, {
httpOnly: false,
secure: true,
sameSite: 'none'
});
ctx.cookies.set('token', customToken, {
httpOnly: false,
secure: true,
sameSite: 'none'
});
await db.collection('shops').doc(shop).set({
domain: shop,
token: cryptr.encrypt(accessToken),
}, {merge: true});
},
在 React 应用程序中,初始化您的 Firebase 应用程序实例,然后在 index.js 中侦听以查看 authState 是否更改或使用令牌登录用户。
useEffect(() => {
firebase.auth().onAuthStateChanged(user => {
if(user) {
setSignedIn(true)
} else {
firebase.auth().signInWithCustomToken(Cookies.get('token'));
}
})
},[])
然后在 Firebase 规则中,根据需要设置您的权限
match /shops/{shop}/{documents=**} {
allow read, write: if request.auth != null && request.auth.uid == shop
}
推荐阅读
- python - 是否可以在python中使用pjsua2实时使用AudioMedia Memory/Buffer-based Playback Port?
- c++ - MacOS Catalina 在尝试从 C++ 中的 Boost Tutorial 编译示例文件时出现错误
- anaconda - 如何在 Spyder 4 中打开/关闭代码分析功能
- c++ - 如何在cmake中链接静态库
- laravel - 504 网关超时 | 提交表格到邮件后
- python - python tkinter中水平滚动文本的问题
- javascript - 使用javascript对结果进行编号时如何用字母代替数字
- python - 没有名为“验证器”的模块时出现 ModuleNotFoundError | Python-Django 虚拟环境
- reactjs - 使用电子生成器时参数列表后的语法错误:缺少 )
- c# - 测试路径和删除项目不适用于从其他应用程序调用时存在的文件