英文:
Supabase Google auth integration with Capacitor (React) for iOS
问题
我正在尝试将Supabase Google身份验证集成到使用Capacitor构建的混合应用中。
在Web上运行良好，但我无法在iOS上使其工作。
关于这方面没有任何文档。
我也尝试更改重定向URL
supabase?.auth.signInWithOAuth({
provider: "google",
options: Capacitor.isNativePlatform()
? {
redirectTo: "capacitor://localhost",
}
: {},
});
这会将我带回应用程序，但不会登录我。
英文:
I am trying to integrate Supabase Google Auth into my Hybrid app built with Capacitor.
It is working fine for web, but I am not able to get it working for iOS.
There isn't any documentation around this as well.
I've tried to change the redirect URL as well
supabase?.auth.signInWithOAuth({
provider: "google",
options: Capacitor.isNativePlatform()
? {
redirectTo: "capacitor://localhost",
}
: {},
});
This brings me back to the app, but doesn't log me in
答案1
得分: 1
使用电容器（Capacitor）时，您需要手动设置移动设备的会话，例如重定向到一个新页面来处理它。
myapp://confirmation
然后在这个新页面中：
useEffect(() => {
const hash = window.location.hash;
const parts = hash.replace('#', '').split('&');
for (const item of parts) {
var [key, value] = item.split('=');
if (key === 'access_token') setAccess(value);
if (key === 'refresh_token') setRefresh(value);
}
}, []);
useEffect(() => {
if (!access || !refresh) return;
const setSessionfunc = async (access_token: string, refresh_token: string) => {
await supabase.auth.setSession({ access_token, refresh_token });
router.push('/');
};
setSessionfunc(access, refresh);
}, [access, refresh]);
会话设置好后，您将被重定向到主页。请记住，Supabase 会话使用 cookie，所以您需要在您的 capacitor.config.js 中添加以下内容：
plugins: {
CapacitorCookies: {
enabled: true
}
}
祝您好运！
英文:
with capacitor you will have to setup a session manually for mobile
for ex redirect to a new page that will handle that
myapp://confirmation
then in this new page
useEffect(() => {
const hash = window.location.hash;
const parts = hash.replace('#', '').split('&');
for (const item of parts) {
var [key, value] = item.split('=');
if (key === 'access_token') setAccess(value);
if (key === 'refresh_token') setRefresh(value);
}
}, []);
useEffect(() => {
if (!access || !refresh) return;
const setSessionfunc = async (access_token: string, refresh_token: string) => {
await supabase.auth.setSession({ access_token, refresh_token });
router.push('/');
};
setSessionfunc(access, refresh);
}, [access, refresh]);
once the session is set you will be redirected to the home page
keep in mind also that supabase session uses cookies so you will need to add this in your capacitor.config.js
plugins: {
CapacitorCookies: {
enabled: true
}
}
good luck
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论