Angular.js：将 $http.get 透明地转换为 $http.jsonp 请求的 CORS HttpInterceptor

Posted 2023-03-03

【中文标题】Angular.js：将 $http.get 透明地转换为 $http.jsonp 请求的 CORS HttpInterceptor

【英文标题】：Angular.js : CORS HttpInterceptor that transforms $http.get into $http.jsonp request transparently

【发布时间】：2014-07-03 05:03:38

【问题描述】：

我一直在研究是否可以创建我的Chrome Plugin 的基于网络的版本 现在它完全依赖于 Trakt.TV 的 JSON API。

根据 Angular 的文档，可以在多个级别拦截 HTTP 请求，一个是 HTTP Backend 本身（虽然主要用于测试），另一个是 HTTPInterceptor.get

基本想法是通过http://json2jsonp.com/ 包装对 Trakt.TV 的 JSONP api 的调用，并让它们透明地返回以绕过跨站点脚本限制。这不仅对我自己的项目非常有用，而且对许多其他处理相同问题的人也很有用（因此我会在完成后发布模块，但我想正确地完成它）

基础应该很简单：

在正确的级别挂钩 $http.get 请求 覆盖原来的请求 取消已设置的可选其他请求 通过 $http.jsonp(http://json2jsonp.com/) 钩住它 完成后返回原始承诺的成功/失败

问题：

有人建造过这样的东西吗？ （Github 搜索一无所获） 您建议使用 HTTPBackend 还是 HTTPInterceptor？

【参考方案1】：

为什么不能只使用 jsonp 辅助函数？ httpBakend 是一个模拟后端服务器的服务，它不用于实时代码。 http拦截器会做你想做的事，如果url包含你想要过滤的名字，你只需要将回调函数名称附加到你的请求中，然后在响应拦截器中你必须将响应传递给回调函数，这样json就可以了评估。请注意，拦截器将通过角度检查每个请求，这不是很有效，除非您只调用电视服务。 就像我之前说的，更好的方法是使用 $http.jsonp 函数

https://docs.angularjs.org/api/ng/service/$http#jsonp

关于拦截器，它们需要被定义为服务，然后在您的应用配置期间传递给 HttpProvider。

【讨论】：

我知道 $http.jsonp。这就是我将用来代理请求的内容。我的意思是我想保持原始请求不变，无论是 $http.xml、jsonp、get 还是其他的

也许我想念你，你不想保持“请求”不变，但生成请求的代码是这样吗？