Added proxy link in react's package.json and added login api code in …

client/package.json

@@ -23,5 +23,6 @@
     "not dead",
     "not ie <= 11",
     "not op_mini all"
-  ]
+  ],
+  "proxy": "http://193.1.131.26:8888/"
 }

client/src/App.js

@@ -6,7 +6,26 @@ import Auth from './Auth.js';
 import './App.css';
 
 class App extends Component {
+
+  state = {
+    response: '',
+    post: '',
+    responseToPost: 'default reponse',
+  };
+  componentDidMount() {
+    this.callApi()
+      .then(res => this.setState({ response: res.express }))
+      .catch(err => console.log(err));
+  }
+  callApi = async () => {
+    const response = await fetch('/login');
+    //const body = await response.json();
+    if (response.status !== 200) throw Error("Error");
+    return "success";
+  };
+
   render() {
+    const { username } = this.state;
     return (
       <div className="App">
         <BrowserRouter>
@@ -18,9 +37,10 @@ class App extends Component {
             <Route component={NoMatch} /> */}
           </Switch>
         </BrowserRouter>
+        <p>{this.state.responseToPost}</p>
       </div>
     );
   }
 }
 
-export default App;
+export default App;

index.js

@@ -5,14 +5,23 @@ var ip = require('ip'),
     bodyParser = require('body-parser'),
     methodOverride = require('method-override'),
     expressSanitizer = require('express-sanitizer');
+    querystring = require('querystring');
+    cors = require('cors');
 //======</requirements>===========
 
 //=======<APP SETUP>========
 var app = express();
 
 app.set("view engine", "ejs"); //use  embeded-javascript
 
-app.use(express.static(__dirname + '/public')); //use public directory to server staic files
+app.use(express.static(__dirname + '/public'));//.use(cors()); //use public directory to server staic files
+
+var allowCrossDomain = function(req, res, next) {
+    res.header("Access-Control-Allow-Origin", "*"); // allow requests from any other server
+    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE'); // allow these verbs
+    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, Cache-Control");
+}
+//app.use(allowCrossDomain);
 
 app.use(bodyParser.urlencoded({
     extended: true
@@ -22,15 +31,138 @@ app.use(expressSanitizer());
 
 //=======</APP SETUP>========
 
+var client_id = '870a9d9904df428083cf0d56bd2691dd'; // Your client id
+var client_secret = '03ecf690adb643719a4abcba701aa36f'; // Your secret
+var redirect_uri = 'http://localhost:3000/callback'; // Your redirect uri
+
+/**
+ * Generates a random string containing numbers and letters
+ * @param  {number} length The length of the string
+ * @return {string} The generated string
+ */
+var generateRandomString = function(length) {
+  var text = '';
+  var possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+
+  for (var i = 0; i < length; i++) {
+    text += possible.charAt(Math.floor(Math.random() * possible.length));
+  }
+  return text;
+};
+
+var stateKey = 'spotify_auth_state';
+
+app.get('/login',function(req, res) {
+  console.log("in the login api");
+  var state = generateRandomString(16);
+  res.cookie(stateKey, state);
+
+  // your application requests authorization
+  var scope = 'user-read-private user-read-email';
+  res.redirect('https://accounts.spotify.com/authorize?' +
+    querystring.stringify({
+      response_type: 'code',
+      client_id: client_id,
+      scope: scope,
+      redirect_uri: redirect_uri,
+      state: state
+    }));
+});
+
+app.get('/callback', function(req, res) {
 
+    // your application requests refresh and access tokens
+    // after checking the state parameter
+
+    var code = req.query.code || null;
+    var state = req.query.state || null;
+    var storedState = req.cookies ? req.cookies[stateKey] : null;
+
+    if (state === null || state !== storedState) {
+      res.redirect('/#' +
+        querystring.stringify({
+          error: 'state_mismatch'
+        }));
+    } else {
+      res.clearCookie(stateKey);
+      var authOptions = {
+        url: 'https://accounts.spotify.com/api/token',
+        form: {
+          code: code,
+          redirect_uri: redirect_uri,
+          grant_type: 'authorization_code'
+        },
+        headers: {
+          'Authorization': 'Basic ' + (new Buffer(client_id + ':' + client_secret).toString('base64'))
+        },
+        json: true
+      };
+
+      request.post(authOptions, function(error, response, body) {
+        if (!error && response.statusCode === 200) {
+
+          var access_token = body.access_token,
+              refresh_token = body.refresh_token;
+
+          var options = {
+            url: 'https://api.spotify.com/v1/me',
+            headers: { 'Authorization': 'Bearer ' + access_token },
+            json: true
+          };
+
+          // use the access token to access the Spotify Web API
+          request.get(options, function(error, response, body) {
+            console.log(body);
+            console.log(body.id);
+          });
+
+          // we can also pass the token to the browser to make requests from there
+          res.redirect('/#' +
+            querystring.stringify({
+              access_token: access_token,
+              refresh_token: refresh_token
+            }));
+        } else {
+          res.redirect('/#' +
+            querystring.stringify({
+              error: 'invalid_token'
+            }));
+        }
+      });
+    }
+  });
+
+  app.get('/refresh_token', function(req, res) {
+
+    // requesting access token from refresh token
+    var refresh_token = req.query.refresh_token;
+    var authOptions = {
+      url: 'https://accounts.spotify.com/api/token',
+      headers: { 'Authorization': 'Basic ' + (new Buffer(client_id + ':' + client_secret).toString('base64')) },
+      form: {
+        grant_type: 'refresh_token',
+        refresh_token: refresh_token
+      },
+      json: true
+    };
+
+    request.post(authOptions, function(error, response, body) {
+      if (!error && response.statusCode === 200) {
+        var access_token = body.access_token;
+        res.send({
+          'access_token': access_token
+        });
+      }
+    });
+  });
 
 //any route we havent defined
 app.get("*", function (req, res) {
     res.send("yo")
 });
 
 //port listener
-app.listen('3001', ip.address(), function () {
+app.listen('8888', ip.address(), function () {
     console.log("SERVER STARTED!!!");
     var address = ip.address() + ":3000";
     console.log("goto -> " + address);