Skip to content

Instantly share code, notes, and snippets.

@BenjaminRqt

BenjaminRqt/FacebookLoginVue3.vue

Last active September 26, 2020 15:39
Show Gist options
  • Save BenjaminRqt/8d17f1e0453357a947347e3dfa25e2a3 to your computer and use it in GitHub Desktop.
Save BenjaminRqt/8d17f1e0453357a947347e3dfa25e2a3 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. BenjaminRqt renamed this gist Sep 26, 2020. 1 changed file with 0 additions and 0 deletions.
    0 FaceboolLoginVue3.vue → FacebookLoginVue3.vue
    View file
    File renamed without changes.
  2. BenjaminRqt revised this gist Sep 26, 2020. 1 changed file with 10 additions and 10 deletions.
    20 changes: 10 additions & 10 deletions FaceboolLoginVue3.vue
    View file
    Original file line number Diff line number Diff line change
    @@ -6,16 +6,16 @@
    export default {
    setup() {
    const logInWithFacebook = async () => {
    await loadFacebookSDK(document, "script", "facebook-jssdk");
    await loadFacebookSDK(document, "script", "facebook-jssdk")
    initFacebook().then(r => {
    window.FB.login(function (response) {
    if (response.authResponse) {
    alert("You are logged in & cookie set!");
    alert("You are logged in &amp cookie set!")
    } else {
    alert("User cancelled login or did not fully authorize.");
    alert("User cancelled login or did not fully authorize.")
    }
    })
    return false;
    return false
    })
    }
    @@ -30,14 +30,14 @@ export default {
    }
    const loadFacebookSDK = async (d, s, id) => {
    let js, fjs = d.getElementsByTagName(s)[0];
    let js, fjs = d.getElementsByTagName(s)[0]
    if (d.getElementById(id)) {
    return;
    return
    }
    js = d.createElement(s);
    js.id = id;
    js.src = "https://connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
    js = d.createElement(s)
    js.id = id
    js.src = "https://connect.facebook.net/en_US/sdk.js"
    fjs.parentNode.insertBefore(js, fjs)
    }
    return {
  3. BenjaminRqt created this gist Sep 26, 2020.
    48 changes: 48 additions & 0 deletions FaceboolLoginVue3.vue
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,48 @@
    <template>
    <button class="button" @click="logInWithFacebook"> Login with Facebook</button>
    </template>

    <script>
    export default {
    setup() {
    const logInWithFacebook = async () => {
    await loadFacebookSDK(document, "script", "facebook-jssdk");
    initFacebook().then(r => {
    window.FB.login(function (response) {
    if (response.authResponse) {
    alert("You are logged in &amp; cookie set!");
    } else {
    alert("User cancelled login or did not fully authorize.");
    }
    })
    return false;
    })
    }
    const initFacebook = async () => {
    window.fbAsyncInit = function () {
    window.FB.init({
    appId: "3313555114XXXXXX", //You will need to change this
    cookie: true, // This is important, it's not enabled by default
    version: "v13.0"
    })
    }
    }
    const loadFacebookSDK = async (d, s, id) => {
    let js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) {
    return;
    }
    js = d.createElement(s);
    js.id = id;
    js.src = "https://connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
    }
    return {
    logInWithFacebook,
    }
    }
    }
    </script>