AngularJs解决跨域问题案例详解(简单方法)

首先，让我们做一些准备和解释，否则，你会明白我的意思，其他人不会明白。就算别人懂，总会有人不懂。那你必须说出来。我的意思是，这个解释一定要做，答案是必须的，这样才能让大家更容易理解。

我们可以以两个主域名或一个主域名和一个辅助域名为例来演示跨域问题。

客户a.com

服务器b.com或s.a.com。

AngularJs版本V1.2.25

准备工作做得很好，但透露我们的编辑是一个子行。我不会告诉这个普通人。

有人在喊。这个问题已经存在很久了。现在提出来有什么意义？也许你能骗过花？嗯，我真的可以打开花。去剧院，我们将在本文中展示的是一个完整的跨领域示例。

接下来，让我们看看客户端是如何请求数据的。

请注意，我们的代码是用a.com的域名写的。

！DOCTYPE html html lang=' en ' ng-app=' app ' hearteta charset=' UTF-8 ' title/title script src=' http :/angular . min . js '/script script type=' text/JavaScript ' var app=angular . module(' app '，[])；app.controller('appCtrl '，['$scope '，function($ scope){ $ http({ method : ' JSONP '，URL : ' http://www . b.com/test . PHP？回调=JSON_CALLBACK '，})。成功(函数(msg) {console.log(数据)；});//或$ http . jsonp(' http://www.b.com/test.php?回调=JSON_CALLBACK ')。成功(函数(msg){ console . log(msg))；});}]);/script/head body/body/html我们可以看到跨域请求是直接以jsonp的形式进行的，其操作与jquery中的跨域请求完全相同。注意我们的回调是固定的，也就是JSON_CALLBACK，所以尽量不要做任何改动。

让我们看看服务器端b.com的test.php是如何处理请求的数据的。这里，我们用原生php引用它。

$回调=isset($_GET['回调'])？$ _ GET[' CALLBACK ']: DEFAULT _ CALLBACK；exit($ CALl)。'('.json_encode($data)。')');让我们回顾一下客户端控制台记录的结果

至此，也就是说，我们的跨域请求成功了！

最后简单总结一下，注意重点：

1.跨域客户端请求的url后面附加了哪些参数？回调=JSON_CALLBACK。参数回调的值被指定为JSON_CALLBACK。注意它是大写的，也就是说JSON_CALLBACK不应该更改。感觉这是一个大坑。如果回调值稍有变化，客户端需要全局定义回调函数，如何传递到$scope进行处理？为了避免不必要的麻烦，这里建议这样做。

2.看服务器，服务器需要指定$ callBack=$ _ GET[' callBack ']；收到回拨，你会发现收到的回拨不是我们客户端写的？回调的值，客户端指定JSON_CALLBACK应该是触发angularJs的内部机制。