25
4
I'm working with Google OAuth in my React application, and I'm implementing it through a popup. I'm using Passport with my custom backend. The initial URL that I supply to the popup window is the backend entry point that initializes the OAuth process. Google then sends a response to my callback on my backend.
我在Reaction应用程序中使用Google OAuth，并通过弹出窗口实现它。我正在使用Passport和我的自定义后端。我提供给弹出窗口的初始URL是初始化OAuth过程的后端入口点。然后，谷歌在我的后台向我的回调发送响应。
After that, I need to communicate the JWT access token back that I generate on the backend to my frontend. I'm doing this by redirecting respondign with a redirect to a frontend route, with the access token as a query parameter in the redirect URL. The problem I'm facing, however, is that the window.opener in the popup becomes null after the Google OAuth process. This prevents me from sending the access token back to the parent window using window.opener.postMessage.
在那之后，我需要将我在后端生成的JWT访问令牌传回给我的前端。为此，我使用重定向将响应重定向到前端路由，并将访问令牌作为重定向URL中的查询参数。然而，我面临的问题是，在Google OAuth过程之后，弹出窗口中的window.openser变为空。这阻止了我使用window.opener.postMessage将访问令牌发送回父窗口。
I have verified that the window.opener is not null when I pass in the same route my backend redirects my frontend to, as the initial url to the popup. The issue occurs when I pass in my backend endpoint for initializing google OAUTH (so it redirects to Googles sign in).
我已经验证了，当我通过与弹出窗口的初始url相同的后端重定向到的路径时，window.openser不是空的。当我传入后端终结点以初始化Google OAuth时(因此它重定向到Googles登录)，就会出现这个问题。
Unfortunately, I can't use cookies or localStorage due to my application's restrictions.
不幸的是，由于我的应用程序的限制，我不能使用cookie或localStorage。
Has anyone faced a similar issue? Any advice or guidance would be greatly appreciated. Thanks!
有没有人遇到过类似的问题？任何建议或指导都将不胜感激。谢谢!
You can use a BroadcastChannel to communicate without having a direct reference:
您可以在没有直接引用的情况下使用BroadCastChannel进行通信：
The BroadcastChannel interface represents a named channel that any
browsing context of a given origin can subscribe to. It allows
communication between different documents (in different windows, tabs,
frames or iframes) of the same origin.
The listener:
听众：
个人中心
文章发布
退出const channel = new BroadcastChannel('auth');
channel.addEventListener ('message', (event) => {
console.log(event.data);
});
The sender:
发件人：
const channel = new BroadcastChannel('auth');
channel.postMessage(data);
Hook:
钩子：
You can wrap this in a custom hook that returns the message (received items) and a sendMessage to post items. Since BroadcastChannel is bi-directional you can use either or both.
您可以将其包装在一个返回消息(已接收项)的定制钩子和一个用于发布项的sendMessage中。因为BroadCastChannel是双向的，所以您可以使用其中的一种或两种。
const useBroadcastChannel = name => {
const [message, setMessage] = useState()
const channel = useRef()
useEffect(() => {
channel.current = new BroadcastChannel(name);
channel.current.addEventListener('message', event => {
setMessage(event.data)
})
return () => {
channel.current?.close()
}
}, [name])
const sendMessage = useCallback(data => {
channel.current?.postMessage(data)
}, [])
return {
message,
sendMessage
}
}
Usage:
用途：
const { message, sendMessage } = useBroadcastChannel('auth')
You can handle received messages with useEffect.
您可以使用useEffect处理收到的消息。
25
4
0
OpenAL.org && 创意开发网站已关闭。我选择替代版本 OpenAL Soft .我很担心，因为在 OpenAL Soft 的二进制安装中我找不到 alut.h header 。 alut.h
我使用 Android Studio 已经有一段时间了，但有一天应用程序突然出错了。当我尝试单击我的目录以查找要导入或打开的文件时，应用程序变得异常缓慢并且根本没有响应。当我最终成功切换到存储我的文件
自 Firefox 4 以来，这似乎是一个奇怪的功能变化。在使用 window.open() 打开一个窗口后，当用鼠标中键单击打开的窗口中的链接时(或右键单击并选择“在新窗口中打开”选项卡') 导致链
我无法从 Open::URI 的 rdoc 中得知当我这样做时返回的是什么: result = open(url) URL 返回 XML，但我如何查看/解析 XML？ 最佳答案 open 返回一个 I
经常开发asp但对于细致的说法，真实不太清楚，这里简单的介绍下。 一般情况下 读取数据都是用rs.open sql,conn,1,1 修改数据:rs.open sql,conn,1,3 删除
关于 pathlib 标准库中的模块，是 path.open() 方法只是内置 open() 的“包装器”功能？ 最佳答案 如果您阅读了 source code的 pathlib.Path.open你
我想将 Open Liberty 运行时的语言更改为 en_US从 Eclipse IDE 中，但我不知道如何。 也尝试使用 JVM 参数的首选项来设置它，但它没有用。 -Duser.language
这是我所拥有的: 参数“opener”未在可能的函数调用参数中列出。这是 PyCharm 错误还是其他原因？ PyCharm 2018.3.5 社区版，Windows 7 上的 Python 3.6.
我正在使用 Tinkerpop 的 GraphFactory.open(Configuration 配置) Java 命令来访问 Neo4j 数据库。 一个最低限度的工作示例是: Configurat
这个问题在这里已经有了答案: What is the python "with" statement designed for? (11 个答案) 关闭 7 年前。 我没有使用过 with 语句，但
我正在玩 python 3.5 中的 open 函数。我不明白 opener 参数(最后一个参数)在 open 函数中的用法。根据 python 文档:可以通过将可调用对象作为打开器传递来使用自定义打
关闭。此题需要details or clarity 。目前不接受答案。 想要改进这个问题吗？通过 editing this post 添加详细信息并澄清问题. 已关闭 5 年前。 Improve th
我试图用 Python 来做一些模拟 3D 声音的工作。我试图运行此代码(答案中提供):Python openAL 3D sound类似，两次都收到: ModuleNotFoundError: No
我一直认为 open 和 io.open 可以互换。 显然不是，如果我相信这个片段: import ctypes, io class POINT(ctypes.Structure): _fie
这个问题在这里已经有了答案: What's the difference between io.open() and os.open() on Python? (7 个答案) 关闭 9 年前。 我是
我正在尝试更好地了解 WCF 的一些内部工作原理。我已经做了相当多的环顾四周，但我无法找到关于 ChannelFactory.Open() 与 IClientChannel.Open() 相比的明确解
这个问题在这里已经有了答案: What is the python "with" statement designed for? (11 个答案) 关闭 7 年前。 我知道有很多关于在 python
CFSDN坚持开源创造价值，我们致力于搭建一个资源共享平台，让每一个IT人在这里找到属于你的精彩世界. 这篇CFSDN的博客文章adodb.recordset.open(rs.open)方法参数详解由
不久前我遇到了一个interesting security hole Link 看起来足够无害，但有一个漏洞，因为默认情况下，正在打开的页面允许打开的页面通过 window.opener 回调到它。有
这在我的应用程序上运行良好，但由于某种原因我无法让它在这里正常工作。无论如何，我的问题是，当我单击列表标题时，我想关闭之前打开的列表标题并仅保留事件的列表标题打开。目前它会打开我点击的所有内容，但也会
我是一名优秀的程序员,十分优秀！