vue跨域问题的三种解决方案_前端解决ajax跨域问题的方式

vue跨域问题的三种解决方案_前端解决ajax跨域问题的方式axios跨越问题解决的三种方法

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

axios:读音「艾科C藕丝」

方法一:SpringBoot后端进行处理

在 每个 Controller 类上加入 @CrossOrigin 注解
或者在 Controller的基类中加上 @CrossOrigin 注解然后其他 Controller 类就有了这个 @Controller 此时跨域访问就不会报错了。

浏览器 在同一个页面访问不同的域 是存在跨域问题的
但 服务器之间的访问是 没有跨域问题 因为服务器之间的请求不走XHR(XMLHttpRequest)

方法二: 需要在前端设置代理, 通过代理访问 SpringBoot后端API

1.在 src / utils / request.js 中配置
baseUrl: ‘http://127.0.0.1:8020/myhd’
2.在 vue.config.js 中配置Proxy

'': {
 	 target:  'http://127.0.0.1:8020/myhd'
	},
'/apiout': { // 外网
  target: 'https://myhd-outer-ui.cloud.castc.cn',
  changOrigin: true, // 允许跨域
  pathRewrite: {
    '^/apiout': ''
  }
},

配置代理方式只能解决npm run dev开发时的跨域问题,运行npm run build将项目打包到dist目录后只能通过nginx代理来解决跨域问题

方法三: 使用jsonp解决跨域(只能解决get方式跨域问题,不推荐)

方法:在ajax请求中加入配置项 dataType : 'jsonp',
原理仅作了解:请求的网址自动变成http://www.tpadmin.com/proj/method?callback=jQuery331015214102388989237
这是为什么呢?原来由于跨域访问的只限制xhr类型的请求,所以js中就利用了这一特点,让服务端不在返回的是一个JSON格式的数据,而是返回一段JS代码,将JSON的数据以参数的形式传递到这个函数中,
而函数的名称就是callback参数的值,所以我们还需要修改服务端的代码,修改参数解析方法。

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

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/188199.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • Bluez java_Bluez相关的各种tools的使用

    Bluez java_Bluez相关的各种tools的使用7.1BccmdBccmd是用来和CSR的芯片进行BCCMD(Bluecorecommandprotocol)通讯的一个工具。BCCMD并非蓝牙协议栈的标准,而是CSR芯片的专属协议Bccmd的调用格式为:bccmd[-t][-d][]Tansport类型包括HCIUSBBCSPH4等,常用的估计就是HCI和BCSP两种。需要注意一下他们的使用场合:HCI是…

  • js中有几种数据类型_数据类型定义

    js中有几种数据类型_数据类型定义js数据类型有几种?它们之间的区别是什么两种基本数据类型和引用数据类型区别:1)基本类型在栈内存,引用类型在堆内存分配地址; 2)不同的内存分配机制也带来了不同的访问机制; 3)赋值变量时的不同; 4)参数传递的不同(把实参赋值给形参的过程);…

  • landsat8与sentinel2波段对比

    landsat8与sentinel2波段对比landsat8与sentinel2波段对比Landsat8波段对比哨兵2号,通常Landsat8OLI使用7、5、2或7、5、3,哨兵2号相对应的为12、8、2。Landsat7ETM+通常采用7、4、1。新的改变我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写博客:全新的界面设计,将会带来全新…

  • cookie的domain属性

    cookie的domain属性欢迎大家光临我的个人博客,详戳https://545longgege.top/最近在改一个bug单时,有个问题涉及到了cookie的domain属性,大致场景是由于不同的服务页面出现了同名的cookie但是domain域不同,导致出现了不可思议的bug。于是查询与cookie的domain属性相关的资料并记录之。1、什么是Cookie?Cookie是由W3C组织提出,最…

  • 深入理解学习Git工作流(git-workflow-tutorial)

    深入理解学习Git工作流(git-workflow-tutorial)

  • Android audio_audiomack安卓版下载

    Android audio_audiomack安卓版下载音频基础知识声音有哪些重要属性呢?响度(Loudness)响度就是人类可以感知到的各种声音的大小,也就是音量。响度与声波的振幅有直接关系。音调(Pitch)音调与声音的频率有关系,当声音的频率越大时,人耳所感知到的音调就越高,否则就越低。音色(Quality)同一种乐器,使用不同的材质来制作,所表现出来的音色效果是不一样的,这是由物体本身的结构特性所决定的。

发表回复

您的电子邮箱地址不会被公开。

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