Of Stack

Analysis of Implementation Method of ajax Interface in Thinkphp5 Framework

  • 2021-12-19 06:17:44
  • OfStack

This paper describes the implementation method of ajax interface in Thinkphp5 framework with examples. Share it for your reference, as follows:

The first article talks about thinkphp5 getting data from the database and assigning it to the view view. The first article is server-side data rendering in terms of data rendering mode, and this chapter is browser-side data rendering. According to the basis of knowledge summary, these are two different technical scenarios.

The following describes the specific ajax interface implementation code.

The first part is html code. My access address is: http://app.write.com/thinkphp/public/index.php/index/index/api. The entry file is not omitted here. At the same time, my local domain name is app.write.com, and tp5 framework is in thinkphp file. The native ajax is adopted here, and the compatibility of ie browser is not done. The code is as follows 


<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>ajax Calling interface </title>
</head>
<body>
  11111
  <div id="test">
  </div>
  <script type="text/javascript">
  var oAjax = new XMLHttpRequest();
  oAjax.open('GET',"/thinkphp/public/index.php/index/index/apiapi?name=1");
  oAjax.onreadystatechange = function() {
    if (oAjax.readyState == 4) {
      if (oAjax.status >= 200 && oAjax.status < 300 || oAjax.status == 304) {
        console.log(oAjax.responseText);
        var data=JSON.parse(oAjax.responseText);
        document.getElementById("test").innerHTML=data.sex;
      } else {
        console.log(oAjax.status);
      }
    }
  };
  oAjax.send();
  </script>
</body>
</html>

To explain the above code, it is a small knowledge point: 1 Generally speaking, the status code of http is 200 as a sign of success, and the content of responseText attributes is ready at this time. In addition state 304 indicates that the requested resource has not been modified and the version cached in the browser can be used directly.

As for why it is greater than 200 for compatibility reasons, some browsers will report 204.

The back-end code is as follows. The back-end code is the apiapi method of index under the same controller under the same module index. 


<?php
namespace app\index\controller;
//use think\Db;
use think\Controller;
class Index extends Controller
{
   public function apiapi(){
    $name=$this->request->param();
    return json_encode($name);
    ///return "common";
  }
   public function api(){
    return view();
    ///return "common";
  }
}

The code first gets the parameters obtained by ajax, and then returns to the front end.

For more readers interested in thinkPHP related contents, please check the topics of this site: "ThinkPHP Introduction Tutorial", "thinkPHP Template Operation Skills Summary", "ThinkPHP Common Methods Summary", "codeigniter Introduction Tutorial", "CI (CodeIgniter) Framework Advanced Tutorial", "Zend FrameWork Framework Introduction Tutorial" and "PHP Template Technology Summary".

I hope this article is helpful to the PHP programming based on ThinkPHP framework.

Related articles: