Github redirect_uri with corner

Question

I am trying to add a login with github in my application. Therefore, when testing on my local computer, I set my callback as http://localhost:8000/login/callback/ .

And after that I add a link to enter my page, for example, <a href="https://github.com/login/oauth/authorize?client_id=CLIENT_ID&scope=user&redirect_uri=http://localhost:8000/login/callback">Login</a> as well as

 $routeProvider.when('/login/callback', { controller: 'loginCtrl' }); 

Success returned me a code with a link like: http://localhost:8000/login/callback?code=cd07ff3b70f5d1d1b8a2 . But angularjs cannot answer correctly.

 Error response Error code 404. Message: File not found. Error code explanation: 404 = Nothing matches the given URI. 

I also tried setting redirect_url to http://localhost:8000/#/login/callback , but the return link looks like this: http://localhost:8000/?code=61e9c8b73c073a0bccc0/#/login/callback

I need a code that will appear at the end of the URL, but not in the middle, so I can use $location.search().code to get my code. How can I install it correctly?

How to change my redirect_uri or change my router?

Answer 1

@lowerkey I still don't know how to do this, but I think that since the page has been reloaded .

If you do not set the html5Mode value to true , then the URL will be # , and if you reload the page, # will track the information in $scope to work with the htmlHistory api so that the application can work even when the page is refreshed.

But as soon as you set html5Mode to true , then there is no # to store any $scope information, and when you reload the page, angular cannot find the appropriate volume so that it returns 404 .

You can check the $ location section in the angularjs manual , it has a section explaining why this is happening.

Page reload

The $ location service allows you to change only the URL; it does not allow reloading the page. When you need to change the URL and reload the page or go to another page, use the lower-level API, $ window.location.href.

Answer 2

we need to somehow push github to send the parameters in an html5-friendly way, i.e.

 /login/callback/:code 

while I created my solution for him:

 var code = parseUrlParam($location.absUrl(), 'code'); function parseUrlParam(url, param){ var temp = url.match(param + '=(\\w*)'); if(!temp[1]){ return false; } return temp[1]; }