Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add social sign in functionality (Google, Facebook, Twitter) #2155

Merged
merged 21 commits into from
Oct 21, 2015
Merged

Add social sign in functionality (Google, Facebook, Twitter) #2155

merged 21 commits into from
Oct 21, 2015

Conversation

moifort
Copy link
Contributor

@moifort moifort commented Oct 16, 2015

Generator:

  • Add a new question to enable social, by default it's false (just after that @jdubois delete one, so we have still 15 questions).
  • Only available for the HTTP Session Authentication

Functionality:

  • Possibility to connect with Twitter, Facebook, Google from the login and register screens.
  • Sending mail after registration with social .
  • Associate social connection with email account (ex: you have already create an account with moi@jhipster.com, if you register with a google account who has the same email it will use the same account).
  • If you register a new account with social sign in and the social don't have login/username, by default your login will be your email address.
  • I already put clientId and clientSecret keys but only for the test (http://localhost:8080/signin) so you can test directly after generation :).
  • Add an option in the application.yml to specify the url after sign in.

Other:

To do:

  • Make the documentation that explain how have clientId and clientSecret for Twitter, Google and Facebook and an other part to explain how to add a new social sign in.

EDIT: I remove the Facebook keys because the Facebook API has been upgraded and spring-social-facebook is not working anymore, but dont worry there is a PR pending on the repository: spring-attic/spring-social-facebook#171

Close #1649

return 'signin/' + provider;
};

socialService.getCSRF = function () {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't know if it's a good way to get the CRSF to put in the form?

<%_ } _%>
"font-awesome": "4.4.0",
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Adding font-awesome is probably going to add a lot of resources, at the moment we only use "normal" bootstrap -> the idea is that we provide something "light" by default, but it's easy for people to extend (just do a Bower install). Can you remove this, and add the Bootstrap class instead?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok, two options:

  • I remove totally the font-awesome lib, and the icon of the social button too (because icon like Twitter, Facebook dont exist in bootstrap icon package)
  • I add font awesome only when social is enabled

Wich one you prefer?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Normally we use icons from Bootstrap, have a look at http://getbootstrap.com/components/

  • can you find something good enough?
  • anyway there might be copyright issues with using brand logos, I'd rather not go there

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No there are no brand icon on bootstrap icon set :(. I will remove font-awesome, and add to the documentation how to add the icon on the button.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@jdubois I remove the font-awesome, but there is a problem, the social button is not compatible without icon. I can just create a simple bootstrap button, but we loose the user experience. On all the website it's the same type of button (icon and color).

My opinion it's keep font-awesome, I think the ratio weight/utility is good, like you said it's add more ressource but allow user to use more icons and some special effect like loading icon. I prefer to keep it for a better user experience.

But if you prefer to not use it I can just create a simple button with the label.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

+1 for Font Awesome, even if it's only included when someone wants social
authentication. I use it on all my client projects.
On Sat, Oct 17, 2015 at 07:38 Thibaut Mottet notifications@github.com
wrote:

In app/templates/_bower.json
#2155 (comment)
:

     <%_ } _%>
  •    "font-awesome": "4.4.0",
    

@jdubois https://github.com/jdubois I remove the font-awesome, but
there is a problem, the social button is not compatible without icon. I can
just create a simple bootstrap button, but we loose the user experience. On
all the website it's the same type of button (icon and color).

My opinion it's keep font-awesome, I think the ratio weight/utility is
good, like you said it's add more ressource but allow user to use more
icons and some special effect like loading icon. I prefer to keep it for a
better user experience.

But if you prefer to not use it I can just create a simple button with the
label.


Reply to this email directly or view it on GitHub
https://github.com/jhipster/generator-jhipster/pull/2155/files#r42309339
.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes it's good to use Font Awesome, that's what I use for the main JHipster website :-)
But here I don't want to add lots of CSS/images for everyone -> it should be easy to add, but not here by default
@moifort could you just use a String? Or just some specific images?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I create button with string and css:
capture d ecran 2015-10-19 a 10 45 24

@@ -173,6 +173,36 @@
constraintName="fk_evt_pers_audit_evt_data"
referencedColumnNames="event_id"
referencedTableName="jhi_persistent_audit_event"/>
<% if (enableSocialSignIn) { %>
<!-- Social -->
<createTable tableName="jhi_UserConnection">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

all our table names are now lower case, can you write this in lower case?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

btw, where is this table configured?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I use the default one: https://github.com/spring-projects/spring-social/tree/master/spring-social-core/src/main/java/org/springframework/social/connect/jdbc. I am working to make compatible with the naming. I rewrite the class JdbcConnectionRepository.java and JdbcUsersConnectionRepository.java using spring Data JPA.

@jdubois
Copy link
Member

jdubois commented Oct 19, 2015

Oups sorry I was merging this and I see you didn't put the table names in lower case:

  • There's a little merge to do -> nothing complex, you use the same lines as the new "test framework" question, so you need to keep both
  • Can you tell me when you have put the database names in lower case?

@moifort
Copy link
Contributor Author

moifort commented Oct 19, 2015

@jdubois yes yes! not yet! sorry I have not finish, I change the code to make it compatible in lower case and there are some work on it. And the sign in didn't work in OAuth2 :(.
Ok for the merge.

@jdubois
Copy link
Member

jdubois commented Oct 19, 2015

If OAuth2 doesn't work just exclude it with some if...then -> I want a first working version, not a perfect version!

Thibaut added 3 commits October 19, 2015 17:08
Thibaut added 2 commits October 20, 2015 02:04
- add package-info
- add cache
- add repository + domain
- only available for session authentification
@moifort
Copy link
Contributor Author

moifort commented Oct 20, 2015

@jdubois I finish the compatibility and add some little things like:

  • add Gradle config
  • package-info.java
  • main.css and main.scss copy with template mode and add the test enableSocialSignIn
  • add the domain SocialUserConnection to the config cache (ehcache.xml)
  • enable only for the option HTTP Session Authentication

@@ -0,0 +1,116 @@
package <%=packageName%>.social.config;

import com.mycompany.myapp.social.repository.SocialUserConnectionRepository;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You need to use the package name here

@jdubois
Copy link
Member

jdubois commented Oct 21, 2015

@moifort I will probably rework the generator questions. We could have only one question for authentication:

  • session
  • session + social
  • oauth2
  • token

And I would keep the current variables, as it's easier to use.

@moifort
Copy link
Contributor Author

moifort commented Oct 21, 2015

@jdubois If you want me to do it?

@jdubois
Copy link
Member

jdubois commented Oct 21, 2015

If the time at midday yes! Otherwise I think I'm gonna merge this after lunch :-)

@moifort
Copy link
Contributor Author

moifort commented Oct 21, 2015

@jdubois sorry, I will don't have the time for midday :(

@jdubois
Copy link
Member

jdubois commented Oct 21, 2015

@moifort no problem, I'll do it :-)

@jdubois jdubois modified the milestone: 2.23.0 Oct 21, 2015
jdubois added a commit that referenced this pull request Oct 21, 2015
Add social sign in functionality (Google, Facebook, Twitter)
@jdubois jdubois merged commit 3f411dc into jhipster:master Oct 21, 2015
@jdubois
Copy link
Member

jdubois commented Oct 21, 2015

Merged it!
But now I see you didn't put the repositories in the repository package, etc... So I'm going to refactor all this to use the normal package names

@moifort
Copy link
Contributor Author

moifort commented Oct 21, 2015

This is done on purpose, my idea it's to isolate social like a module (because it's not a really part of the project like user or entities). So if you work on social everything it's on the package (no need to find your class in all the project). That's why I put the Spring config too.

If you want to change it, don't forget to remove the annotation @EnableJpaRepositories in the config file SocialConfiguration.java.

@jdubois
Copy link
Member

jdubois commented Oct 21, 2015

Yes I understand, but the idea is that all the repos are in the same place, etc (including so that the configurations are all in one place)
I'm not saying it's better -> those are 2 ways to modularize the application, and both are correct in their own way. Here I'm just trying to have something homogenous in the generated app.

@moifort
Copy link
Contributor Author

moifort commented Oct 21, 2015

sorry for the refacto :(

@jvence
Copy link

jvence commented Oct 21, 2015

Is there anyway to enable Social sign in with oAuth based authentication. At a minimum to enable easy registration and synching relationships?

@jdubois
Copy link
Member

jdubois commented Oct 21, 2015

@jvence not yet, this is needs to be coded. This would be another issue.

@jvence
Copy link

jvence commented Oct 21, 2015

@moifort Out of curiosity why doesn't social sign in work with oAuth based authentication?

@moifort
Copy link
Contributor Author

moifort commented Oct 21, 2015

I don't know, I don't looked more than that.

@jvence
Copy link

jvence commented Oct 21, 2015

So why is it disabled when you create an oAuth app with jhipster?

@jdubois
Copy link
Member

jdubois commented Oct 21, 2015

@jvence as I said, this is another issue -> at the moment we only provide the core feature, then we will improve it.
This other issue isn't created yet, let's first wait until we have some feedback on this one.

@jahu
Copy link

jahu commented Nov 2, 2015

Guys, I've just started to play with social login with jHipster and after success login in facebook app I retrieve following exception:

[ERROR] pl.app.web.rest.SocialController - Exception creating social user:
org.springframework.social.UncategorizedApiException: (#3) Application does not have the capability to make this API call.

I believe it's related to changes of facebook API several days ago (spring-attic/spring-social-facebook#171)

Are those changed already fixed and merged to jHipster repo (and I am doing something wrong) or facebook login simply does not work at the moment (due to bug in spring social)?

EDIT: I've checked with some of my older facebook application which is not using latest facebook API and it is working OK, so the problem is definetally not yet solved.

@moifort moifort deleted the feature/social branch March 9, 2016 11:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

5 participants