HeyPhoto网络请求分析

之前对这个网站做了网络请求相关的分析，特此记录

一、登录与注册

https://hey-photo.com/ 基于JWT来进行身份信息的验证

1、注册

注册成功返回的Token即可以使用的{{UserToken}}

接口名称	接口地址	请求方法	Request Body	Response
注册	https://auth.icons8.com/api/auth/v1/register	POST	{     "email":"",     "password":"",     "subscribe":true,     "name":"" }	{     "success":false,     "error":"User with email "" already exists",     "code":"AUTH_EMAIL_ALREADY_TAKEN" } {     "token":"{{UserToken}}",     "success":true }

2、登录

登录存在两个接口：https://auth.icons8.com/api/auth/v1/login（POST）、https://api-icons.icons8.com/user/v2（GET）

第一个用于上传账号密码验证信息获取{{LoginToken}}，第二个基于{{LoginToken}}获取可以进行身份识别的{{UserToken}}

（1）验证账号信息

获取{{LoginToken}}，这个Token不能用来进行操作验证！！！

接口名称	接口地址	请求方法	Request Body	Response
验证账号信息	https://auth.icons8.com/api/auth/v1/login	POST	{     "email": "",     "password": "" }	{     "token": "{{LoginToken}}",     "success": true }

（2）获取身份Token

Headers中添加key-value（Authorization: {{LoginToken}}）
这个请求返回才是{{UserToken}}

接口名称	接口地址	请求方法	Request Body	Response
获取身份Token	https://api-icons.icons8.com/user/v2	GET	NONE	{     "token":"{{UserToken}}",     "success":true }

二、图片上传

上传图片主要依赖如下三步：上传图片前置-import、上传图片、上传图片后置-import-confirm，分别如下

1、上传前置-import

上传图片前先有个获取上传链接的操作，主要是获取{{upload url}}和{{import id}}

Headers中添加key-value：【Authorization: {{UserToken}}】

接口名称	接口地址	请求方法	Request Body	Response
上传图片前置-import	https://api.hey-photo.com/api/v1/uploads/import	POST	{     "filename":"filename.jpeg",     "md5_checksum":"",     "width":512,     "height":768 }	{     "id":"{{import id}}",     "upload_url":"{{upload url}}",     "image_url":"" }

上述md5_checksum计算方法如下：

import cryptoJs from 'crypto-js'

export function getFileCheckSum(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader()
    reader.onload = function (event) {
      const binary = event.target.result
      const md5Checksum = cryptoJs.MD5(binary).toString()
      resolve(md5Checksum)
    }
    reader.onerror = function (e) {
      reject(e)
    }
    reader.readAsBinaryString(file)
  })
}

2、图片上传

基于上述获取的{{upload url}}，向Amazon S3上传图片数据，Request Body直接放图片的二进制字符串

Headers中添加key-value：【Content-Length: {{上传文件的字节数}}】

3、上传后置-import-confirm

基于 上传前置-import 获取到的{{import id}}，获取{{upload id}}，用于后面的获取眼神方向图，

Headers中添加key-value：【Authorization: {{UserToken}}】

接口名称	接口地址	请求方法	Request Body	Response
上传图片后置-import-confirm	https://api.hey-photo.com/api/v1/uploads/import-confirm	POST	{     "id":"{{import id}}" }	{     "id":"{{upload id}}",     "bbox":[],     "source":{         "width":512,         "height":768,         "url":"",         "type":"jpeg"     },     "thumb":{         "url":"",         "width":250,         "height":250,         "type":"jpeg"     } }

三、图片获取

1、眼神方向变化的简要概述

HeyPhoto对眼神方向的和变化并不是实时计算的，而是在第一次上传图片的时候计算一遍，之后的眼神变换都是基于已经换好的脸部分割图（一共25种基于鼠标位置的眼神变化）

并且HeyPhoto只会对分割出来的脸部图进行算法处理生成25种眼神图

2、获取所有图片（账号下生成过的原图+25张眼神方向图）

Headers中添加key-value：【Authorization: {{UserToken}}】

接口名称	接口地址	请求方法	Request Body	Response
获取所有图片	https://api.hey-photo.com/api/v1/images?page=1&per_page=30	GET	NONE	{     "total":6,     "images":[         {             "id":"{{image id}}", "upload_id":"{{upload id}}",             "adjustments":[                 {                     "id":"{{adjustments id}}",                     "status":"ready",                     "type":"gaze",                     "current_face_index":0,                     "current_preload_index":null,                     "bbox":null,                     "crop":{},                     "url":null,                     "queue":"high",                     "options":{ "page":4, "per_page":4 },                     "preloads":[                         {                             "url":"",                             "bbox":[208.41177368164062, 115.39736938476562, 348.21453857421875, 315.02911376953125, 0.8569380044937134],                             "crop":{ "x":210, "y":119 }, "options":{ "direction":337.5, "factor":0.75, "page":4 }                         }                     ],                     ......(一共25张眼神图)                 }             ],             "faces":[ {"bbox":[208.41177368164062,  115.39736938476562,  348.21453857421875,  315.02911376953125,0.8569380044937134]}             ],             "source":{ "width":512, "height":768, "url":"", "type":"jpeg" }         },         ......(其他原图+25张眼神图)     ] }

3、基于上传的图片获取眼神变换图（25张眼神方向）

每一列接口均依赖于前一列所获取的值

	获取import id	基于import id，获取upload id	基于upload id，获取image id	基于image id，构造请求链接，获取adjustments id	基于image id和adjustments id，构造请求链接（获取25张眼神方向图）
接口地址	https://api.hey-photo.com/api/v1/uploads/import	https://api.hey-photo.com/api/v1/uploads/import-confirm	https://api.hey-photo.com/api/v1/images	https://api.hey-photo.com/api/v1/images/{{image id}}	https://api.hey-photo.com/api/v1/images/{{image id}}/adjustments/{{adjustments id}}
请求方法	POST	POST	POST	GET	PUT
Request Payload	{     "filename":"filename.jpeg",     "md5_checksum":"",     "width":512,     "height":768 }	{     "id":"{{import id}}" }	{     "current_face_index":0,     "adjustment":{     },     "upload_id":"{{upload id}}" }	{     "current_face_index":0,     "adjustment":{         "gaze":{             "page":1         }     } }	{     "current_preload_index":5 }
Responsed	{     "id":"{{import id}}",     "upload_url":"",     "image_url":"" }	{     "id":"{{upload_id}}",     "bbox":[     ],     "source":{         "width":512,         "height":768,         "url":"",         "type":"jpeg"     },     "thumb":{         "url":"",         "width":250,         "height":250,         "type":"jpeg"     } }	{     "id":"{{image_id}}",     "upload_id":"{{upload id}}",     "adjustments":[     ],     "faces":[         {             "bbox":[ 190.04208374023438, 91.14981079101562 ]         }     ],     "source":{         "width":512,         "height":768,         "url":"",         "type":"jpeg"     } }	{     "id":"{{image_id}}",     "upload_id":"{{upload id}}",     "adjustments":[         {             "id":"{{adjustments id}}",             "status":"queue",             "type":"gaze",             "current_face_index":0,             "current_preload_index":null,             "bbox":[ 190.04208374023438, 91.14981079101562, ],             "crop":{},             "url":null,             "queue":"high",             "options":{ "page":1, "per_page":4 },             "preloads":[]         }     ],     "faces":[         {             "bbox":[ 190.04208374023438, 91.14981079101562 ]         }     ],     "source":{ "width":512, "height":768, "url":"", "type":"jpeg" } }	{     "id":"",     "status":"processing",     "type":"gaze",     "current_face_index":0,     "current_preload_index":5,     "bbox":[ 190.04208374023438, 91.14981079101562],     "crop":{     },     "url":"",     "queue":"high",     "options":{         "page":3,         "per_page":4     },     "preloads":[         {             "url":"",             "bbox":[ 190.04208374023438, 91.14981079101562],             "crop":{ "x":188, "y":87 },             "options":{ "direction":0, "factor":0, "page":1 }         },         {             "url":"",             "bbox":[ 190.04208374023438, 91.14981079101562],             "crop":{ "x":186, "y":85 },             "options":{ "direction":90, "factor":0.5, "page":1 }         },                ......25张不同方向眼神图     ] }