Analysis of jsonp examples of ajax cross-domain solutions under PHP-PHP Tutorial-php.cn

Analysis of jsonp examples of ajax cross-domain solutions under PHP

coldplay.xixi

Release： 2023-04-09 12:56:01

forward

2739 people have browsed it

Analysis of jsonp examples of ajax cross-domain solutions under PHP

The example of this article describes the jsonp solution for ajax cross-domain under PHP. Share it with everyone for your reference, the details are as follows:

First of all, let me explain the difference between json and jsonp?

Json is a text-based data exchange method, or a format for describing data.

Related learning recommendations: php programming (video)

var person = {
  "name": "test",
  "age": "25",
  "sex": "男"
};

var data = [1, 2, 3, 4, 5];

Copy after login

And jsonp is an unofficial cross-domain data interaction protocol that allows The user passes a callback parameter to the server, and then when the server returns data, it will use this callback parameter as a function name to wrap the json data, so that the client can customize its own function to automatically process the returned data.

For example, I referenced a b.js from b.com on the website of a.com, but such a cross-domain reference will not cause an error, which means that when calling the js file, it will not be affected by cross-domain.

<script type="text/javascript" src="http://www.b.com/b.js"></script>

Copy after login

Then we add the following code in b.js to see if it can be executed

alert("I from b");

Copy after login

Make sure it can be executed.

So if we create a js function on a.com and call it in b.js under b.com, is that feasible? The index.html under

a.com is as follows:




  
  



  
  <script type="text/javascript" src="http://www.b.com/b.js"></script>

Copy after login

The b.js under b.com is as follows:

a("from b");

Copy after login

The above can also be executed, we can see The data in b.js is indeed passed to function a correctly.

The problem comes again. The function name created in a.com must be consistent with the function name called in b.js. So how can we let the b.com server know this function name? It can only be done through the address bar. Passed, add a callback=function name to pass. Of course, the name callback can be changed, but since everyone names it this way, it is a convention. The index.html under

a.com is as follows:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title></title>
</head>
<body>
  <script type="text/javascript">
    function a(data) {
      alert("uid :" + data.uid + "name :" + data.name);
    }
  </script>

  <!-- 注意这里把b.js改成b.php了 -->
  <script type="text/javascript" src="http://www.b.com/b.php?callback=a"></script>
</body>
</html>

Copy after login

The b.php under b.com is as follows:

<?php
$callback = !empty($_GET[&#39;callback&#39;]) ? trim($_GET[&#39;callback&#39;]) : &#39;&#39;;

if(!empty($callback)) {
  $data = json_encode(array(
    &#39;uid&#39; => 1,
    &#39;name&#39; => &#39;测试&#39;,
  ));

  echo "{$callback}({$data});";
}

Copy after login

The above can also be executed, knowing the callback function name, the b.com server processes the data and then outputs it through string concatenation.

jquery already provides support for jsonp. The index.html under a.com is as follows:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title></title>
</head>
<body>
  <p class="info"></p>
  <script type="text/javascript" src="http://www.b.com/jquery.js"></script>
  <script type="text/javascript">
  $.ajax({
    dataType: "jsonp",
    url: "http://www.b.com/b.php",
    jsonp: "callback",
    success: function(data) {
      $(".info").text("uid:" + data.uid + " name:" + data.name);
    }
  });
  </script>
</body>
</html>

Copy after login

The cross-domain policy restriction table is as follows:

##http:// www.a.com:8000/a.jsSame domain name, different portsNot allowedhttp://www. a.com/a.jsSame domain name, different protocolsNot allowedhttp://www. a.com/a.js##http:// www.a.com/a.jsSame domain name, different second-level domain names (same as above)Not allowed##http:/ /www.a.com/a.js http://www.b.com/b.js

URL	Description	Allow communication
http:// www.a.com/a.js http://www.a.com/b.js	Under the same domain name	allowed
http://www.a.com /lab/a.js http://www.a.com/script/b.js	Different folders under the same domain name	Allow
http://www.a.com/b.js
https://www.a.com/b.js
http://127.0.0.100/b.js	The domain name and the corresponding ip of the domain name	are not allowed
http://www.a. com/a.js http://script.a.com/b.js	The main domain is the same, the subdomain is different	Not allowed
http://a.com/b.js
Different domain names	Not allowed

The above is the detailed content of Analysis of jsonp examples of ajax cross-domain solutions under PHP. For more information, please follow other related articles on the PHP Chinese website!