如何在 react-native 中为 webView 请求设置自定义标头

Posted 2023-05-07

【中文标题】如何在 react-native 中为 webView 请求设置自定义标头

【英文标题】：How to set a custom header for webView requests in react-native

【发布时间】：2016-08-15 14:18:07

【问题描述】：

我希望能够在我的 ruby​​ on rails 服务器端检测到 http 请求来自我应用程序中的 webView 组件。该应用程序正在使用 react-native。特别是，我想区分来自应用程序的请求和来自在 ios 设备上运行的移动 safari 的请求。

我尝试在AppDelegate.m 文件中设置以下内容

  NSURL *url = [NSURL URLWithString:@"http://localhost:3000/signin"];
  NSMutableURLRequest *request=[NSMutableURLRequest requestWithURL:url cachePolicy:NSURLRequestReloadIgnoringCacheData timeoutInterval:60];
  [request addValue:@"GolfMentor" forHTTPHeaderField:@"User-Agent"];
  [request addValue:@"GolfMentor" forHTTPHeaderField:@"X-MY-CUSTOM-HEADER"];
  NSLog(@"%@", [request allHTTPHeaderFields]);

控制台的输出是

GolfMentor[63924:12437749] 
"User-Agent" = GolfMentor;
"X-MY-CUSTOM-HEADER" = GolfMentor;

所以客户标题似乎已设置。但是，当我在我的 ruby​​ on rails 应用程序中查看请求标头时，没有自定义标头的迹象。看起来我的更改稍后在执行本机应用程序时被覆盖。那么我应该在哪里以及如何设置自定义标题？我也有兴趣为应用程序的 android 版本做同样的事情？

【参考方案1】：

尝试将以下行添加到 AppDelegate.m 以设置自定义用户代理

NSString *newAgent = @"GolfMentor";
NSDictionary *dictionnary = [[NSDictionary alloc] initWithObjectsAndKeys:newAgent, @"UserAgent", nil];
[[NSUserDefaults standardUserDefaults] registerDefaults:dictionnary];

更完整的答案和android的解决方案可以在here找到。

【参考方案2】：

我有点怀疑你能否做到这一点。如果它没有暴露为你可以在 React Native 提供的 WebView 组件上设置的道具，那么我认为你做不到。

顺便说一句，React Native 中的 WebView 组件并不是那么棒。在 iOS 端，它封装了 UIWebView，但对于 iOS 8+，有 WkWebView，它更符合标准并且比 UIWebView 快得多。

http://blog.initlabs.com/post/100113463211/wkwebview-vs-uiwebview

我目前正在开发一个广泛使用 webviews 的应用程序，我们最终为 iOS 和 Android 编写了自己的原生组件。这比听起来容易，特别是如果您已经有本地开发经验。因此，如果您使用 webview 做了很多事情，并且开箱即用的组件并没有给您想要的东西（并且您想要 WkWebView 与 UIWebView 的额外好处），我会考虑推出您自己的。