Hướng dẫn how does php communicate with javascript? - php giao tiếp với javascript như thế nào?

Question

Trong thực tế, bạn có thể sử dụng điều này:

Tệp: index.php

<HTML>
    <body>      
        <input type="text" id="test" value="123"><br>
        <input type="button" id="btn" onclick="send_to_php()" value="send to php">

        <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
        <script>

                function send_to_php() {
                        $.ajax({
                            url: 'js_php.php',
                            type: 'POST',               
                            // Form data
                            data: function(){
                                var data = new FormData();
                                data.append('test', $("#test").val() );     
                                return data;
                            }(),
                            success: function (data) {
                                var obj = JSON.parse(data);
                                $("#test").val( obj.result );                   
                            },
                            error: function (data) {
                                console.log(data);
                            },
                            complete: function () {                 

                            },
                            cache: false,
                            contentType: false,
                            processData: false
                        });
                }

        </script>
    </body>
</HTML>

Tệp: js_php.php

<?php
    //FILE: js_php.php

    $test = $_POST["test"];
    $test .= "456";

    $arrResult = array(     
        'result' => $test
    );          

    print json_encode($arrResult);
    die();
?>

Tệp "index.php" là giao tiếp giữa JavaScript và PHP bằng phương thức JQuery Ajax. Khi nhấp vào nút "Gửi đến PHP" sẽ chạy "Send_to_php ()" sẽ lấy giá trị của ID đầu vào "kiểm tra" và gửi qua AJAX, cho tệp "JS_PHP.PHP". Đổi lại, tệp "js_php.php" sẽ nhận được biến này dưới dạng bài đăng, sửa đổi và in giá trị ở định dạng JSON. Phương thức được thực hiện bởi hàm ajax "send_to_php ()" sẽ là "in" Tất cả những gì "js_php.php" in.

Sau thành công của sự trở lại, JavaScript chuyển đổi văn bản "js_php.php" được in trên đối tượng JSON và sau đó JS có thể xử lý trong mã JavaScript:

success: function (data) {
    var obj = JSON.parse (data);
    $("# test").val(obj.result);
},

Một câu hỏi được đưa ra nhiều lần trên phần trao đổi PHP của các chuyên gia là "Làm thế nào tôi có thể thực hiện gọi JavaScript gọi một số mã PHP (hoặc MySQL)?"

Câu trả lời ngắn gọn là bạn không thể khiến họ nói chuyện trực tiếp với nhau. PHP và JavaScript giống như hai người ở các quốc gia khác nhau. Họ không bao giờ có thể nói chuyện với nhau trực tiếp vì họ không ở cùng một phòng, nhưng họ có thể sử dụng nhiều công cụ khác nhau để giúp họ vẫn giao tiếp, từ các chữ cái đến trò chuyện video (khá gần với nói chuyện về mặt đối mặt).

Những công cụ này luôn liên quan đến các máy tính nói chuyện với nhau thay mặt cho mọi người, và đó là điều tương tự với PHP và JavaScript.

JavaScript là ngôn ngữ kịch bản phía máy khách. Điều đó có nghĩa là khi bạn mở Firefox (ví dụ) và truy cập một trang có chứa JavaScript, Firefox được cung cấp mã JavaScript cho trang đó và tùy thuộc vào Firefox để quyết định chạy mã đó vào thời điểm đó mà nó nhận được mọi thứ. Tùy thuộc vào công cụ JavaScript của Firefox để thực hiện đúng tất cả các hướng dẫn mà nhà phát triển trang web đã đặt ra. Tóm lại, JavaScript được chạy trên máy tính của khách truy cập bằng bất kỳ trình duyệt nào mà người đó đang sử dụng. That means that when you open up Firefox (for example) and visit a page containing Javascript, Firefox is given the Javascript code for that page and it is up to Firefox to decide to run that code at the time that it receives everything. It is up to Firefox's Javascript engine to properly execute all of the instructions that the web page developer has laid out. Bottom-line, Javascript is run on the visitor's own computer by whatever browser that person is using.

PHP (và hầu hết các ngôn ngữ) là phía máy chủ. Điều này có nghĩa là khi trình duyệt của khách truy cập yêu cầu máy chủ web cho trang, tất cả mã PHP được chạy trên máy chủ web đó và sau đó kết quả đã hoàn thành được gửi dưới dạng tài liệu HTML (ít nhất đó là cách tiếp cận phổ biến nhất). This means that when the visitor's browser asks the web server for the page, all of the PHP code is run on that web server and THEN the finished results are delivered as an HTML document (at least that is the most common approach).

Dưới đây là một hình ảnh động đơn giản cho thấy cách giao tiếp hoạt động giữa trình duyệt web và máy chủ web và nơi đặt JavaScript, PHP và MySQL (bạn có thể cần nhấp vào nó để xem hoạt hình):

Vì vậy, trở lại câu hỏi, "Làm thế nào tôi có thể làm cho JavaScript gọi một số mã PHP (hoặc MySQL)?" Câu trả lời là để JavaScript nói với trình duyệt web gửi một yêu cầu khác đến máy chủ web và máy chủ web có thể chuyển yêu cầu đó cho PHP. PHP sau đó có thể trả lời với một cái gì đó mà JavaScript có thể sử dụng.

Quá trình này rõ ràng xảy ra một lần khi trang tải, nhưng điều gì xảy ra khi bạn muốn JavaScript gọi PHP mà không tải lại trang? Câu trả lời là ajax.

Ajax là viết tắt của a.synchronous J.Avascript A.Nd X.Ml. Về cơ bản, AJAX chỉ đơn giản là khái niệm sử dụng một trong các công cụ của JavaScript để tải một trang web (bất kỳ URL nào) và JavaScript có thể xem và xử lý kết quả thay vì chỉ hiển thị kết quả trong trình duyệt.

Bài viết này sẽ không bao gồm cách thực hiện cuộc gọi AJAX từ đầu vì nó có thể phức tạp. May mắn thay, có những thư viện JavaScript phổ biến như JQuery giúp việc tạo các cuộc gọi Ajax cực kỳ dễ dàng.

Giả sử bạn có một trang web tại http://www.mysite.com/index.html and bạn muốn một khách truy cập có thể nhập một số. Bạn muốn lấy số đó, tìm kiếm bản ghi trong cơ sở dữ liệu và hiển thị kết quả cho khách truy cập. Dễ!

Chúng ta cần phải làm những việc sau:

Trang web: http://www.mysite.com/index.html 1. Đảm bảo trang web có: & nbsp; & nbsp; một. jQuery được tải (các thư viện khác cũng hoạt động) & nbsp; & nbsp; b. Một cách để khách truy cập nhập số bản ghi & nbsp; & nbsp; c. Một nút để họ nhấp để nhận bản ghi & nbsp; & nbsp; d. Một nơi để hiển thị kết quả. http://www.mysite.com/index.html
1. Make sure the web page has:
a. jQuery loaded (other libraries work, too)
b. A way for the visitor to type in the record number
c. A button for them to click to get the record
d. A place to display the result.

Tập lệnh PHP: http://www.mysite.com/getrecord.php 2. Đảm bảo chúng tôi có tập lệnh PHP mà: & nbsp; & nbsp; một. Kết nối với cơ sở dữ liệu của chúng tôi & nbsp; & nbsp; b. Tìm bản ghi được yêu cầu & nbsp; & nbsp; c. Hiển thị kết quả http://www.mysite.com/getrecord.php
2. Make sure we have a PHP script that:
a. Connects to our database
b. Finds the requested record
c. Displays the result

Vì vậy, trước tiên, hãy xây dựng một trang mẫu:

<html>
<head>
<!-- Step 1a: Load jQuery -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
</head>
<body>
    
  <b>Record Number:</b>

  <!-- Step 1b: Provide a way for them to type in the record number -->
  <input type="text" id="txtRecordNumber">

  <!-- Step 1c: ...and a button for them to click to get the record -->
  <input type="button" onClick="requestRecord();" value="Get the Record">

   <br />
   <b>Result:</b>
   
   <!-- Step 1d: ...and a place to display the result -->
   <div id="divRecordResult"></div>

<!-- When the button is clicked, we need to run a Javascript function called requestRecord -->
<script type="text/javascript">
function requestRecord()
{
  // First, we'll get the record number that the user entered...
  recordNumber = jQuery("#txtRecordNumber").val();

  // Now we are going to send it using AJAX to our PHP script...
  jQuery.ajax({

    type: "POST",
    url: "http://www.mysite.com/getrecord.php",
    data: {
      recordNumberFromJavascript: recordNumber
    },
    dataType: "html"

  }).done(function( result ) {

    // "result" will contain whatever comes back from our PHP script
    // so we'll use jQuery to put the result inside our results <div>.
    jQuery("#divRecordResult").html(result);

  });

}
</script>

</body>
</html>

Bây giờ chúng tôi đã sẵn sàng trang web của chúng tôi, chúng tôi chỉ cần tập lệnh PHP của chúng tôi. Chúng tôi sẽ nói nó trông giống như thế này:

<?php
// Connect to our database (Step 2a)
$mysqli = new mysqli("localhost", "my_user", "my_password", "my_database");

// Find the record (Step 2b)
if ($result = $mysqli->query("SELECT Name FROM Records WHERE RecordNumber = " . intval($_POST["recordNumberFromJavascript"])))
{
   $row = $result->fetch_assoc();
  
   // Step 2c: Display the value (this is what Javascript will see)
   echo $row["Name"];

   // Cleanup
   $result->free();
}
else
{
  // In case the database cannot find that record, show a message to Javascript
  echo "Not a valid record number!";
}
?>

Mau! Bây giờ chúng tôi có một mô hình ajax làm việc. Chúng tôi có một trang web gửi yêu cầu AJAX đến PHP. PHP sau đó gọi cơ sở dữ liệu và tìm kiếm số bản ghi và trả về tên hoặc "không phải là số bản ghi hợp lệ!" thông điệp. Ngay khi PHP trả lời, JQuery sẽ đưa kết quả đó và đưa nó vào một người truy cập có thể nhìn thấy nó!

Phần còn lại là tùy thuộc vào trí tưởng tượng của bạn. Có nhiều tùy chọn cho cách bạn có thể gửi cuộc gọi AJAX (dưới dạng bài đăng, dưới dạng nhận, các tham số khác nhau, v.v.) và nhiều phím tắt. Trang tài liệu jQuery toàn diện nhất trên tất cả các tùy chọn của nó cho AJAX được tìm thấy ở đây:

http://api.jquery.com/jquery.ajax/

Ajax và Securityajax là một khái niệm mạnh mẽ, nhưng giống như tất cả các công cụ mạnh mẽ, nó cũng có thể là một vấn đề bảo mật lớn nếu bạn không coi trọng nó.
AJAX is a powerful concept, but like all powerful tools, it can also be a big security problem if you do not treat it with caution.

Trong ví dụ trên của tôi, không có gì để ngăn chặn bất kỳ khách truy cập nào yêu cầu bất kỳ số bản ghi nào họ muốn. Ngoài ra, tập lệnh PHP là tập lệnh PHP, cho dù nó có được AJAX sử dụng hay không. Vì vậy, mặc dù bạn chỉ có thể sử dụng getRecord.php đúng cách với AJAX, nhưng người khác vẫn có thể truy cập trực tiếp getrecord.php và sử dụng nó để đánh cắp dữ liệu của bạn.

Luôn luôn là một ý tưởng tốt để suy nghĩ thông qua những cách mà một kịch bản PHP có thể bị lạm dụng bởi một người có ý định xấu. Sau đó, bạn có thể thêm bảo mật để giúp ngăn chặn các loại tình huống đó. Tôi sẽ đề nghị đọc bài viết của mình về bảo mật ứng dụng web như là bài viết của bài viết này trên AJAX:

https://www.experts-exchange.com/programming/project_man quản lý

Bây giờ đi xây dựng một cái gì đó!

programming php Ajax