http请求跨域问题

最新推荐文章于 2023-12-19 10:57:38 发布
最新推荐文章于 2023-12-19 10:57:38 发布
阅读量368 收藏
点赞数 2
分类专栏： vue 面试 文章标签： http javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_59680972/article/details/129366210
版权
文章介绍了浏览器的同源策略导致的HTTP跨域问题，并提出了解决方案，包括使用JSONP进行简单GET请求，通过CORS在后端设置允许跨域，以及前端开发中常用的代理方法，如webpack和vite的代理配置，以及nginx服务器的接口代理转发。
摘要由CSDN通过智能技术生成

http请求跨域问题

1. 跨域的产生

由于浏览器的http协议的安全机制同源策略，只要不符合同源策略，就会出现“跨域”

同源策略

  • 同协议
  • 同域名
  • 同端口
  • 只要不满足其中任意一个要求，就不符合同源策略，就会出现“跨域”

2. 解决跨域的方法

  1. jsonp

jsonp能实现跨域是利用了img、script和link标签自身的跨域能力。
我们知道当img或者script中的src是一个链接的时候，浏览器会请求这个链接获取资源，那么这个  链接如果是跨域的，浏览器也会请求，从而达到了跨域请求的一个功能。

优点：简单粗暴

缺点：① 只支持get请求

           ② 需要后台配合，将返回结果包装成callback(res)的形式

   2. CORS跨域 （前端不用动，后端设置Access-Control-Allow-Origin等）

  • 服务端进行接口请求设置，前端直接调用
  • 说明：后台设置前端某个站点进行访问

     3. 代理 （proxy）前端开发常用

       接口代理

  • 通过修改nginx服务器配置实现代理转发
  • 前端修改，后端不用

       前端构建工具代理

       webpack 配置代理

       vite 配置代理

入门中……
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
前端常见跨域解决方案（转+扩展）
Myinlg的博客
06-16 915
前端常见跨域解决方案（扩展）原文地址：http://www.cnblogs.com/roam/p/7520433.html什么是跨域？跨域是指一个域下的文档或脚本试图去请求另一个域下的资源，这里跨域是广义的。广义的跨域：1.) 资源跳转： A链接、重定向、表单提交 2.) 资源嵌入： <link>、<script>、<img>、<frame>等dom...
Ajax请求跨域问题解决方案分析
10-17
Ajax请求跨域问题一直是Web开发中的常见挑战，由于浏览器的安全机制——同源策略，使得不同源的脚本无法互相操作。本文将深入探讨Ajax请求跨域的原理，并提供两种有效的解决方案。 首先，理解同源策略至关重要。...
HTTP请求跨域问题
qq_42765662的博客
07-28 1328
前端开发中经常出现跨域问题，了解跨域的原理及其解决方法
跨域发生阶段
yuey0809的博客
11-24 789
一个跨域请求 请求会被正常发出 服务端可以正常接收,正常处理,正常返回 浏览器也能接收服务端返回的数据 接收之后发现当前域与所请求的域不同,所以判定为跨域 浏览器判定为跨域,不会将代码返回给我们 ...
HTTP请求与跨域
David_bdqn的博客
11-11 4898
浏览器发出一个请求到收到响应经历了哪些步骤 1、浏览器解析用户输入的URL，生成一个HTTP格式的请求； 2、先根据URL域名从本地hosts文件查找是否有映射IP，如果没有就将域名发送给电脑配置的DNS进行域名解析，得到IP地址； 3、浏览器通过操作系统将请求通过四层网络协议发送出去； 4、途中可能会经过各种路由器、交换机，最终到达服务器； 5、服务器接收到请求后，根据请求所指定的端口，将请求传递给绑定了该端口的应用程序，如tomcat; 6、tomcat接收请求数据后，按照http协议的格式
http -- 跨域问题详解（浏览器）
最新发布
qq_37233070的博客
12-19 1588
域域既是 Windows 网络操作系统的逻辑组织单元，也是Internet 的逻辑组织单元，它是安全边界。只有域的所有者才能访问管理域内部的资源，若其他的域要访问或者管理，则需要该域赋予其他域相关权限。从小角度来讲，在php中的变量作用域，就可以体现出安全边界的概念。在以下例子中，调用test函数并不会输出任何内容。echo $a;test();因为函数内调用的是局部作用域的变量，而在局部作用域内并没有声明 $a 变量。除非我们使用global $a;从全局作用域引用该变量。
java 请求跨域问题解决方法实例详解
08-30
Java中的请求跨域问题是指当一个网页尝试通过Ajax或者其它HTTP请求方式访问另一个不同源（协议、域名或端口）的资源时，由于浏览器的安全策略限制，这种行为通常会被阻止，这种现象称为“跨域”。为了解决这个问题，...
django解决跨域请求的问题
09-19
在某些情况下，如果不想通过配置来解决跨域问题，还可以使用JSONP（JSON with Padding）或者CORS的预检请求机制。 JSONP是一种古老的解决方案，它利用了script标签的特性——不受同源策略限制。前端JavaScript代码...
详解AngularJS如何实现跨域请求
11-25
方法发起HTTP请求： ```javascript $http.post(url, data, config).success(function(response) { // 成功回调处理 }); $http.get(url, config).success(function(response) { // 成功回调处理 }); ``` 在上述...
django基于cors解决跨域请求问题详解
09-18
CORS（Cross-Origin Resource Sharing）即跨域资源共享，是W3C提出的一个解决跨源HTTP请求的方案。CORS需要浏览器和服务器两端的支持。在支持CORS的浏览器中，发起请求时会自动加入额外的HTTP头，如Origin头，以标识...
get方式发送请求出现跨域问题
weixin_51485547的博客
07-21 1264
但同伴说他已经在后端对跨域问题进行处理了。这里可以考虑是我传参方式不对，或是后端接收参数方式不对。我把get请求改为了post请求，便没有出现问题了......我也查找了一些资料关于get请求传参的，可以直接在url上直接跟参数，也可以用params{}传。
https跨域请求http数据
热门推荐
我是纯豆腐的博客
06-28 2万+
A站:https://www.aaa.comB站:http://www.bbb.com直接用ajax跨域请求返回数据因为不是https协议网站 ( B站没有https证书 ) 返回的数据或资源所以会被A站拦截阻挡，自己想到解决办法写一个API做中转数据，在A站内些一个接口，A站利用ajax去请求接口，再有接口模拟请求B站获取数据到API接口，然后再返回到A站ajax直接上代码A站ajax请求 $....
什么是跨域？什么情况下会发生跨域请求？
学而不思则忘
11-29 6676
跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器施加的安全限制。 同源策略：所谓同源是指：协议，域名，端口均相同。即便两个不同的域名指向同一个ip地址，也非同源。 http://www.123.com/index.html 调用 http://www.123.com/server.php （非跨域） http://www.123.com/index.html 调用 http://www.456.com/server.php （主域名不同:123/456，跨域） http:/
HttpListener 跨域访问
caikeyter
10-26 2602
项目需要，要写个本地服务，给VUE 前端 提供api。 联调发现，必须要支持跨域访问才行，调了好久，终于能正常访问了，特意记录一下。 HttpListenerRequest request = context.Request; context.Response.Headers.Add("Content-type", "text/html;charset=UTF-8"); context.Response.ContentEncoding = Encod
跨域的发生时机？
dongwei666的博客
09-23 319
跨域的发生时机你知道吗？？？
前端经常遇到的跨域问题几种解决方案
前端岚枫
07-01 5512
跨域（非同源策略请求） 同源策略请求 ajax/fetch 跨域传输 部署到同一个web服务器上：同源策略 xampp 修改本地的host文件 127.0.0.1:1234 http://api.qq.com http: //127.0.0.1:1234/index.html http://api.qq/.com/getData 服务器拆分 web服务器 ：静态资源 data服务器 ：业务逻辑和数据分析 图片服务器： 三者都一样就是同源，只要有一个不同就是跨域 协议 域名 端口号 web服务器地址：h
Java后端服务跨域问题总结
qq_38196524的博客
12-09 1336
一、导致跨域问题的原因 1.前后端服务调用的域名不一样是导致跨域问题最常见的原因。 例如：前端域名test.manager.cn调用后端域名testapi.manager.cn或者本地localhost调用后端域名testapi.manager.cn都会出现跨域的问题。 2.请求传参时，传参错误，也是跨域问题最常见的原因。 3.http请求错写成https请求，也会导致跨域问题，但是不常见。 遇见跨域问题不要慌，首先要冷静的分析导致跨域问题的原因，然后来找出解决办法。 二、解决办法 解决办法一：（此方法治标
http如何实现跨域访问
傲然君
12-21 1万+
当两个域具有相同的协议(如http), 相同的端口(如80)，相同的host（如www.google.com)，则认为它们是相同的域（协议，域名，端口都必须相同）。出于安全考虑，浏览器允许跨域写（即：上行，发送请求），而不允许跨域读（即：下行，接受响应）。跨域访问失败时，实际上浏览器发送请求成功，浏览器也接收到了响应，但是它会限制xmlhttprequest接受响应并在js控制台报错。解决方法：通过
https引起的跨域问题-COE&casestudy
xiexiaojing的博客
12-08 1万+
问题很简单，开发一个后台服务。这个服务呢，包含了几个团队的后台服务之间的相互调用。这些后台服务之间的顶级域名(相关概念后面会解释)相同，请求却报错说有跨域问题。经调查，原因是调用方是htt...
axios请求跨域问题
07-31
另外，axios具有实现异步通信的功能特点，包括从浏览器中创建XMLHttpRequest，从Node.js创建HTTP请求，支持Promise API，拦截请求和响应，转换请求数据和响应数据，取消请求，自动转换JSON数据，以及客户端支持防御...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值