Code Monkey home page Code Monkey logo

flask-login-example's Introduction

Flask-Login-example

Login register facebook Login - Python Flask

常看到別人的網站有登入、註冊、使用FACEBOOK登入,今天教你使用 Python Flask 建立一個。

使用 Python Flask 搭配 Flask-Login 實現登入機制,也透過 Facebook API完成常見的使用Facebook登入。

特色

  • 搭配 Flask-Login 實現登入、註冊機制。
  • 透過 Facebook API 完成常見的使用 Facebook 登入。
  • 資料庫(database)使用 SQLite。

安裝套件 Flask-Login

請先確定電腦有安裝 Python

Flask-Login

pip install flask-login

更多 Flask-Login ,可參考 Flask-Login

使用Facebook登入-前置作業

請先到  facebook-developer,點右上角的 我的應用程式,選 新增應用程式

接著輸入 顯示名稱 以及選擇 類別,如下圖

alt tag

接著頁面會跳到 alt tag

選擇 新增平台,這裡選擇 網站 當作範例 alt tag

輸入 網域,這裡先輸入 localhost alt tag

接下來將你的 應用程式編號 貼到下方

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
      });
  };

更詳細的請看 Facebook JavaScript SDK,請到 facebook developers

執行畫面

登入頁

alt tag

註冊頁

alt tag

使用Facebook登入 alt tag

執行環境

  • Python 3.4.3

Reference

External JS

Donation

文章都是我自己研究內化後原創,如果有幫助到您,也想鼓勵我的話,歡迎請我喝一杯咖啡:laughing:

alt tag

贊助者付款

License

MIT license

flask-login-example's People

Contributors

twtrubiks avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

flask-login-example's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.