Home Web Front-end JS Tutorial Cross-domain data transmission (JSONP) based on Jquery_jquery

Cross-domain data transmission (JSONP) based on Jquery_jquery

May 16, 2016 pm 06:09 PM
jsonp Cross domain

Backend:

Copy code The code is as follows:

$json_str = json_encode(array("ddd"=>"11111111"));
echo $_GET['ja'].'('.$json_str.')';
?>

Front-end:
Copy code The code is as follows:

$.getJSON(' http://www.liushan.cn/test.php?ja=?',function (json){
alert(json);
});

Pure JS implementation (JSONP):
Copy code The code is as follows:

//server return aa({' ddd':'ddd'}) callback function name: $_GET['callback']
//author:lonely
(function(w){
function getjson(){}
getjson. prototype.set=function(url,callback,callbackname){
this.callfn=callbackname||'urlcallback';
this.url=url "?callback=" this.callfn;
try{
eval(this.callfn "=function(data){n"
"callback(data);n"
'delete ' this.callfn ';}');
}catch(e) {return;}
this.request();
delete this.url;
}
getjson.prototype.request=function(){
var script=document.createElement("script ");
script.src=this.url;
var load=false;
script.onload = script.onreadystatechange = function() {
if(this.readyState === "loaded " || this.readyState === "complete"){
load=true;
script.onload = script.onreadystatechange=null;
}
};
var head=document .getElementsByTagName("head")[0];
head.insertBefore(script,head.firstChild);
}
w.getjson=getjson;
})(window)
/ /Use DOME
new getjson().set("http://www.test.cn/test.php",function(data){
alert(data.ddd);
});

Another: getScript
Copy code The code is as follows:

jQuery.getScript("http://dev.jquery.com/view/trunk/plugins/color/jquery.color.js", function(){
$("#go").click(function( ){
$(".block").animate( { backgroundColor: 'pink' }, 1000)
.animate( { backgroundColor: 'blue' }, 1000);
});
});//CHM help file example
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Best Graphic Settings
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. How to Fix Audio if You Can't Hear Anyone
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: How To Unlock Everything In MyRise
4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Solution to PHP Session cross-domain problem Solution to PHP Session cross-domain problem Oct 12, 2023 pm 03:00 PM

Solution to the cross-domain problem of PHPSession In the development of front-end and back-end separation, cross-domain requests have become the norm. When dealing with cross-domain issues, we usually involve the use and management of sessions. However, due to browser origin policy restrictions, sessions cannot be shared by default across domains. In order to solve this problem, we need to use some techniques and methods to achieve cross-domain sharing of sessions. 1. The most common use of cookies to share sessions across domains

How to make cross-domain requests in Vue? How to make cross-domain requests in Vue? Jun 10, 2023 pm 10:30 PM

Vue is a popular JavaScript framework for building modern web applications. When developing applications using Vue, you often need to interact with different APIs, which are often located on different servers. Due to cross-domain security policy restrictions, when a Vue application is running on one domain name, it cannot communicate directly with the API on another domain name. This article will introduce several methods for making cross-domain requests in Vue. 1. Use a proxy A common cross-domain solution is to use a proxy

How to use Flask-CORS to achieve cross-domain resource sharing How to use Flask-CORS to achieve cross-domain resource sharing Aug 02, 2023 pm 02:03 PM

How to use Flask-CORS to achieve cross-domain resource sharing Introduction: In network application development, cross-domain resource sharing (CrossOriginResourceSharing, referred to as CORS) is a mechanism that allows the server to share resources with specified sources or domain names. Using CORS, we can flexibly control data transmission between different domains and achieve safe and reliable cross-domain access. In this article, we will introduce how to use the Flask-CORS extension library to implement CORS functionality.

How to use JSONP to implement cross-domain requests in Vue How to use JSONP to implement cross-domain requests in Vue Oct 15, 2023 pm 03:52 PM

Introduction to how to use JSONP to implement cross-domain requests in Vue. Due to the restrictions of the same-origin policy, the front-end will be hindered to a certain extent when making cross-domain requests. JSONP (JSONwithPadding) is a cross-domain request method. It uses the characteristics of the <script> tag to implement cross-domain requests by dynamically creating the <script> tag, and passes the response data back as a parameter of the callback function. This article will introduce in detail how to use JSONP in Vue

How to allow cross-domain use of images and canvas in HTML? How to allow cross-domain use of images and canvas in HTML? Aug 30, 2023 pm 04:25 PM

To allow images and canvases to be used across domains, the server must include the appropriate CORS (Cross-Origin Resource Sharing) headers in its HTTP response. These headers can be set to allow specific sources or methods, or to allow any source to access the resource. HTMLCanvasAnHTML5CanvasisarectangularareaonawebpagethatiscontrolledbyJavaScriptcode.Anythingcanbedrawnonthecanvas,includingimages,shapes,text,andanimations.Thecanvasisagre

Cross-domain problems encountered in Vue technology development and their solutions Cross-domain problems encountered in Vue technology development and their solutions Oct 08, 2023 pm 09:36 PM

Cross-domain problems and solutions encountered in the development of Vue technology Summary: This article will introduce the cross-domain problems and solutions that may be encountered during the development of Vue technology. We'll start with what causes cross-origin, then cover a few common solutions and provide specific code examples. 1. Causes of cross-domain problems In web development, due to the browser's security policy, the browser will restrict requests from one source (domain, protocol or port) for resources from another source. This is the so-called "same origin policy". When we are developing Vue technology, the front-end and

Use CORS in Beego framework to solve cross-domain problems Use CORS in Beego framework to solve cross-domain problems Jun 04, 2023 pm 07:40 PM

With the development of web applications and the globalization of the Internet, more and more applications need to make cross-domain requests. Cross-domain requests are a common problem for front-end developers, and it can cause applications to not work properly. In this case, one of the best ways to solve the problem of cross-origin requests is to use CORS. In this article, we will focus on how to use CORS in the Beego framework to solve cross-domain problems. What is a cross-domain request? In web applications, cross-domain requests refer to requests from a web page of one domain name to another

Analyze PHP Session cross-domain error log processing Analyze PHP Session cross-domain error log processing Oct 12, 2023 pm 01:42 PM

PHPSession cross-domain error log processing When developing web applications, we often use PHP's Session function to track the user's status. However, in some cases, cross-domain errors may occur, resulting in the inability to access and operate Session data correctly. This article will introduce how to handle PHPSession cross-domain errors and provide specific code examples. What is PHPSession cross-domain error? Cross-domain error refers to the error in the browser

See all articles