Help us understand the problem. What is going on with this article?

WebViewからfacebookへログインしたあとの白い画面対応

More than 5 years have passed since last update.

はじめに

webView内でいいねボタンを押すだけ、が思った以上に大変でした。
国内の記事がなかったので、べつの方法もあるとは思いますが
探しきれなかったので、こちらに書いておきます。

facebookのログイン機能を素のwebviewでつかう

ログイン情報がログアウト、初回のアクセス

いいねボタンやシェアボタンを押したあとの挙動はログインページに遷移しました。
アプリ側は何もしなくても、webview内でJSがそのまま実行しているままの挙動です。
ログインし、表示されたのは真っしろな画面。

もう一度良いねボタンを設置したページを表示

ログイン前と同じ状態で表示されていました。
ボタンを押すと、いいねボタンのカウントアップが確認できたので
ああ、ログインできてたんだ・・・ということが分かります。

これはあかん。

挙動をみる

ControllerへUIWebViewDelegateのメソッドを追加

ViewController.m
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
    NSString *urlString = [NSString stringWithFormat:@"%@", request];
    NSLog(@"url :%@", urlString);
    return YES;
}

怪しい名前のURLがログに出力される
https://www.facebook.com/plugins/close_popup.php#_=_

close_popup.phpは何をしているのか

close_popup.php
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>Facebook</title></head>
<body><script>window.close();</script></body>
</html>

webviewだと何もしません。だから問題。

どうしようか

表示しないのがいい。(という判断)
でも遷移しないとログイン画面から動けない

戻ろう・・・

ViewController.m
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
    if ([urlString rangeOfString:@"close_popup.php"].location != NSNotFound) {
        if (webView.canGoBack){
            [webView goBack];
        }
    }
    return YES;
}

コード全部

ViewController.m
@interface ViewController ()<UIWebViewDelegate>

@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];

    CGRect r = [[UIScreen mainScreen] bounds];
    // Do any additional setup after loading the view, typically from a nib.
    UIWebView *wv = [[UIWebView alloc] init];
    wv.delegate = self;
    wv.frame = CGRectMake(0, 0,r.size.width, r.size.height);
    wv.scalesPageToFit = YES;
    [self.view addSubview:wv];

    NSURL *url = [NSURL URLWithString:@"いいねボタンなどをおいたコンテンツのURL"];
    NSURLRequest *req = [NSURLRequest requestWithURL:url];
    [wv loadRequest:req];
}

- (void)didReceiveMemoryWarning
{
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
    NSString *urlString = [NSString stringWithFormat:@"%@", request];
    //NSLog(@"url :%@", urlString);
    if ([urlString rangeOfString:@"close_popup.php"].location != NSNotFound) {
        //NSLog(@"close_popup.php found");
        if (webView.canGoBack){
            [webView goBack];
            return NO;
        }
    }
    return YES;
}
@end

参考URL

http://stackoverflow.com/questions/11622845/facebook-login-fails-in-uiwebview
http://brainwashinc.com/2014/01/06/ios-uiwebview-handle-window-openwindow-close-popup-page/
http://sakebook.blogspot.jp/2013/03/facebookjavascriptsdkuiwebview.html

最後に

Facebookから提供されているiOS用のSDKでログインするとパーミションが表示されるのが嫌なので
こちらの方法を取りますが
iOSの場合はAppleの申請がネックになり、Facebook側に仕様変更(close_popup.phpの名前が変わるなど)が発生すると修正までのタイムラグになり機会損失につながります。

「JSでの回避、webviewは素のままで」が望ましい。

nofrmm
会社の人への説明用、趣味用にまとめています。 メインはiOSまわりっぽい。Photoshop、サーバまわりと記事を散文してます。 人は自由に生きるべき。 いつか北海道の良い開発会社にご縁があれば移住したい
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした