最近我一直在尝试将 Facebook 社交插件集成到 iOS 中的自定义 UIWebView 中以评论网页。我添加了“赞”按钮和“评论”插件。这是我加载到 WebView 中的 HTML 代码:
<html>
<body>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="http://www.heretheweb.com" data-send="false" data-layout="button_count" data-width="240" data-show-faces="false"></div>
<div class="fb-comments" data-href="http://www.heretheweb.com" data-num-posts="5" data-width="470"></div>
<body>
</html>
周一的第一次实现在 4 个平台上取得了成功,包括模拟器(iOS 4 和 iOS 5)、iPhone 3G iOS4 和 iPhone 4 iOS 5。 星期二,我继续开发这个,最后我的自定义 UIWebView 在前三个中没有问题。但是在 iPhone 4 (iOS 5) 上,网页 View 不断地重新加载同一个网页,导致评论框永远不会出现。该网址是这样的:
我真的不知道我做错了什么,我已经清理了 uiWebView 委托(delegate)方法,我已经用断点检查了所有我可以覆盖的方法。什么都没有...网页在开始时加载,然后循环尝试加载上述 URL...
最佳答案
Facebook 评论插件中存在一个错误,当在支持 Retina 的设备上加载评论插件时,该错误会导致无限加载循环。
其中一个fb js脚本中有一行如下:
if(window.devicePixelRatio>1)document.location.reload()
因此,如果您在具有高密度屏幕的设备上访问该页面,那您就完蛋了。
我报告了这个问题 here
我想出了一个肮脏的 hack 来修复它,但在使用它之前请三思,它可能随时停止工作。
请注意,此方法仅在您将插件嵌入 UIWebView 时有效,如果您在访问 safari 中的页面时遇到问题,则别无选择,只能等待 facebook 的修复。
我的想法是在 js 代码被 UIWebView 加载时即时“修复”它。
为了即时处理请求,我创建了自己的 NSURLProtocol 实现:
<FBCommentsFixingURLProtocol.h>
#import <Foundation/Foundation.h>
@interface FBCommentsFixingURLProtocol : NSURLProtocol
@end
<FBCommentsFixingURLProtocol.m>
#import "FBCommentsFixingURLProtocol.h"
static NSString *FBCommentsFixingHeader = @"X-FBFix";
@interface FBCommentsFixingURLProtocol ()
@property (nonatomic, readwrite, strong) NSURLRequest *request;
@property (nonatomic, readwrite, strong) NSURLConnection *connection;
@property (nonatomic, readwrite, strong) NSURLResponse *response;
@end
@implementation FBCommentsFixingURLProtocol
@synthesize request = request_;
@synthesize connection = connection_;
@synthesize response = response_;
+ (BOOL)canInitWithRequest:(NSURLRequest *)request
{
if (([request.URL.scheme isEqualToString:@"https"] || [request.URL.scheme isEqualToString:@"http"]) && [request.URL.absoluteString rangeOfString:@"facebook.com/plugins/comments.php"].location != NSNotFound &&
[request valueForHTTPHeaderField:FBCommentsFixingHeader] == nil)
{
return YES;
}
return NO;
}
+ (NSURLRequest *)canonicalRequestForRequest:(NSURLRequest *)request
{
return request;
}
- (id)initWithRequest:(NSURLRequest *)request
cachedResponse:(NSCachedURLResponse *)cachedResponse
client:(id <NSURLProtocolClient>)client
{
// Modify request so we don't loop
NSMutableURLRequest *myRequest = [request mutableCopy];
[myRequest setValue:@"" forHTTPHeaderField:FBCommentsFixingHeader];
self = [super initWithRequest:myRequest
cachedResponse:cachedResponse
client:client];
if (self)
{
[self setRequest:myRequest];
}
return self;
}
- (void)startLoading
{
NSURLConnection *connection = [NSURLConnection connectionWithRequest:[self request]
delegate:self];
[self setConnection:connection];
}
- (void)stopLoading
{
[[self connection] cancel];
}
- (void)connection:(NSURLConnection *)connection didReceiveData:(NSData *)data
{
NSString *dataAsString = [[NSString alloc] initWithData:data encoding:NSUTF8StringEncoding];
//Just modify the script to prevent it from execution on Retina devices.
//window.devicePixelRatio = 2 for the Retina Display
NSString* modified = [dataAsString stringByReplacingOccurrencesOfString:@"if(window.devicePixelRatio>1)document.location.reload();" withString:@""];
NSData* dataMod=[modified dataUsingEncoding:NSUTF8StringEncoding];
[[self client] URLProtocol:self didLoadData:dataMod];
}
- (void)connection:(NSURLConnection *)connection didFailWithError:(NSError *)error
{
[[self client] URLProtocol:self didFailWithError:error];
[self setConnection:nil];
}
- (void)connection:(NSURLConnection *)connection didReceiveResponse:(NSURLResponse *)response
{
[self setResponse:response];
}
- (void)connectionDidFinishLoading:(NSURLConnection *)connection
{
[[self client] URLProtocolDidFinishLoading:self];
[self setConnection:nil];
}
@end
然后我在应用委托(delegate) didFinishLaunchingWithOptions 中注册了它:
[NSURLProtocol registerClass:[FBCommentsFixingURLProtocol class]];
我知道这是一个肮脏的 hack,但它仍然有效。
关于iOS:移动版 Facebook 评论插件不断重新加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10209267/