分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > IT知识

js跨越请求的2中实现 ?JSONP /后端接口设置运行跨越header

发布时间:2023-09-06 01:50责任编辑:苏小强关键词:js后端JSONP

由于浏览器同源策略,a域名的js向b域名ajax请求会被禁止。JS实现跨越访问接口有2中办法。

1.后端接口设置允许跨越的header头。

//header(‘Access-Control-Allow-Origin:*‘); ?//支持全域名访问,不安全,部署后需要固定限制为客户端网址header(‘Access-Control-Allow-Origin:http://www.example-a.com‘); ??//设置的是带协议的url,而不是一个域名。可以设置多个url,用逗号分隔echo json_encode([‘name‘=>‘lucy‘]);}

  

  

  客户端正常ajax请求即可。

2.客户端通过jsonp请求,服务器不用设置跨越header。关于jsonp原理这里不再说,可以另外查找资料。下面给出个实现的具体方法。

客户端请求,以jquery实现为例子

<script type="text/javascript"> ???$(document).ready(function(){ ???????$.ajax({ ???????????type : "get", ???????????async: false, ???????????url : "http://www.example-a.com/api.php?id=1", ???????????dataType: "jsonp", ???????????jsonp:"callback", //请求php的参数名 ???????????//jsonpCallback: "jsonhandle",//要执行的回调函数,(jquery中,这个参数可以省略,jquery会随机生成一个名字) ???????????success : function(data) { ???????????????console.log(data); ???????????} ???????}); ???});</script>

   

api.php

<?php ????//完成业务逻辑 获得数据 ????echo $_GET[‘callback‘]. ‘(‘. json_encode($data). ‘)‘; ?//$_GET[‘callback‘],就是上面jquery中jsonp请求的 ‘jsonp’参数
?>

js跨越请求的2中实现 ?JSONP /后端接口设置运行跨越header

原文地址:https://www.cnblogs.com/guohong-hu/p/8882349.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved