phanan / vue-facebook-signin-button Goto Github PK
View Code? Open in Web Editor NEWA simple plugin to include a custom Facebook sign-in button into your web app.
A simple plugin to include a custom Facebook sign-in button into your web app.
was including in created hook for asynchronous flow
when included error occurs Cannot read property 'init' of undefined
at window.fbAsyncInit
window.fbAsyncInit = function() {
FB.init({
appId : '{your-app-id}',
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse social plugins on this page
version : 'v2.8' // use graph api version 2.8
});
};
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
its the data what we get its only name and id? how if i want to get more data like email, phone number, birthday etc. is it possible?
When I add { scope: 'email, manage_pages' } it keeps asking for pages permissions, even if I accepted them.
I've added the library to the project. I've done all the steps but Sign in with Facebook button is not clickable. What would be the problem?
incredible
I know it is not the problem with phanan plugin, but it is happening when I am
using nuxt pwa module, manifest display standalone mode
ios seems like not redirect when user success to login facebook, and occurs empty confirm page.
otherwise, it works in safari browser and google chrome browser
Found lots of problems, it was broken with pwa:(
please do not close this issues. and hope everyone see it if they have same problem.
wait for help
Hi @phanan ,
According to facebook security doc, we make strong our security if we use state parameter. Do you have any plan to add that speciality to the lib? We can generate a random string to pass your lib and when there is an answer from FB, we can check that if we really send that request.
Or, do you have any advise to put state parameter to the request link?
https://developers.facebook.com/docs/facebook-login/security#stateparam
I have implemented Facebook login using the vue-facebook-signin-button. It works fine everywhere except from within the Facebook/Instagram app's built-in browser. There, it seems to just fail, and also this problem occurs randomly on some devices, not all devices.
Does this script goes to the vue's index.js file? is it loaded in index.html
window.fbAsyncInit = function() {
FB.init({
appId : '{your-app-id}',
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse social plugins on this page
version : 'v2.8' // use graph api version 2.8
});
};
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
Hey
Great plugin. I have used it on an older project!
I have a issue when doing a 'build' my Vue project.
I get "ERROR in /Users/Zac/.../RegisterUser.vue Cannot find name 'FB'. "
The thing is the plugin actually works, even though I get this error on my console & this ERROR is what is stopping my from compile/build.
The FB.Init on my index.html works fine with no errors, but when inside 'RegisterUser.vue', it says FB cant be found.
Do you have any suggestions on how I could get rid of this error?
This is a Vue typescript 3.1.3 project.
Thanks in advance!
Kept getting this error any idea why?
<fb-signin-button class="btn btn-default btn-big btn-big--facebook btn-big--with-logo" :class="{ 'is-loading': isLoading }" :params="fbPluginParams" @success="fbLoginSuccess" @error="fbLoginError"> <!-- <i class="fab fa-facebook"></i> --> <bouncing-loader v-if="isLoading"></bouncing-loader> <span class="span-fb" v-else> {{ facebookLogText }} </span> </fb-signin-button>
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.