Getting an error with Instagram when trying to authenticate

Question

In a Universal Windows App (UWP), I'm trying to log the user into his/her Instagram account, but have no luck. I keep getting the following error after the user enters their credentials and pressed the login button:

Here is the code being used:

var scopes = new List<OAuth.Scope>();
scopes.Add(InstaSharp.OAuth.Scope.Basic);

var link = InstaSharp.OAuth
                .AuthLink
                (
                    _config.OAuthUri + "authorize",
                    _config.ClientId,
                    _config.RedirectUri,
                    scopes,
                    InstaSharp.OAuth.ResponseType.Token
                );

var webAuthResult = await WebAuthenticationBroker
                                .AuthenticateAsync
                                (
                                    WebAuthenticationOptions.None,
                                    new Uri(link)
                                );

switch (webAuthResult.ResponseStatus)
{
    case WebAuthenticationStatus.Success:
        return true;

    case WebAuthenticationStatus.UserCancel:
        return false;

    case WebAuthenticationStatus.ErrorHttp:
        return false;

    default:
        return false;
}

Am I doing something wrong??

UPDATE 1:

Here is a UWP quick sample that demonstrates the issue:

UWP SAMPLE

UPDATE 2:

I found the problem that caused the "cannot connect to service" error. Here was the code that caused the problem:

        _config = new InstagramConfig(clientIdTextBox.Text,
                                clientSecretTextBox.Text,
                                WebAuthenticationBroker.GetCurrentApplicationCallbackUri().ToString(),
                                WebAuthenticationBroker.GetCurrentApplicationCallbackUri().ToString());

My 3rd parameter, the Redirect Url, is not a web address, but an application link. If I were to change that to a simple Url like www.instagram.com, then it works, HOWEVER the browser stays open on that redirect url.

How do I make the browser redirect back to my UWP app using the redirect Url ???

Maximus · Accepted Answer · 2016-10-28T13:09:01.857

I found my problem!

In the end, my redirect Url was not matching exactly to the Url I provided in my Instragram developer account, that was causing the issue.

UPDATE:

Although I fixed my problem, and I receive my access code correctly, it seems there is a bigger problem with Instragram because I always receive a 400 Bad Request. And from what I've seen around online from other developers, this is a very common problem. I'm in a sandbox environment, I wonder if that has anything to do with it.

score 0 · Answer 2 · answered Oct 19 '16 at 21:21

0

What is the final string of the link variable you are using. It should be like the below URL

https://instagram.com/oauth/authorize/?client_id={your_client_id}&redirect_uri={your_redirect_url}&response_type=code

If you have a parameter value as part of your redirect URL, you have to add another=true both in the Instagram app and in your redirect URL that you are sending from the code.

Then you have to proceed to step 2 of the oauth process after receiving the response from instagram website for the above call.

answered Oct 19 '16 at 21:21

Mukil Ram Ilango

11
3

This is my link: https://api.instagram.com/oauth/authorize?client_id=&redirect_uri=ms-app://s-1-15-2-1005028906-2239310109-3402011355-130426970-480924263-3476788055-3018980986/&response_type=token&scope=basic – Maximus Oct 21 '16 at 13:20
I've added a sample app in my post. – Maximus Oct 21 '16 at 17:02

score 0 · Answer 3 · answered Oct 24 '16 at 15:04

It seems that you are developing a WPF windows application. In this case, i would suggest that you create a web service or WCF service and put the logic of calling instagram API and receiving the access token from the instagram API in the web service and host the service in the server. Then you can give the service web address in the instagram App as the valid URl. If you have a server IP then it is fine. If you are hosting in the local IIS, then try tunneling your localhost to the internet.

I do not have the code for WPF windows application. Below is the code i use for my c# WEB API that does the Instagram OAuth2. You can translate this to your case.

Method 1:- First Step of Oauth

private void MakeRequestForToken()
{
    string instagramIntialRedirectUrl = "https://instagram.com/oauth/authorize/?client_id={yourclientid}&redirect_uri={Should  be a valid URL that can be accessed by instagram}&response_type=code"
    Response.Redirect(instagramUrl);
}

Method 2 :- Second Step of Oauth(The Redirect URL should be given in such a way that the response which is directed to the redirect URL from instagram reaches this method)

private void HandleAuthorizeTokenResponse()
{
    var request = (HttpWebRequest)WebRequest.Create("https://api.instagram.com/oauth/access_token");
    var postData = "client_id=" + AppKey + "&client_secret=" + AppSecret + "&grant_type=authorization_code&code=" + Code + "&redirect_uri=" + RedirectUrl;
    var data = Encoding.ASCII.GetBytes(postData);
    request.Method = "POST";
    request.ContentType = "application/json; charset=utf-8";
    request.ContentLength = data.Length;
    using (var stream = request.GetRequestStream())
    {
        stream.Write(data, 0, data.Length);
    }
    var response = (HttpWebResponse)request.GetResponse();
    var reader = new StreamReader(response.GetResponseStream());
    string objText = reader.ReadToEnd();
}

Hope this helps!

Thanks for the reply, i'll try your code, but I'm writing a UWP app and not WPF, making a web service is out of scope, but I'll try it your way. — Maximus, Oct 24 '16 at 15:48

Getting an error with Instagram when trying to authenticate

UPDATE 1:

UPDATE 2:

3 Answers3

UPDATE: