首页 > 编程知识 正文

如何实现跨域请求,为什么要跨域请求

时间:2023-05-05 02:32:58 阅读:170645 作者:4806

文章目录同构策略实现跨域请求的方法1:jsonp跨域script标记jsonp请求数据jsonp优缺点方法cors跨域js文件text.php文件方法proxy跨域理解正向代理理解反向操作

同源策略同源策略是由浏览器给的行为浏览器不允许我们向他人发送请求。 只能向自己的服务器发送请求。 当我们向他人的服务器发送请求时,qxdxhd向浏览器发送请求时,涉及到你打开当前页面的两个地址。 例如,localhost/index.html,在你要求的地址例如localhost/a.php的两个地址中,如果端口号 域名 传输协议某一个不同,非同源要求就不能共享浏览器我们有时将同源策略的请求称为跨域请求来实现跨域请求。 如果需要实现跨域请求,则需要多个服务器在一个页面上提供数据。 在这种情况下,jsonp跨域将利用script标记的src属性向非同源服务器请求数据。 如果它返回字符串script标签,则执行该字符串的脚本标签script标签src属性本质上是请求外部资源,在不受同源策略影响的同时,脚本标签src属性也是请求。 服务器也可以接收script标签的src属性请求回来的东西是一个字符串,浏览器会把这个字符串当作js代码来执行可以使用此script标记的src属性在域之间发出jsonp请求。 数据请求服务器请求返回函数名称()。 需要事先准备这样的字符串。 发送请求时,前端将作为参数传达给后端。 准备的函数名是什么? jsonp是get请求,不能发送post请求-- html中的js代码----scriptfunctionfn(data ) {console.log ) (这是处理天气预报数据的函数) ) 向//data传递了后端调用函数的实参console.log(data ); }/scriptscriptsrc=' http://127.0.0.1/report.PHP? callback=fn'/script? 从php//前端的callback属性中选择函数名称$cbName=_GET['callback']; //接下来是函数调用。 想返回到前端的数据是参考。 //此调用的函数是前端预定义的echo '$cbName (“这是天气预报数据”) ) ) ) ) ) ) ) ) )。

jsonp的优缺点:绕过同源策略,实现跨域要求,易用性缺点:安全措施不灵。 逐渐被替换的方法cors域之间的域之间是避免浏览器依赖他人家的服务器。 如果别人家的服务器告诉浏览器,如果许可这个域名并委托浏览器就无法管理,无法进行js文件的script//1.Ajax对象的制作、varxhr=//2.构成要求信息XHR.open () a=1b=2'; //3 .接收响应xhr.onload=function () console.log (xhr.responsetext ); (//4.请求xhr.send ); /script text.php文件? 在php//请求标头中说明,请告诉我浏览器允许//哪些域名的请求。 *符号表示所有标题(' access-control-allow-origin 3360 * ' )。//头(access-control-request-methods : get,POST,PUT,DELETE,OPTIONS ) )允许的请求方法; //哪个请求头header (access-control-allow-headers : x-requested-with,content-type,test-token,test-sest ) ? 方法3 )代理分为域间代理。 前向代理和反向代理知道有前向代理。 前向代理需要一个客户端向非同源服务器b发送请求。 构筑与客户机相同的服务器a,当客户机发送请求时,服务器a接受并向服务器b发送请求。同源策略是由浏览器给的如果在服务器之间没有接收到请求的服务器b,则可以处理请求,向服务器a返回响应,然后服务器a向客户端发送响应。 可以用这种方式进行域间请求

了解反向代理的反向代理一般用于负载平衡。 我请求服务器时,实际请求的是在服务器端设置的代理服务器。 代理服务器将一些大量请求分发给不同的服务器进行处理,然后服务器向代理服务器返回响应。

正向代理解决域间的只要是服务器即可

能设置代理

apache 服务器代理 HTTP 协议的不需要花钱HTTPS 协议的需要花钱 nginx 服务器代理 http 和 https 都是免费的所以我们使用nginx服务器

phpstudy进行nginx服务器代理配置步骤:

1 打开phpstudy窗口 ==> 点击切换版本 ==> 点击php5.4.xxx+nginx2 打开phpstudy窗口 ==> 点击其他选项菜单 ==> 点击打开配置文件 ==> 点击nginx-conf(config) ==> 大概在56行左右有一个server ==> 顺着开始括号找到server的闭合大括号(大概在102行) ==> 在这个闭合大扩号的上面一行书写代理配置 ==> 代理配置 ==> 我写了空格的地方你们也要写 ==> /cyr是你们自己定的,写什么都可以 ==> 斜线是必须要有的 ==> {}里面的那个地址,就是你要跨域请求的地址(目标服务器的地址) ==> 最后的分号必须有 location = /cyr { proxy_pass http://127.0.0.1/text.php; } ==> 修改完毕以后,一定要重启服务器 ==> qxdxhd在nginx服务器上发送请求 --> 只要请求你自己的代理标识符 --> 那么就会由nginx服务器来帮你转发请求给proxy_pass地址注意: + 当切换到nginx服务器以后 + 不管是html文件还是php文件,都不能用中文,否则报错 js 文件代码 <script>// 1 创建ajax对象var xhr = new XMLHttpRequest();// 2 配置请求信息xhr.open('GET','http://localhost/cyr?aa=100&cc=345');// 3 接收响应xhr.onload = function(){console.log(xhr.responseText);}// 4 发送请求xhr.send();</script> text.php 文件代码 <?php// 前后端交互的数据格式是:json字符串echo json_encode($_REQUEST);?>

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。