Search code examples
.netasp.net-mvcinstagraminstagram-api

Instagram Subscription 408 Request Timeout after 2 seconds


I am currently trying to create a 'sync with instagram' mechanism for the users of my MVC website using the instagram subscription feature. Now I have everything set up correctly like they are describing on their api page:

  • I direct the user to their authorization page, getting the authorization successfully.
  • I created a GET and a POST method for the callback method. The GET to test if it is there works with the described parameters (hub.mode=subscribe&hub.challenge=test&hub.verify_token=mytoken) that returns the challenge when successful and I exposed it to the internet using ngrok (which works too)
  • Then I am trying to subscribe to the user which crashes immediately after 2 seconds with a 408 Request timeout. The GET request to the callback url never happens.

I also tried to slightly change what I am sending instagram in that post request, if I change one thing I am getting a bad request instead of the timeout. I've also tried to create my own webclient to up the web requests timeout with no luck.

Does anyone have an idea on what I am doing wrong or where to get more information on what really failed? The instagram documentation is pretty lacking.

Here is the code that crashes with the 408:

        NameValueCollection parameters = new NameValueCollection();
        parameters.Add("client_id", "SECRET"); 
        parameters.Add("client_secret", "SECRET");
        parameters.Add("object", "user");
        parameters.Add("aspect", "media");
        parameters.Add("verify_token", VerifyToken);
        parameters.Add("callback_url", new Uri(baseUri, "api/manage/instagramSubscription").AbsoluteUri);

        var client = new WebClient();
        var result = client.UploadValues("https://api.instagram.com/v1/subscriptions/", "POST", parameters);

EDIT: SOLUTION TO SOLVE THE PROBLEM

Now the problem was like in tompec's solution to avoid ngrok. I have tried to reach out to instagram on why ngrok does not work but no answer as always. I switched to an Azure Function to be able to quickly test the callback that instagram makes. had a few hickups along the way but now it works. I had to rewrite the code for the call though because instagram only accepts form data for this call.

var encoding = new ASCIIEncoding();
        var postData = "client_id=YOURCLIENTID";  
        postData += "&client_secret=YOURSECRET"; 
        postData += ("&object=user");
        postData += ("&aspect=media");
        postData += ("&verify_token=" + VerifyToken);
        postData += ("&callback_url=" + baseUri.AbsoluteUri);
        byte[] data = encoding.GetBytes(postData);

        var myRequest =
            (HttpWebRequest)WebRequest.Create("https://api.instagram.com/v1/subscriptions/");
        myRequest.Method = "POST";
        myRequest.ContentType = "application/x-www-form-urlencoded";
        myRequest.ContentLength = data.Length;
        using (var newStream = myRequest.GetRequestStream())
        {
            newStream.Write(data, 0, data.Length);
        }

        InstagramSubscriptionResponseViewModel instaResponse = null;
        using (var response = myRequest.GetResponse())
        {
            var responseStream = response.GetResponseStream();
            if (responseStream != null)
            {
                using (var responseReader = new StreamReader(responseStream))
                {
                    var result = responseReader.ReadToEnd();

                    // do whatever you want

                }

            }
        }

Solution

  • It is because of ngrok. I don't know why, but I had the same problem and after uploading the files on a web server, it worked.