I need a Social Login guide!

Question

Hi!
So I'm trying to take my completely unprotected, already existing website and protect it with a Social Login (for example LinkedIn).
The problem is, I can only find guides showing me how to retrieve and display user data after they clicked the login button. This in no way hides the content of my existing site _behind_ the LinkedIn login.
Can anyone recommend a guide that helps me with this, in a pedagogic and detailed way? Or in the least suggest a better forum for this question.
Note: My page is a SPA (Single Page App), so redirects are not an option. I need an Ajax solution.
PS! I also want to store the user info to a MySQL database and check if the user already exists (so not to throw errors if they do). I need this to be done even if the user is already logged in to LinkedIn when they visit my page (from what I can gather, the logout function of the LinkedIn Javascript SDK/API is directly connected to the users login status on linkedin.com and cannot be separated)

Answer 1

Yes u can
You create your own database ,
And you itself create a ID & password of 3 accounts
1 for friends
2 for job
3 for unknown people
And log there timings and usage
You will get to know how many times they log in

Answer 2

https://support.knack.com/hc/en-us/articles/230318168-Create-a-Single-Login-Page-for-Multiple-User-Roles?mobile_site=true
Create a Single Login Page for Multiple User Roles – Knack

Answer 3

Adrian Stubergh Stensrud
You want to make users to login by there LinkedIn account ?
If they don't have they are restricted

Answer 4

https://developer.linkedin.com/docs/getting-started-js-sdk#initialize

Answer 5

You can use your own database instead of making it more complex with others

Answer 6

Adrian Stubergh Stensrud
Is this you looking for
https://developer.linkedin.com/docs/signin-with-linkedin

Answer 7

1) Create hidden-content.php
2) When a user visits your webpage an Ajax Request is made to hidden-content.php
3) Now you can check with javascript if the user is logged in
4) If the user isnt authenticated via LinkedIn, display a login form with Javascript as soon as LinkedIn tells you that the user is authenticated make a new Ajax Request to hidden-content.php and show it to the user.
Did I miss something?

Answer 8

Thanks Charan LEo25 , but that guide is specific for a content management system I don't use or plan to use..
To be more clear, this is the structure I need:
Social Login {
My already existing website, only visible to those who logged in and authorized LinkedIn
}

Answer 9

Charan LEo25 indeed. The website is my CV/Resume so.. I'm just trying to 1) Give potential employers a link instead of confirming to a new form for my CV for each employer (they all persist in using own systems) and 2) Track who actually took part of my information

Answer 10

Fake Facebook profiles, random Google accounts etc is not wanted, neither is random users (by building a user system of my own).

Answer 11

Can you tell us a bit more?
In what job area do you work?
Do you work in a Team or alone?
Was that your own idea?
Why is your website a SPA?
Who is the owner of the website you want to protect with the login?
Who is the administrator of the owner's website?
Does it really have to be AJAX?
(If you are willing to do so, please give us a link to your website so we can have a look at the situation)

Answer 12

@N00B
-I see where you are getting at, but it's not really relevant. But since you were curious, I can share this (as long as this won't steer the topic off point): The page is a long way from deployment and it will be written so that the info relevant to my field of work is prioritized first and presented to the reader first. In the long run, it will be dynamic so that the info is shown first/last based on the type of employer I share it with (stretch goal and a WHOLE other topic)
-Not relevant. It's my personal CV/Resumé (but yes, it's only me working on it).
-My own idea.
-It's SPA because it challenges me, and I believe it gives the users a better experience in this case (no need for specific page linking in this case).
-I'm the owner (it's just a CV/Resumé page..).
-I'm the administrator (it's just a CV/Resumé page..).
-Yes, it really has to be AJAX.
I stripped all the info I had on it so far and moved it to a domain I seldom use, so you can see it in action. The preferable result would of course be either a login button on the welcome page (in the content) or a fixed floating one on top, which when clicked logs in the user by asking them to authorize my site on LinkedIn and when the popup closes, they should be able to access the content of each of the pages. If not logged in, the loaded pages should just prompt them to login.. A COMPLETE from the page (so even the foundation design) is also a valid option (like I originally stated that I wanted)
https://lent.life/cv/
(I recommend browsing it in portrait mode on a mobile device, though it should technically work with landscape too, and the desktop version just isn't as nice)
And just to have it said: I'm fully aware that the CSS file only needs to be 59% of what it is. Cleaning it up is the last nail in the coffin, so nothing I'll bother with now (should anyone feel the need to comment on that :D)

Answer 13

Yes, I intend to use my own database, but I want to provide an easy login so they don't have to register manually. That's just annoying friction for a potential employer, and I don't think they gladly just register an account somewhere half random.

Answer 14

Charan LEo25 I guess, that could be shared though, and is not very smart from a security perspective and I've set out to use LinkedIn. Either way, what in looking for is how to implement it, not if it can be done or not. I _know_ it's possible, so why not learn it?

Answer 15

Charan LEo25 really? Please read my question. That's the first place I looked.

Answer 16

N00B you covered everything but the practical implementation 😂

Answer 17

Adrian Stubergh Stensrud ah ok, I see what I can do with the practical implementation. 🤣
What kind of user info do you want to store in the database? Usernames? Passwords?
Isn't the username checked on LinkedIn and you shouldn't have to do anything with user credentials?

Answer 18

N00B just the name and email is enough. That info is already provided by their API.