IDEA支付寶小程式開發流程——授權登入

廣州蘆葦科技Java開發團隊發表於2019-01-04

前言

我們都知道，基本99%的物聯網產品的資料都是圍繞使用者來進行的，不言而喻使用者在系統中是必不可少的一個環節。為此，繼上篇的專案搭建之後，本文將給大家演示支付寶小程式授權登入的搭建流程！廢話不多說，直接上程式碼！

前置條件

獲取APPID
新增獲取會員資訊服務詳情 >
開發管理 >
功能列表 >
新增功能 >
勾選獲取會員資訊 >
確認，新增完成後的效果如下圖所示

*PS:如果想獲取手機號和姓名等真實資訊，需要額外申請獲取敏感資訊申請流程
設定祕鑰
- 用阿里的金鑰生成工具生成公私鑰
- 上傳應用公鑰並獲取支付寶公鑰
  - 登入開放平臺-開發者中心，選擇小程式，找到對應的小程式，點選【檢視】>
    【設定】>
    【開發設定】 >
    【介面加簽方式】 >
    【設定應用公鑰】 >
    【設定應用公鑰】 >
    把簽名驗籤工具裡“公鑰”的內容複製到此處，點選“儲存”完成金鑰設定
儲存成功後頁面變成下圖所示

公鑰用於驗籤使用

伺服器端

在專案的pom.xml中新增服務端SDK

<
dependency>
 <
groupId>
com.alipay.sdk<
/groupId>
 <
artifactId>
alipay-sdk-java<
/artifactId>
 <
version>
3.4.49.ALL<
/version>
<
/dependency>
複製程式碼

在application.yaml檔案中新增appid、公鑰、私鑰的配置

tips: 公鑰不是工具生成的公鑰，而是【公鑰設定成功頁面]裡】點選檢視支付寶公鑰裡獲取的公鑰

讀取配置檔案工具類AliXcxProperty.java

package com.example.demo.properties;
import lombok.Data;
import org.springframework.boot.context.properties.ConfigurationProperties;
import org.springframework.stereotype.Component;
/** * @Description * @Author LW-mochengdong * @Date 2018/12/22 11:42 **/@Data@Component@ConfigurationProperties(prefix = "luwei.ali.xcx")public class AliXcxProperty { 
private String serverUrl;
 private String appId;
 private String privateKey;
 private String publicKey;

  }複製程式碼

IndexController.java的程式碼

@GetMapping("/auth")public AlipayUserInfoShareResponse auth(@RequestParam String authcode){ 
return indexService.auth(authcode);

  }複製程式碼

IndexService.java

package com.example.demo.service;
import com.alibaba.fastjson.JSONObject;
import com.alipay.api.AlipayApiException;
import com.alipay.api.AlipayClient;
import com.alipay.api.DefaultAlipayClient;
import com.alipay.api.request.AlipaySystemOauthTokenRequest;
import com.alipay.api.request.AlipayUserInfoShareRequest;
import com.alipay.api.response.AlipaySystemOauthTokenResponse;
import com.alipay.api.response.AlipayUserInfoShareResponse;
import com.example.demo.properties.AliXcxProperty;
import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Service;
import javax.annotation.Resource;
/** * @Description * @Author LW-mochengdong * @Date 2018/12/22 11:38 **/@Slf4j@Servicepublic class IndexService { 
@Resource private AliXcxProperty aliXcxProperty;
 public AlipayUserInfoShareResponse auth(String authcode) { 
 AlipayClient alipayClient = new DefaultAlipayClient(aliXcxProperty.getServerUrl(),    aliXcxProperty.getAppId(),    aliXcxProperty.getPrivateKey(),    "JSON", "utf-8", aliXcxProperty.getPublicKey(), "RSA2");
  //獲取uid&
token  AlipaySystemOauthTokenRequest request = new AlipaySystemOauthTokenRequest();
  request.setGrantType("authorization_code");
//值為authorization_code時，代表用code換取；值為refresh_token時，代表用refresh_token換取  request.setCode(authcode);
  try { 
  AlipaySystemOauthTokenResponse response = alipayClient.execute(request);
   if (response.isSuccess()) { 
   log.info("auth success [{
  }]", JSONObject.toJSONString(response));
    AlipayUserInfoShareRequest alipayUserInfoShareRequest = new AlipayUserInfoShareRequest();
    AlipayUserInfoShareResponse alipayUserInfoShareResponse = alipayClient.execute(alipayUserInfoShareRequest, response.getAccessToken());
    if (alipayUserInfoShareResponse.isSuccess()) { 
    log.info("AlipayUserInfoShareResponse success [{
  }]", JSONObject.toJSONString(alipayUserInfoShareResponse));
    
  } else { 
    log.info("AlipayUserInfoShareResponse fail [{
  }]", JSONObject.toJSONString(alipayUserInfoShareResponse));
    
  }    return alipayUserInfoShareResponse;
   
  } else { 
   log.info("auth fail [{
  }]", JSONObject.toJSONString(response));
   
  }  
  } catch (AlipayApiException e) { 
  log.error("auth exception", e);
  
  }  return null;
 
  }
  }複製程式碼

以上，伺服器端的授權登入工作完畢，釋出即可！

客戶端

index.axml檔案

<
view>
    {{index
  }
  }    <
button onTap="index">
 首頁 <
/button>
  <
button onTap="getAuthCode">
 授權 <
/button>
<
/view>
複製程式碼

index.js檔案

getAuthCode(){ 
 my.getAuthCode({ 
 scopes: 'auth_user', // 主動授權（彈框）：auth_user，靜默授權（不彈框）：auth_base  success: (res) =>
 { 
 if (res.authCode) { 
   // 認證成功    // 呼叫自己的服務端介面，讓服務端進行後端的授權認證，並且種session，需要解決跨域問題    my.httpRequest({ 
     url: 'https://app2120230256test.mapp-test.xyz/auth', // 該url是自己的服務地址，實現的功能是服務端拿到authcode去開放平臺進行token驗證      data: { 
       authcode: res.authCode      
  },      success: () =>
 { 
       // 授權成功並且伺服器端登入成功      
  },      fail: () =>
 { 
       // 根據自己的業務場景來進行錯誤處理      
  },    
  });
  
  }  
  },  
  });

  }複製程式碼