[发明专利]一种绘制跨域图像的交互系统及方法

权利要求书

1.一种绘制跨域图像的交互系统，其特征在于，包括：

第一服务器；

一至多个第二服务器，一至多个所述第二服务器均与所述第一服务器连接；

客户端，连接于所述第一服务器，当所述客户端向所述第一服务器发送跨域图像请求时，所述第一服务器依据所述跨域图像请求向一至多个所述第二服务器中的一个或多个请求并获取图片资源，所述第一服务器将所述图片资源回传至所述客户端，所述客户端将所述图片资源载入至Canvas元素。

2.根据权利要求1所述的交互系统，其特征在于，所述客户端中的前端页面通过JavaScript代码检查URL对应的图片资源是否跨域，若是，则对所述URL进行参数转义，将进行参数转义后的URL发送至所述第一服务器。

3.根据权利要求2所述的交互系统，其特征在于，所述第一服务器对进行参数转义后的URL进行解析以向一至多个所述第二服务器中对应的一个或多个请求并获取所述图片资源。

4.根据权利要求3所述的交互系统，其特征在于，所述第一服务器对所述图片资源进行同源同域处理之后，返回至所述客户端，所述客户端的前端页面以同源同域策略将所述图片资源载入至Canvas元素。

5.根据权利要求1-4任一项所述的交互系统，其特征在于，所述客户端将所述图片资源进行本地缓存。

6.一种绘制跨域图像的交互方法，提供如权利要求1所述的交互系统，其特征在于，包括以下步骤：

S1、藉由客户端的前端页面向第一服务器发送跨域图像请求；

S2、所述第一服务器依据所述跨域图像请求向一至多个第二服务器中的一个或多个请求并获取图片资源；

S3、所述第一服务器将所述图片资源回传至所述客户端，所述客户端将所述图片资源载入至Canvas元素。

7.根据权利要求6所述的交互方法，其特征在于，所述步骤S1还包括：

所述客户端的前端页面通过JavaScript代码检查URL对应的图片资源是否跨域，若是，则对所述URL进行参数转义，将进行参数转义后的URL发送至所述第一服务器。

8.根据权利要求7所述的交互方法，其特征在于，所述步骤S2还包括：

所述第一服务器对进行参数转义后的URL进行解析以向一至多个所述第二服务器中对应的一个或多个请求并获取所述图片资源。

9.根据权利要求8所述的交互方法，其特征在于，所述步骤S3还包括：

所述第一服务器对所述图片资源进行同源同域处理之后，返回至所述客户端，所述客户端的前端页面以同源同域策略将所述图片资源载入至Canvas元素。

10.根据权利要求6-9任一项所述的交互方法，其特征在于，所述步骤S3还包括：

所述客户端将所述图片资源进行本地缓存。