前言

公司在用 Keycloak 作為認證服務器，之前在系統資料庫里存的，后來想了想是不是可以在 Keycloak 中存，在網上找的方法大多都是通過 admin 介面去改，但這種方法就需要兩種解決方案，一種就是需要一個能登 admin 賬號的服務去改，另一個就是直接改資料庫，這里經過本人研究提供一種新方法，

準備作業

賦予客戶端用戶在 account 介面修改和讀取用戶資訊的角色

接入介面

1. 在前端撰寫代碼通過 GET 方法訪問 https://<你的 KeyCloak 域名>/auth/realms/<你的 Realm>/account/，且 Content-Type 必須為 application/json，下面是參考代碼

let token = "<你的 token>"
let myHeaders = new Headers();
myHeaders.append("Content-Type", "application/json");
myHeaders.append("Authorization", "Bearer " + token);

let requestOptions = {
   method: 'GET',
   headers: myHeaders
};

let userInfo = await fetch("https://<你的 KeyCloak 域名>/auth/realms/<你的 Realm>/account/", requestOptions)
   .then(response => response.json())
   .catch(error => console.log('error', error));

2. 編輯資訊，用戶資訊的 JSON 結尾處有 attributes 屬性，attributes 是存盤自定義資訊的地方，賦值格式是"attributes": { "phone": ["133"], 'birthday': ["2023"] }，屬性值是陣列里面包一個字串，資料格式參考如下

原始資訊

{
  "id": "xxxx",
  "username": "xxxx",
  "firstName": "xxx",
  "lastName": "xxx",
  "email": "[email protected]",
  "emailVerified": false,
  "userProfileMetadata": {
    "attributes": [
      {
        "name": "username",
        "displayName": "${username}",
        "required": true,
        "readOnly": true,
        "validators": {}
      },
      {
        "name": "email",
        "displayName": "${email}",
        "required": true,
        "readOnly": false,
        "validators": {
          "email": {
            "ignore.empty.value": true
          }
        }
      },
      {
        "name": "firstName",
        "displayName": "${firstName}",
        "required": true,
        "readOnly": false,
        "validators": {}
      },
      {
        "name": "lastName",
        "displayName": "${lastName}",
        "required": true,
        "readOnly": false,
        "validators": {}
      }
    ]
  },
  "attributes": {
    "birthday": [
      "2023/05/09"
    ],
    "avatar": [
      "http://test.com/test.jpg"
    ],
    "locale": [
      "zh-CN"
    ]
  }
}

增加手機號（phone 屬性，值為 13333）

{
  "id": "xxxx",
  "username": "xxxx",
  "firstName": "xxx",
  "lastName": "xxx",
  "email": "[email protected]",
  "emailVerified": false,
  "userProfileMetadata": {
    "attributes": [
      {
        "name": "username",
        "displayName": "${username}",
        "required": true,
        "readOnly": true,
        "validators": {}
      },
      {
        "name": "email",
        "displayName": "${email}",
        "required": true,
        "readOnly": false,
        "validators": {
          "email": {
            "ignore.empty.value": true
          }
        }
      },
      {
        "name": "firstName",
        "displayName": "${firstName}",
        "required": true,
        "readOnly": false,
        "validators": {}
      },
      {
        "name": "lastName",
        "displayName": "${lastName}",
        "required": true,
        "readOnly": false,
        "validators": {}
      }
    ]
  },
  "attributes": {
    "birthday": [
      "2023/05/09"
    ],
    "avatar": [
      "http://test.com/test.jpg"
    ],
    "locale": [
      "zh-CN"
    ],
    "phone": [
      "13333"
    ]
  }
}

3. 提交資訊，將修改后的 JSON 通過 POST 方法再發回 https://<你的 KeyCloak 域名>/auth/realms/<你的 Realm>/account/，回傳 Body 中無內容，判斷成功失敗看介面是否回傳 200，參考代碼

requestOptions = {
   method: 'POST',
   headers: myHeaders,
   body: userInfo
};

let result = await fetch("https://<你的 KeyCloak 域名>/auth/realms/<你的 Realm>/account/", requestOptions)
   .catch(error => console.log('error', error));

標籤：其他

上一篇：記錄--極致舒適的Vue頁面保活方案

下一篇：返回列表