Facebook App User Authentication using Java Script SDK: Given URL is not Allowed

Question

I'm trying to implement step two of the Recipe Box Facebook app tutorial. I have followed the instructions in step one to set up my app on Facebook and have uploaded the code pasted below to my server as per the instructions in step two of the tutorial. When I load the web page and click the add-to-timeline link I get a Facebook error stating:

Given URL is not allowed by the Application configuration.

Any insight would be greatly appreciated.

Code:

 <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US"
     xmlns:fb="https://www.facebook.com/2008/fbml"> 
 <head>
<head/> 
<body> 
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
    FB.init({ 
        appId:'328617653826422', cookie:true, 
        status:true, xfbml:true, oauth:true
    });
</script>

<fb:add-to-timeline></fb:add-to-timeline>

<h3>
    <font size="30" face="verdana" color="grey">
        Stuffed Cookies
    </font> 
</h3> 
<p>
    <img title="Stuffed Cookies" 
            src="http://example.com/cookie.jpg" 
            width="550"/>
</p>       
</body> 
</html>

DMCS · Accepted Answer · 2012-01-11 23:38:48Z

In your app settings, be sure that domain you specify is the same domain as where this code lives. Also in the example code, their <head> tag looked like <head prefix="og: http://ogp.me/ns# og_recipebox: http://ogp.me/ns/apps/YOUR_NAMESPACEx#">. Also you appear to be missing the og: tags in your head section as well.

Here's the example code I just downloaded from their site, did I grab the wrong link? Or are you basing yours on old example code?

<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US"> 

<head prefix="og: http://ogp.me/ns# og_recipebox: http://ogp.me/ns/apps/YOUR_NAMESPACEx#"> 
    <meta property="fb:app_id" content="YOUR_APP_ID" /> 
    <meta property="og:type" content="YOUR_NAMESPACE:recipe" /> 
    <meta property="og:title" content="Oreo Stuffed Cookies" /> 
    <meta property="og:image" content="http://YOUR_URL/cookie.jpg" /> 
    <meta property="og:description" content="The Turducken of Cookies" /> 
    <meta property="og:url" content="http://YOUR_URL/cookie.html"> 

    <script type="text/javascript">
    function postCook()
    {
        FB.api('/me/YOUR_NAMESPACE:cook&recipe=http://YOUR_URL/cookie.html','post',  function(response) {
            if (!response || response.error) {
                alert('Error occured');
              } else {
                alert('Post was successful! Action ID: ' + response.id);
              }
        });
    }
    </script>
</head> 

<body> 
    <div id="fb-root"></div>
    <script src="http://connect.facebook.net/en_US/all.js"></script>
    <script>
        FB.init({ 
            appId:'YOUR_APP_ID', cookie:true, 
                    status:true, xfbml:true, oauth:true
        });
        </script>
        <fb:add-to-timeline></fb:add-to-timeline>>
        <h3>
            <font size="30" face="verdana" color="grey">Stuffed Cookies
            </font> 
        </h3> 
        <p>
            <img title="Oreo Stuffed Cookies" src="http://YOUR_URL/cookie.jpg" width="550"/><br />
        </p>       

        <form>
            <input type="button" value="Cook" onclick="postCook()" />
        </form>

        <fb:activity actions="YOUR_NAMESPACE:cook"></fb:activity>
    </body> 
</html>

The code you posted is from stage 4 of the tutorial the code I posted is from stage 2 where you're just trying to authenticate the user. Never the less you were absolutely right there was a typo in the domain name in the apps Facebook settings, once I fixed that it worked. Thanks a bunch!

Collectives™ on Stack Overflow

Facebook App User Authentication using Java Script SDK: Given URL is not Allowed

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related