跳到主要内容

跨域资源共享

对于一些自建前端项目与 HAP 结合使用的场景,由于跨域问题,前端默认无法直接调用 HAP 系统 API。

如下图所示,需要在代理层的配置文件中设置允许跨域请求的 HTTP 头部参数(无代理层则需要额外部署,参考 代理配置

配置示例如下:

location / {

add_header Access-Control-Allow-Origin '允许跨域访问的地址,如:https://a.domain.com,多个使用英文逗号分隔';
add_header Access-Control-Allow-Credentials 'true';
add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
add_header Access-Control-Allow-Headers '根据前端传递的 Header 参数自行调整,如:X-Requested-With,Authorizatioon';

if ($request_method = 'OPTIONS') {
return 204;
}
......
}

警告

如果要保证接口调用的安全性,不建议采用以上方式

HAP 系统开放了很多标准的 API,如每个应用都有自己的【API 开发文档】模块,接口调用基于 AppKeySign 的认证模式。

如果采用以上方式前端直接调用,这无非是公开了 AppKeySign 等信息(能访问系统的用户都可以查看前端代码),利用这些参数值就可以随意调用接口获取数据。

推荐做法如下图所示:

自建项目的前端不再直接调用 HAP API,而是通过自建项目自身服务端提供的 API,自建项目前端与服务端保持认证关系(比如需要登录状态认证),最终通过自建项目的服务端与 HAP API 交互,相关的 AppKeySign 将配置在自建项目服务端,前端完全不可见,从而保证接口调用的安全性。