ajax跨域问题(三种解决方案)

ajax跨域问题(三种解决方案)

为什么会出现跨域

    跨域问题来源于JavaScript的同源策略,即只有 协议+主机名+端口号 (如存在)相同,则允许相互访问。也就是说JavaScript只能访问和操作自己域下的资源,不能访问和操作其他域下的资源。跨域问题是针对JS和ajax的,html本身没有跨域问题,比如a标签、script标签、甚至form标签(可以直接跨域发送数据并接收数据)等

如何解决跨域问题

    JSONP
      JSONP是JSON with Padding的略称。它是一个非官方的协议,它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域访问(这仅仅是JSONP简单的实现形式)。关于jsonp的使用方式,可以参考http://blog.csdn.net/alen1985/article/details/6365394,优缺点可以参考http://blog.csdn.net/z69183787/article/details/19191385  
    添加响应头,允许跨域
      addHeader(‘Access-Control-Allow-Origin:*’);//允许所有来源访问
      addHeader(‘Access-Control-Allow-Method:POST,GET’);//允许访问的方式
    代理的方式
    服务器A的test01.html页面想访问服务器B的后台action,返回“test”字符串,此时就出现跨域请求,浏览器控制台会出现报错提示,由于跨域是浏览器的同源策略造成的,对于服务器后台不存在该问题,可以在服务器A中添加一个代理action,在该action中完成对服务器B中action数据的请求,然后在返回到test01.html页面。

Demo1(添加允许跨域请求的响应头)

    html页面

    Web后台

    按照上面的访问,由于127.0.0.1:8080和localhost:8081的域和端口不同,所以同样会出现跨域问题。

现在用添加响应头的方式

Demo2(jsonp的callback方式)

这里演示的是jquery的ajax,后台采用的是webservice接口形式

注意此时的dataType为jsonp格式,看看后台的接收

我们返回的其实就是一个函数的调用文本,这里注意,callback的名称,由于前台没有指定callback函数,所以这里自动生成了,如果想自定义回调函数名称如下操作,添加一行请求参数

这样后台的回调函数名就变成了mytest

浏览器发出的请求格式和响应数据如下,其实就是返回函数的调用,而需要返回的数据则以函数参数值的形式填入

此时控制台就能够获取到“hello world”

推荐参考资料:
http://www.cnblogs.com/chopper/archive/2012/03/24/2403945.html
———————
作者:吴渣渣
来源:CSDN
原文:https://blog.csdn.net/u014727260/article/details/72793459
版权声明:本文为博主原创文章,转载请附上博文链接!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/112550.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • Python爬虫入门这一篇就够了「建议收藏」

    Python爬虫入门这一篇就够了「建议收藏」何谓爬虫所谓爬虫,就是按照一定的规则,自动的从网络中抓取信息的程序或者脚本。万维网就像一个巨大的蜘蛛网,我们的爬虫就是上面的一个蜘蛛,不断的去抓取我们需要的信息。爬虫三要素抓取分析存储基础

    2022年7月6日
    26
  • yolov5训练命令_yolo在coco上训练

    yolov5训练命令_yolo在coco上训练@本人环境声明:系统环境:Ubuntu18.04.1cuda版本:10.2.89cudnn版本:7.6.5torch版本:1.5.0torchvision版本:0.6.0项目代码yolov5,官网,项目开源的时间:20200601自定义数据集:#1安装环境依赖##1.1克隆项目gitclonehttps://github.com/ultralytics/yolov5#clonerepo如果下载比较慢,建议使用下面的镜像下载:gitclonehttps:

    2022年9月24日
    3
  • POJ1062 昂贵的聘礼 【DFS】[通俗易懂]

    POJ1062 昂贵的聘礼 【DFS】

    2022年1月27日
    42
  • 【Pycharm】Pycharm专业版 社区版 教育版区别「建议收藏」

    【Pycharm】Pycharm专业版 社区版 教育版区别「建议收藏」因为刚接触python,对pythonIDE不够了解,通过各方面的查找对比最终还是选择了pycharm,对于新手来说社区版的功能足够满足需求。还可以使用sublimetext编译器(好像是收费的)进行代码编译,还有很多我这边就不一一列举了。附上PyCharm官网链接pycharm下载这篇博客来记录介绍一下pycharm各个版本的区别pycharm是一专注于python的集成开发环境,…

    2022年8月25日
    8
  • MySQL与php时间戳与日期格式的相互转换[通俗易懂]

    MySQL与php时间戳与日期格式的相互转换[通俗易懂]文章来自:源码在线https://www.shengli.me/php/336.html  

    2022年6月21日
    31
  • 计算机组成原理期末复习【超实用】「建议收藏」

    计算机组成原理期末复习【超实用】「建议收藏」计算机组成原理(第二版)唐朔飞编著(课本有些地方还不错,可以下载电子版看看)五道解答题30‘=9’(9个知识点)+6’+6’+4’+5’我依据老师的考题范围手动整理,有什么问题or想添加的知识点请在评论下方留言!实时更新,助诸位共进步!一、解答题1.影响流水线性能的因素主要有哪几种?请简要加以说明。P348结构相关:是当多条指令进入流水线后,硬件资源满足不了指令…

    2022年5月31日
    33

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号