From 7564399be06b37eaa092258acaacf43d667b1d2e Mon Sep 17 00:00:00 2001 From: Prasad Date: Mon, 4 Mar 2019 18:57:12 +0000 Subject: [PATCH] Added proxy link in react's package.json and added login api code in index.js of node server. Also added api calling code from react for login api in App.js --- client/package.json | 3 +- client/src/App.js | 22 ++++++- index.js | 136 +++++++++++++++++++++++++++++++++++++++++++- 3 files changed, 157 insertions(+), 4 deletions(-) diff --git a/client/package.json b/client/package.json index 92b1070..21675be 100644 --- a/client/package.json +++ b/client/package.json @@ -23,5 +23,6 @@ "not dead", "not ie <= 11", "not op_mini all" - ] + ], + "proxy": "http://193.1.131.26:8888/" } diff --git a/client/src/App.js b/client/src/App.js index 8c8050f..2d4a742 100755 --- a/client/src/App.js +++ b/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 (
@@ -18,9 +37,10 @@ class App extends Component { */} +

{this.state.responseToPost}

); } } -export default App; +export default App; \ No newline at end of file diff --git a/index.js b/index.js index 861dea3..e1933da 100644 --- a/index.js +++ b/index.js @@ -5,6 +5,8 @@ var ip = require('ip'), bodyParser = require('body-parser'), methodOverride = require('method-override'), expressSanitizer = require('express-sanitizer'); + querystring = require('querystring'); + cors = require('cors'); //================= //=============== @@ -12,7 +14,14 @@ 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,7 +31,130 @@ app.use(expressSanitizer()); //=============== +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) { @@ -30,7 +162,7 @@ app.get("*", function (req, res) { }); //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);