Django使用Social-Auth實現微信第三方網站掃碼登入的方法介紹

前言

之前讓網頁公司製作新官網的時候規劃有第三方帳號的登入功能，但由於當時的一些開放平台申請步驟比較繁瑣（尤其是開放平台），所以一直拖延著，到了最近只能自己添加相關的功能。

由於是剛接觸Python和Django，期間找了好多視頻和資料學習練習，才慢慢把MVT結構什麼的弄明白了，第三方登入方面百度找到了兩篇很有用的文章，也從中學習到了很多：

1. python實現第三方網站掃碼登入(Django)
2. 用django-social-auth 做中國社交網站三方登入(QQ,微博,豆瓣,百度,人人,)

在實現QQ、微博的登入時就深刻體會到使用social-auth來實現第三方登入是非常簡單方便、直接而且完美的，然而卻一直沒有找到怎麼也同樣來實現（上面第二篇文章也一樣沒有提及）；從social-auth的解讀文檔裡也愣是沒找到Weixin的內容，由於官網已經有相應的User資料表以及儲存第三方的UserSocialAuth資料格，非常規範，在使用上面第一種方法實現之後卻苦惱於使用者資料表的添加和修改，真心不想破壞那種結構，就在重拾social-auth想學習一下資料庫儲存方式的時候，竟然在social-backends裡發現了Weixin.py,那不就說明能支援嗎？

注意事項

• 開放平台申請及開通需要提交很多認證資料，也需要繳納￥300每年的認證費用；與公眾號、服務號等不一樣哦。地址：http://open.weixin.qq.com

• 認證通過後，添加相應的網頁應用，注意授權回調域的填寫，寫網站的主網域名稱即可，比如說不能寫www.zzmxy.com/login/wechat之類的，只需要寫www.zzmxy.com 即可（不需要添加http或者https），不然後期都是redirect_uri 參數錯誤!

實操步驟

1. 安裝social-auth：
   由於官網使用的是python-social-auth==0.2.12，下載源碼回來之後，發現在social-backends裡也是有Weixin.py的，證明可用；

   pip install python-social-auth==0.2.12

2. social-auth配置：

• SOCIAL_AUTH_PIPELINE配置：請參考上面提及的第二篇文章的書寫；

• AUTHENTICATION_BACKENDS配置：

  AUTHENTICATION_BACKENDS = (   'social.backends.weibo.WeiboOAuth2',      #微博的功能   'social.backends.qq.QQOAuth2',            #QQ的功能   'social.backends.weixin.WeixinOAuth2',    #這個是匯入的功能   'oscar.apps.customer.auth_backends.EmailBackend',   'django.contrib.auth.backends.ModelBackend',   )

• 開放平台應用APPID與SECRET的配置：

  SOCIAL_AUTH_WEIBO_KEY = '53*****29'SOCIAL_AUTH_WEIBO_SECRET = '272152************81a8b3'SOCIAL_AUTH_QQ_KEY = '10*****51'SOCIAL_AUTH_QQ_SECRET = '5807************d15bd97'SOCIAL_AUTH_WEIXIN_KEY = 'wx4fb***********599'            #開放平台應用的APPIDSOCIAL_AUTH_WEIXIN_SECRET = 'f1c17************08c0489'    #開放平台應用的SECRET

3. 配置完之後，運行你的網站，使用 www.網域名稱.com/login/weixin 訪問即可開啟相應的頁面了，但有沒有發現出現錯誤了：Scope參數錯誤或沒有Scope許可權，實際操作過程中，我發現social-auth自動產生的二維碼訪問連結裡，是少了一個scope參數，而官方給的二維碼訪問連結是這樣的：

   https://open.weixin.qq.com/connect/qrconnect?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect

   如上需要的參數為5個，state可省略，但scope則是必需的，而對於網頁授權的訪問，scope範圍參數為固定值scope=snsapi_login，這樣的話，我們就需要在social-auth的原始碼上，把這個參數值給加上，根據你實際的site-packages安裝路徑，找到/social/backends/weixin.py檔案，如我使用VirtualEnv建的路徑是:

   /home/ubuntu/env/mppython/lib/python2.7/site-packages/social/backends/weixin.py

   開啟這個檔案，找到裡面def auth_params()這一段內容（原文）：

   def auth_params(self, state=None):    appid, secret = self.get_key_and_secret()    params = {        'appid': appid,        'redirect_uri': self.get_redirect_uri(state),    }    if self.STATE_PARAMETER and state:        params['state'] = state    if self.RESPONSE_TYPE:        params['response_type'] = self.RESPONSE_TYPE    return params

   在params字典裡，添加一個scope參數即可，修改後如下：

   def auth_params(self, state=None):    appid, secret = self.get_key_and_secret()    params = {        'appid': appid,        'redirect_uri': self.get_redirect_uri(state),        'scope': 'snsapi_login',    }    if self.STATE_PARAMETER and state:        params['state'] = state    if self.RESPONSE_TYPE:        params['response_type'] = self.RESPONSE_TYPE    return params

   修改儲存後，再重新運行工程，再次訪問 www.網域名稱.com/login/weixin 即可看到效果了！