Home Backend Development PHP Tutorial Detailed explanation of front-end ajax and back-end interaction

Detailed explanation of front-end ajax and back-end interaction

Dec 26, 2017 am 11:29 AM
ajax interaction Detailed explanation

To exchange data with the back-end that is often used in the front-end, ajax is usually used. This article mainly introduces various related knowledge of the front-end ajax and the back-end interaction, which has a good reference value. Let’s take a look with the editor below, I hope it can help everyone.

But there are many ways to interact, many of which depend on the properties of your backend. Here I will mainly list two methods that are commonly used in my current projects

--One is our common web api and controller,

First of all, let’s take a closer look at the interaction data between ajax and webapi

Here is a brief description of the four properties of web api-GET, POST, PUT, DELETE

Here I, Yongchang, use GET and POST

If we need to use AJAX to interact with the data at the back end


1

2

3

4

5

6

7

8

9

10

11

$.ajax({

   url: "你的webapi",

   type: "Get",

   DATA{},//这里面写你要传给后端的数据,不过GET方法一般不需要,直接读就可以了

   success: function (data) {

      //成功后的return事件

     }

   error: function (data) {

     alert("data");//请求错误后的报错事件(很重要,如果你报错了不知道哪儿要改的话这个可以帮助你,我个人感觉主要是500报错)

   }

 })

Copy after login

This kind of GET usually reads some data from the backend when the web page is initialized and then assigns it to the page (maybe my professional terminology is not standard, please forgive QAQ)

Then what I want to talk about It is the POST method


1

2

3

4

5

6

7

8

9

10

11

$.ajax({

    url: "你的webapi",

    type: "POST",

    DATA{},//这里面写你要传给后端的数据,这里面有点十分重要就是你的webapi方法上面一定要加[HTTPPOST]不然会500报错

    success: function (data) {

       //成功后的return事件

      }

    error: function (data) {

      alert("data");//请求错误后的报错事件(很重要,如果你报错了不知道哪儿要改的话这个可以帮助你,我个人感觉主要是500报错)

    }

  })

Copy after login

The general POST method is the same as the usual ajax method, just remember to add [HTTPPOST] to your WEBAPI method

For the rest, I want to summarize some POST to controller methods that are sometimes used. Although the controller can directly URLPOST, I personally still like to use AJAX, mainly because AJAX can see where my own psot errors are. 233


1

2

3

4

5

6

7

8

9

10

$.ajax({

          url: 你的控制器/你的控制器方法名字,

          type: 'POST',

          dataType: 'json',

          data: ,//依旧是你要传递参数的值

          contentType: “”application/json”,//这儿是告诉你传递参数一定是要json格式的啊 

          success: function (data) {

            //成功后的返回事件

          }

        });

Copy after login

It is worth mentioning that the values ​​I personally pass feel to be of json type, and I have not yet tested passing non-json type parameters;

Related recommendations:

php modularization for front-end ajax call implementation ajax php post jquery ajax php ajax points

Ajax implementation of dynamic loading of data strength sharing

Example detailed explanation js combined with json to implement ajax simple example

The above is the detailed content of Detailed explanation of front-end ajax and back-end interaction. For more information, please follow other related articles on the PHP Chinese website!

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

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

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)

Hot Topics

Java Tutorial
1654
14
PHP Tutorial
1252
29
C# Tutorial
1225
24
Detailed explanation of obtaining administrator rights in Win11 Detailed explanation of obtaining administrator rights in Win11 Mar 08, 2024 pm 03:06 PM

Windows operating system is one of the most popular operating systems in the world, and its new version Win11 has attracted much attention. In the Win11 system, obtaining administrator rights is an important operation. Administrator rights allow users to perform more operations and settings on the system. This article will introduce in detail how to obtain administrator permissions in Win11 system and how to effectively manage permissions. In the Win11 system, administrator rights are divided into two types: local administrator and domain administrator. A local administrator has full administrative rights to the local computer

PHP and Ajax: Building an autocomplete suggestion engine PHP and Ajax: Building an autocomplete suggestion engine Jun 02, 2024 pm 08:39 PM

Build an autocomplete suggestion engine using PHP and Ajax: Server-side script: handles Ajax requests and returns suggestions (autocomplete.php). Client script: Send Ajax request and display suggestions (autocomplete.js). Practical case: Include script in HTML page and specify search-input element identifier.

Detailed explanation of division operation in Oracle SQL Detailed explanation of division operation in Oracle SQL Mar 10, 2024 am 09:51 AM

Detailed explanation of division operation in OracleSQL In OracleSQL, division operation is a common and important mathematical operation, used to calculate the result of dividing two numbers. Division is often used in database queries, so understanding the division operation and its usage in OracleSQL is one of the essential skills for database developers. This article will discuss the relevant knowledge of division operations in OracleSQL in detail and provide specific code examples for readers' reference. 1. Division operation in OracleSQL

How to solve the 403 error encountered by jQuery AJAX request How to solve the 403 error encountered by jQuery AJAX request Feb 20, 2024 am 10:07 AM

Title: Methods and code examples to resolve 403 errors in jQuery AJAX requests. The 403 error refers to a request that the server prohibits access to a resource. This error usually occurs because the request lacks permissions or is rejected by the server. When making jQueryAJAX requests, you sometimes encounter this situation. This article will introduce how to solve this problem and provide code examples. Solution: Check permissions: First ensure that the requested URL address is correct and verify that you have sufficient permissions to access the resource.

How to solve jQuery AJAX request 403 error How to solve jQuery AJAX request 403 error Feb 19, 2024 pm 05:55 PM

jQuery is a popular JavaScript library used to simplify client-side development. AJAX is a technology that sends asynchronous requests and interacts with the server without reloading the entire web page. However, when using jQuery to make AJAX requests, you sometimes encounter 403 errors. 403 errors are usually server-denied access errors, possibly due to security policy or permission issues. In this article, we will discuss how to resolve jQueryAJAX request encountering 403 error

How to solve the problem of jQuery AJAX error 403? How to solve the problem of jQuery AJAX error 403? Feb 23, 2024 pm 04:27 PM

How to solve the problem of jQueryAJAX error 403? When developing web applications, jQuery is often used to send asynchronous requests. However, sometimes you may encounter error code 403 when using jQueryAJAX, indicating that access is forbidden by the server. This is usually caused by server-side security settings, but there are ways to work around it. This article will introduce how to solve the problem of jQueryAJAX error 403 and provide specific code examples. 1. to make

Detailed explanation of the linux system call system() function Detailed explanation of the linux system call system() function Feb 22, 2024 pm 08:21 PM

Detailed explanation of Linux system call system() function System call is a very important part of the Linux operating system. It provides a way to interact with the system kernel. Among them, the system() function is one of the commonly used system call functions. This article will introduce the use of the system() function in detail and provide corresponding code examples. Basic Concepts of System Calls System calls are a way for user programs to interact with the operating system kernel. User programs request the operating system by calling system call functions

Detailed explanation of the role and usage of PHP modulo operator Detailed explanation of the role and usage of PHP modulo operator Mar 19, 2024 pm 04:33 PM

The modulo operator (%) in PHP is used to obtain the remainder of the division of two numbers. In this article, we will discuss the role and usage of the modulo operator in detail, and provide specific code examples to help readers better understand. 1. The role of the modulo operator In mathematics, when we divide an integer by another integer, we get a quotient and a remainder. For example, when we divide 10 by 3, the quotient is 3 and the remainder is 1. The modulo operator is used to obtain this remainder. 2. Usage of the modulo operator In PHP, use the % symbol to represent the modulus

See all articles