Unable to use Xamarin.Forms WebView for Dropbox authentication

Question

I've run into a problem using WebView to access the authorization uri necessary to authorize access by my Xamarin forms (running under iOS) app. I don't believe the problem lies with the WebView and the particular url, and not the Dropbox API itself.

First, I should mention that I am able to use WebView to access arbitrary web sites, so I know I am able to access the web generally from within my app.

In the code below you will see that I have two buttons set up. The first uses a WebView to successfully access the Wikipedia page for Xamarin. The second attempts to contact Dropbox in order to begin the authentication process. However, that request fails with the message:

Error (400) It seems the app you were using submitted a bad request. If you would like to report this error to the app's developer, include the information below. Invalid redirect_uri. Must be an absolute uri.

Initially, I thought that the problem was that the redirection uri wasn't registered correctly, but if I copy the url being passed to the webview (included below as a comment), and paste it directly into safari, the authentication page opens as expected. It is only when using WebView that I receive the error message. That makes me think that it's not the redirect_uri, or the url itself, but something in the way that the WebView is presenting it to dropbox.com.

Can anyone help me out? I've also tried taking a uri that works in Safari / Chrome and passing it directly to the webview (bypassing DropboxOAuth2Helper) without any luck. The uri will work in Safari, but not in the WebView.

public App()
{
    Button xamarinBtn = new Button();
    xamarinBtn.Text = "Xamarin";
    xamarinBtn.Clicked += OnButtonClicked;
    xamarinBtn.StyleId = "Xamarin";

    Button dropboxBtn = new Button();
    dropboxBtn.Text = "Dropbox";
    dropboxBtn.Clicked += OnButtonClicked;
    dropboxBtn.StyleId = "Dropbox";

    StackLayout layout = new StackLayout();
    layout.Children.Add(xamarinBtn);
    layout.Children.Add(dropboxBtn);

    ContentPage page = new ContentPage();
    page.Content = layout;

    MainPage = new NavigationPage(page);
}

private void OnButtonClicked(object sender, EventArgs e)
{
    Button btn = sender as Button;

    UrlWebViewSource source = new UrlWebViewSource();
    if (btn.StyleId == "Xamarin")
    {
            source.Url = "https://en.wikipedia.org/wiki/Xamarin";
    }
    else if (btn.StyleId == "Dropbox")
    {
        string oauth2State = Guid.NewGuid().ToString("N");
        Uri authorizeUri = DropboxOAuth2Helper.GetAuthorizeUri(OAuthResponseType.Token, "d1612up7la63slo", "http://127.0.0.1:52475/authorize", oauth2State);
        source.Url = authorizeUri.AbsoluteUri; // https://www.dropbox.com/oauth2/authorize?response_type=token&client_id=d1612up7la63slo&redirect_uri=http%3A%2F%2F127.0.0.1%3A52475%2Fauthorize&state=1062a614aa3d4e2e85cd84de32903987
    }

    WebView webView = new WebView();
    webView.Source = source;

    ContentPage page = new ContentPage();
    page.Content = webView;

    MainPage.Navigation.PushAsync(page);
}

If you don't want to exclude Google Accounts from login to Dropbox, you have to switch to an external browser anyway, to do the authentication. Using the WebView is deprecated by Google and probably by others in future. This makes things a lot more complicated for developers, but in the end a bit more safe for users. — martinstoeckli

Anonymous Anonymous · Accepted Answer · 2018-05-11T09:15:34

You should add that as a OAuth 2 redirect URI for your app via the App Console: After doing this, I tried OC code it works properly and can show the authorize view. But Unfortunately, the Dropbox for Xamarin failed. You can try to use another api to show this view:

Uri authorizeUri = DropboxOAuth2Helper.GetAuthorizeUri("d1612up7la63slo");
source.Url = source.Url = authorizeUri.AbsoluteUri;

Unable to use Xamarin.Forms WebView for Dropbox authentication

1 Answers