jsonp jquery 实现 跨域 服务端 php

最新推荐文章于 2023-07-31 08:10:00 发布
最新推荐文章于 2023-07-31 08:10:00 发布
阅读量1.5w 收藏 1
点赞数
分类专栏： javascript 文章标签： jsonp 跨域 php jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zyddj123/article/details/82704339
版权

注： jsonp只支持get方式

html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title></title>
    <link rel="stylesheet" href="">
</head>
<body>
    <script src="./jquery-3.3.1.min.js"></script>
    <script>
        (function(){
            $.ajax({
                url: "http://192.168.1.111/jsonp.php",
                type: "get",
                dataType : "jsonp",
                data: "",
                success: function (data) {
                    console.log(data);
                },
                error: function () {
                    console.log("error");
                }
            });
        })();
    </script>
</body>
</html>

php

<?php 
$jsonp = $_GET['callback'];//get接收jsonp自动生成的函数名
$arr = array(
    'id' => 'asdf',
    'name' => 'eric'
);
echo $jsonp.'('. json_encode($arr). ')'; //jsonp函数名包裹json数据
?>

效果如下：

这里写图片描述

这里写图片描述

这里写图片描述

清晨一场梦
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
使用jquery的jsonp如何发起跨域请求及其原理详解
12-10
本文主要给大家介绍的是关于jquery jsonp发起跨域请求及其原理的相关内容，分享出来供大家参考学习，下面话不多说了，来一起看看详细的介绍： 跨域的安全限制都是对浏览器端来说的，服务器端是不存在跨域安全限制的...
jQuery jsonp跨域请求
考拉很OK
09-17 1283
首先我们需要明白，在页面上直接发起一个跨域的ajax请求是不可以的，但是，在页面上引入不同域上的js脚本却是可以的，就像你可以在自己的页面上使用<img src=""> 标签来随意显示某个域上的图片一样。jsonp的实现方式其实就是<script>脚本请求地址的方式一样，只是ajax的jsonp对其做了封装，所以可想而知，jsonp是不支持POST方式的。至此，我们算是跨域把数据请求回来了，但是比较麻烦，需要自己写脚本发起请求，然后写个回调函数处理数据，不是很方便。2、接下来看如何发起跨域请求。
解决jQuery跨域问题（jsonp方法）
weixin_51581806的博客
04-12 1064
之前学vue时没有出现过这个问题，最近学jQuery的时候经常调用不成功，用了网上很多的办法最后采用用jsonp的格式接收数据就成功了。所以接口传递参数也要变成String。
jquery中的JSONP
m0_62962469的博客
04-21 5377
jquery中的$.ajax()函数，除了可以发起真正的Ajax数据请求之外，还可以发起JSONP数据请求，例如： $.ajax({ url: 'http://www.liulongbin.top:3006/api/jsonp?name=zs&age=20', dataType: 'jsonp', success: function (res) { console.log(res);
jQuery+JSONP跨域请求的解决方案
qq30211478的博客
05-15 809
一、什么是JSONP？ 　JSONP(JSON with Padding)是JSON的一种“使用模式”，可用于解决主流浏览器的跨域数据访问的问题。由于同源策略，一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通，而 HTML 的<script> 元素是一个例外。利用 <script> 元素的这个开放策...
jquery中的ajax方法怎样通过JSONP进行远程调用
04-12 1733
可以在传递过程中自定义函数名，只要使用jsonpCallback参数就可以了。jsonp：表示传递的参数，默认为callback，我们也可以自定义，服务器段通过此参数，获取自定义的函数名称，服务器这样获取 Request.QueryString["callback"]jsonpCallback：表示传递的参数值，也就是回调的函数名称，这是自定义的名称。$.ajax({
ASP.NET配合jQuery解决跨域调用的问题
01-21
使用JSONp方式调用 不做详细讲解，可以参考jq文档《jQuery 1.10.3 在线手册》 二. 服务端配置 修改Web.config 文件 <modules runAllManagedModulesForAllRequests=true></modules> */> <add name=...
jquery中ajax处理跨域的三大方式
11-22
因此要实现跨域，一般有以下几个方法： 一、处理跨域的方式： 1.代理 2.XHR2 HTML5中提供的XMLHTTPREQUEST Level2（及XHR2）已经实现了跨域访问。但ie10以下不支持 只需要在服务端填上响应头： header("Access-...
JSONP解决跨域问题
10-16
前端使用jquery，datatype采用jsonp，服务端采用C#编写的webService
解决jQuery使用JSONP时产生的错误
11-26
为了安全性，浏览器对这种情况有着严格的限制，需要在客户端和服务端同时做一些设置才能实现跨域请求。 JSONP简介 JSONP（JSON with Padding）是一种常用的跨域手段，但只支持JS脚本和JSON格式的数据。顾名思义，...
Ajax解决跨域--jQuery发送jsonp请求
天行健 君子以自强不息，地势坤 君子以厚德载物。
07-27 642
1. jQuery发送jsonp请求 需求 在"点击发送 jsonp 请求"后，将服务器返回的响应体渲染到窗口中。 ajaxDemo.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <t
手动实现JSONP
朱远辉的博客
05-18 234
手动实现JSONP：在上述代码中，前端代码定义了一个名为handleData的回调函数，用于接收服务端返回的数据。使用JSONP技术时，前端代码会生成一个动态的script标签，并在链接中附带需要获取的数据及回调函数名称等参数，然后将该script标签插入到页面中，以触发跨域请求并获取数据。在前端代码中定义一个动态的script标签，设置其src属性为服务端接口的URL地址，并在链接中添加callback参数，值为第一步定义的回调函数名称。在前端代码中定义一个回调函数，用于接收服务端返回的数据。
使用jQuery发送jsonp实现跨域
小白的博客
07-24 221
首先我们要知道什么叫做跨域？在了解跨域之前我们要明白一个东西，那就是同源策略。 同源策略： 同源：协议，域名，端口号必须完全相同，AJAX默认的就是符合这个策略，不符合的其实就叫做跨域。 那么怎么样去处理跨域呢？通过一个案例我们来看 前台代码： <script> $('button').click(function() { $.getJSON('http://127.0.0.1:8000/jquery-jsonp?callback=?', fu
【Ajax】笔记-JQuery发送jsonp请求
德仔
07-31 616
height;border;functiondata'#result'html名称:${dataname校区:${datacity;;
【Ajax】(二）JQuery发送Ajax请求、Axios发送Ajax请求、fetch发送Ajax请求、跨域、jsonp、CORS
matmacchiato的博客
01-14 329
在CORS中你要发请求，你就按照ajax那一套去做就行了，至于跨域的问题，就交给服务端设置响应头就可以实现跨域。这个请求方法厉害之处在于他不用像jquery和axios那样需要引入第三方库，而是可以直接使用。声明handle函数，创建script标签，利用src属性请求数据。做一个案例，点击按钮，向8000端口发出请求，返回结果在div呈现。// 向服务器端发送请求，检测用户名是否存在。// 修改 p 标签的提示文本。//1. 创建script标签。//2. 设置标签的src属性。
Jquery ajax jsonp跨域调用实例代码
04-13 671
简单的来说，出于安全方面的考虑，页面中的JavaScript无法访问其他服务器上的数据，即“同源策略”。而跨域就是通过某些手段来绕过同源策略限制，实现不同服务器之间通信的效果。URL说明允许通信同一域名下允许同一域名下不同文件夹允许同一域名，不同端口不允许同一域名，不同协议不允许域名和域名对应ip不允许主域相同，子域不同不允许同一域名，不同二级域名（同上）不允许不同域名不允许。
jsonp的原理与实现
web前端开发
03-30 905
来源 |https://segmentfault.com/a/1190000007665361#articleHeader11、概述jsonp是一种跨...
jquery使用jsonp进行跨域调用
eeeeety6208的博客
11-10 673
jsonp:表示传递的参数，默认为callback，我们也可以自定义，服务器段通过此参数，获取自定义的函数名称，服务器这样获取 Request.QueryString["callback"]jsonpCallback：自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名，也可以写"?jsonp：传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(一般默认为:callback)jsonpCallback表示传递的参数值，也就是回调的函数名称，这是自定义的名称。
jquery ajax 跨域
最新发布
08-15
JSONP（JSON with Padding）是通过在请求中添加一个回调函数的方式来实现跨域请求的。回调函数会将服务端返回的数据包裹在函数中，从而解决了跨域问题。通过设置dataType为"jsonp"，可以告诉jQuery使用JSONP来发送...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值