Paypal授權登入流程及實現

xiji發表於2021-09-06

由於工作專案安排，需要對接Paypal支付，檢視了Paypal官方文件，對於英文不好的我簡直是折磨。於是去百度有關方面的資料，發現中文資料少得可憐，經過幾天的摸索已經實現了功能，現在在這裡做一個記錄。

1.申請Paypal賬號

1.申請賬戶這一步請自行百度，網上教程很多

2.使用賬戶建立沙盒APP，注意！我這裡使用的是沙盒測試環境

1.登入賬戶，在網頁下方找到開發者，點選進入
2.在右上角找到你的頭像，點選My Account
3.進入該頁面內，開啟My Apps，點選Dedault Application來建立APP，預設情況下是沒有的，我這裡已經建立好了

Paypal授權登入流程及實現
4.開啟你剛剛建立的app，記錄下你的clien id和secret，後面會有用到

Paypal授權登入流程及實現
5.在下方找到login in with Paypal，勾選上，點選Adevanced options高階選項

Paypal授權登入流程及實現
6.勾選選項並填寫2個url，為什麼要填寫這2個url，請複製上面的文字並翻譯

Paypal授權登入流程及實現
7.在上方的Renturn url中填寫你的回撥地址，該回撥地址的作用是介面返回的code，你可以使用前端地址，也可以使用端地址，code會以引數的形式，新增到你填寫的回撥地址中。

Paypal授權登入流程及實現
8.在SANDBOS中，開啟accounts選項，在下面你能看你到系統為你建立的2個預設賬戶，使用下面的Personal（個人）賬戶，可以自己去更改賬戶的賬戶名和密碼，請自行嘗試。記錄下賬戶和密碼，後面會用到

Paypal授權登入流程及實現

3.生成前端測試程式碼

 -https://developer.paypal.com/docs/log-in-with-paypal/reference/button-js-builder/

 開啟該地址，生成前端按鈕

Paypal授權登入流程及實現

1.最好使用goole瀏覽器翻譯該頁面，會簡單很多。
2.填寫client id 和 scopes
3.auth end point選擇sandbox
4.在renturn url中填寫你剛剛建立的回撥url，這個url可以是前端網頁，也可以是後臺介面
5.在下方找到生成的程式碼，新建一個html檔案，將生成的程式碼放進去。
6.開啟頁面，你就能得到你的paypal按鈕了，使用該按鈕就能直接呼叫第三方paypal的登入頁面

Paypal授權登入流程及實現

4.根據官方文件提供的介面實現使用者資訊獲取

https://developer.paypal.com/docs/log-in-with-paypal/integrate/
請參照這個地址，認真看完整個文件說明。
1.如果要在正式環境中使用Paypal登入功能，需要7-10天的稽核期，具體要求看說明文件，我這裡使用的是測試沙盒環境
2.獲取授權碼：
    a.如果你的上面的配置按鈕生成的沒有問題，那麼你點選按鈕之後，就會彈出輸入paypal賬戶密碼的框，輸入我們前面的測試個人賬戶的賬號密碼，你將在回撥地址中得到code，如果是前端，那麼code將會在url中。
    b.例如：https://myreturnurl.com/?code={authorization_code}&scope=address%20openid%20profile%20email
3.獲取訪問令牌：
    a.API:https://api-m.sandbox.paypal.com/v1/oauth2/token,
    b.引數2個，分別是code和grant_type，grant_type的值為authorization_code
    c.請求頭1個，官方文件寫的是'Authorization: Basic {Your Base64-encoded ClientID:Secret}' ，看到這個的時候我是一臉懵b的，其實就是在請求頭中加上Authorization引數，值為Basic（這裡有一個空格）加上Base64編碼的ClientID:Secret。
    d.對，你沒有看錯,他們兩個引數用：連線起來，然後使用Base64編碼，前面加上Basic空格
    e.響應引數參考文件
    f.如果你遇到了問題，報錯了，請重頭在仔細閱讀文件，玩一玩大家來找茬的遊戲，我是已經玩吐了的
4.將 refresh_token 換成 access_token
    a.API:https://api-m.sandbox.paypal.com/v1/oauth2/token
    b.引數同上，不同的地方在於grant_type，他的值為refresh_token
    c.如果遇到問題，請玩大家來找茬遊戲
5.通過access_token來獲取使用者資訊
    a.API：https://api-m.sandbox.paypal.com/v1/identity/oauth2/userinfo?schema=paypalv1.1
    b.請求頭引數：
        Authorization: Bearer access_token ，有了上面的經驗，我相信你明白我的意思
        Content-Type: application/json
    c.注意這個請求是get方式，其它api都是post
    d.返回結果請仔細查閱文件：https://developer.paypal.com/docs/api/identity/v1/#userinfo_get

後記

我已經把我踩過的坑和應該注意的地方都寫在了上面，請自行體會，大家來找茬的遊戲我是不太想玩了，已經夠夠的了。
雖然微不足道，但希望能幫助到大家，前人栽樹後人乘涼，我做一次栽樹的。
後面還會有Paypal的相關功能的對接，如果時間寬裕，我也會寫出來我的整個對接過程。
完了。
本作品採用《CC 協議》，轉載必須註明作者和本文連結

相關文章