I've looked everywhere, I've followed the legendary 360 Facebook Authentication by Ryan Bates but I still can't figure out why I am getting this:

```
The parameter app_id is required.

```

I cannot figure out how to set these: `ENV['FACEBOOK_APP_ID']` and `ENV['FACEBOOK_SECRET']`

What is the simplest way of setting these so that when I hit the service it successfully reads these variables from whatever they are supposed to be read from? I tried pasting the values I got from Facebook into `config.ru` but it seems that the values are not being read from here (app id and app secret) and I'm still getting the same error.

I don't know what I am missing.

Here is what I have so far:

`omniauth.rb`:

```
    OmniAuth.config.logger = Rails.logger

    Rails.application.config.middleware.use OmniAuth::Builder do
      provider :facebook, ENV['FACEBOOK_APP_ID'], ENV['FACEBOOK_SECRET']
    end

```

`config.ru`:

```
    # This file is used by Rack-based servers to start the application.

    require ::File.expand_path('../config/environment', __FILE__)

    use Rack::Session::Cookie, :secret => '<my secret is here>'

    use OmniAuth::Builder do
      provider :facebook, ENV['FACEBOOK_APP_ID'], ENV['FACEBOOK_SECRET'], :scope => 'email,read_stream'
    end

    run Rails.application

```

`application.html.erb`:

```
    <!DOCTYPE html>
    <html>
    <head>
      <title>WebProfiler</title>
      <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
      <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
      <%= csrf_meta_tags %>
    </head>
    <body>
      <div id="fb-root">
        <div class="fb-login-button" data-max-rows="1" data-size="medium" data-show-faces="false" data-auto-logout-link="true"></div>
      </div>
      <script src="../javascripts/facebookMagic.js">
      /*
      FB.api('/me', function(response) {
        console.log(JSON.stringify(response));
      });
      </script>
      <div class="jumbotron">
        <div class="container">

          <div id="user_nav">
            <% if current_user %>
              Signed in as <strong><%= current_user.name %></strong>
              <%= link to "Sign out", signout_path, id: "sign_out" %>
            <% else %>
              <%= link_to "Sign in with Facebook", "/auth/facebook", id: "sign_in"%>
            <% end %>
          </div>

          <% flash.each do |name,msg| %>
            <%= content_tag :iv, msg, id: "flash_#{name}" %>
          <% end %>

          <%= render 'components/search' %>
          <%= yield %>
        </div>
      </div>
    </body>
    </html>

```

`facebookMagic.js`:

```
            // This is called with the results from from FB.getLoginStatus().
    function statusChangeCallback(response) {
      console.log('statusChangeCallback');
      console.log(response);
      // The response object is returned with a status field that lets the
      // app know the current login status of the person.
      // Full docs on the response object can be found in the documentation
      // for FB.getLoginStatus().
      if (response.status === 'connected') {
        // Logged into your app and Facebook.
        testAPI();
      } else if (response.status === 'not_authorized') {
        // The person is logged into Facebook, but not your app.
        document.getElementById('status').innerHTML = 'Please log ' +
        'into this app.';
      } else {
        // The person is not logged into Facebook, so we're not sure if
        // they are logged into this app or not.
        document.getElementById('status').innerHTML = 'Please log ' +
        'into Facebook.';
      }
    }

    // This function is called when someone finishes with the Login
    // Button.  See the onlogin handler attached to it in the sample
    // code below.
    function checkLoginState() {
      FB.getLoginStatus(function(response) {
        statusChangeCallback(response);
      });
    }

    window.fbAsyncInit = function() {
      FB.init({
        appId      : '1415171068775427',
        appSecret : 'd597ac96d2042c77ab0cf0e94d9a28fcReset'
        cookie     : true,  // enable cookies to allow the server to access
        // the session
        xfbml      : true,  // parse social plugins on this page
        version    : 'v2.1' // use version 2.1
      });

      // Now that we've initialized the JavaScript SDK, we call
      // FB.getLoginStatus().  This function gets the state of the
      // person visiting this page and can return one of three states to
      // the callback you provide.  They can be:
      //
      // 1. Logged into your app ('connected')
      // 2. Logged into Facebook, but not your app ('not_authorized')
      // 3. Not logged into Facebook and can't tell if they are logged into
      //    your app or not.
      //
      // These three cases are handled in the callback function.

      FB.getLoginStatus(function(response) {
        statusChangeCallback(response);
      });

    };

    // Load the SDK asynchronously
    (function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "//connect.facebook.net/en_US/sdk.js";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));

    // Here we run a very simple test of the Graph API after login is
    // successful.  See statusChangeCallback() for when this call is made.
    function testAPI() {
      console.log('Welcome!  Fetching your information.... ');
      FB.api('/me', function(response) {
        console.log('Successful login for: ' + response.name);
        document.getElementById('status').innerHTML =
        'Thanks for logging in, ' + response.name + '!';
      });
    }

```