Relay中如何动态改变网络层
Posted
技术标签:
【中文标题】Relay中如何动态改变网络层【英文标题】:How to dynamically change the network layer in Relay 【发布时间】:2016-10-14 18:29:15 【问题描述】:我知道中继可以在引导时注入一个网络层,如下所示:
Relay.injectNetworkLayer(
new Relay.DefaultNetworkLayer('http://example.com/graphql',
headers:
Authorization: 'Basic SSdsbCBmaW5kIHNvbWV0aGluZyB0byBwdXQgaGVyZQ==',
,
)
);
但是如果我以后需要告诉标题是什么(比如在登录之后)呢?
【问题讨论】:
【参考方案1】:很好的问题。我想您正在基本组件文件中设置网络层。您可以创建一个包装 Relay.injectNetworkLayer 调用的函数,以便在需要时更新 Auth 标头。
加载应用程序时,您可以执行以下操作:
export function setNetworkLayer()
return new Promise((resolve, reject) =>
var options = ;
if (localStorage.authToken)
options.headers =
Authorization: 'Basic ' + localStorage.authToken
else
options.headers = ;
Relay.injectNetworkLayer(
new Relay.DefaultNetworkLayer('http://example.com/graphql', options)
);
resolve(options);
);
)
如果你想更新网络层,你可以这样做:
loginUser().then((res) =>
localStorage.authToken = res.token;
setNetworkLayer();
return;
)
【讨论】:
这意味着延迟注入网络层。但是,如果我想在使用有效令牌登录 setup networkLayer 后首先使用空标头(匿名)设置 networkLayer 怎么样? 您可以做的是在您的应用程序的第一个 render() 函数中调用 setNetworkLayer。如果在 localStorage 中没有检测到 authToken,那么它会将 options 变量设置为空对象,并将 DefaultNetworkLayer 设置为空头。并且每当你需要重置网络层时,你可以覆盖localStorage.authToken变量并再次调用setNetworkLayer()。 我尝试调用 injectNetworkLayer 两次,并收到警告为:“RelayNetworkLayer:收到对 injectImplementation() 的调用,但已经注入了一个层。”。而且新的调用没有生效,第一个调用也没有停止工作。 看起来这是一个警告,将在下一个版本中解决:github.com/facebook/relay/issues/1111。现在,在需要使用来自 localStorage 的网络层身份验证令牌最初加载应用程序时尝试重新渲染 DOM.render(),如下所示:mgiroux.me/2016/token-auth-in-relay-app-using-rails 其实上面的问题是在说:injectNetworkLayer 会导致警告,即使是第一次在应用程序中。因此 0.9 版本引入了 injectDefaultNetworkLayer,它仅在内部用于将默认层设置为“/graphql”。但是,我们现在面临的问题是我们不能在应用程序中调用两次injectNetworkLayer。【参考方案2】:我在 github 中继 repo 中提出了这个问题,他们建议我使用这个 react-relay-network-layer 库来解决问题。我相信这将是解决问题的最佳选择。
【讨论】:
【参考方案3】:我发现了一个简单的技巧。您可以传入 headers 对象并更新其指针值。
const headers =
Authorization: '',
;
Relay.injectNetworkLayer(
new Relay.DefaultNetworkLayer('http://example.com/graphql',
headers: headers,
)
);
// To update the authorization, set the field.
headers.Authorization = 'Basic SSdsbCBmaW5kIHNvbWV0aGluZyB0byBwdXQgaGVyZQ=='
【讨论】:
非常方便!您将如何从另一个文件更新值? 您可以导出您在 Relay DefaultNetworkLayer 中使用的headers
变量,并在任何地方设置授权。这是headers.Authorization =
部分,除非你在不同的文件中这样做。以上是关于Relay中如何动态改变网络层的主要内容,如果未能解决你的问题,请参考以下文章