Ví dụ tương tác giữa php và javascript như thế nào?

Ví dụ sau minh họa cách một trang web có thể giao tiếp với máy chủ web trong khi người dùng nhập ký tự vào trường nhập liệu

Thí dụ

Bắt đầu nhập tên vào trường nhập bên dưới

gợi ý

Họ

Ví dụ giải thích

Trong ví dụ trên, khi người dùng nhập một ký tự vào trường nhập liệu, một hàm có tên là showHint[] sẽ được thực thi

Chức năng được kích hoạt bởi sự kiện onkeyup

Đây là mã

Thí dụ

Bắt đầu nhập tên vào trường nhập bên dưới

gợi ý

Họ.

Try it Yourself »

giải thích mã

Trước tiên, hãy kiểm tra xem trường đầu vào có trống không [chuỗi. chiều dài == 0]. Nếu đúng như vậy, hãy xóa nội dung của trình giữ chỗ txtHint và thoát khỏi chức năng

• Đặc sắc

• lập trình

• DevOps

• ảo hóa

• cơ sở dữ liệu

• Bảo vệ

• hệ điều hành

• Microsoft

• mạng

• nhà phát triển web

• Đám mây

• di động

• đa phương tiện

• Năng suất

...

Chọn cộng đồng. Nhiều thành viên trong cộng đồng của chúng tôi đã xác nhận bài viết này

Lựa chọn của người biên tập. Bài viết này đã được các biên tập viên của chúng tôi chọn là một đóng góp đặc biệt

Làm thế nào để Javascript nói chuyện với PHP

gr8gonzo

Nhà tư vấn

CHUYÊN GIA ĐƯỢC CHỨNG NHẬN

Cộng đồng chuyên gia của chúng tôi đã được xem xét kỹ lưỡng về chuyên môn và kinh nghiệm trong ngành

Được phát hành. 2013-07-09

cập nhật. 2020-12-04

Duyệt qua tất cả các bài viết > Cách tạo Javascript nói chuyện với PHP

Một câu hỏi cứ lặp đi lặp lại trong phần PHP của Trao đổi chuyên gia là "Làm cách nào để Javascript gọi một số mã PHP [hoặc MySQL]?"

Câu trả lời ngắn gọn . 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 trực tiếp với nhau vì không ở cùng 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ừ thư từ đến trò chuyện video [khá gần với nói chuyện trực tiếp- .

Những công cụ này luôn liên quan đến việc các máy tính nói chuyện với nhau thay mặt cho mọi người và điều này cũng 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 sẽ được cung cấp mã Javascript cho trang đó và Firefox có quyền quyết định chạy mã đó vào thời điểm nhận được mọi thứ hay không. 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 chính khách truy cập bằng bất kỳ trình duyệt nào mà người đó đang sử dụng.

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 cung cấp trang, tất cả mã PHP sẽ đượ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].

Đây là một hoạt ảnh đơn giản cho thấy cách hoạt động của giao tiếp giữa trình duyệt web và máy chủ web cũng như vị trí của Javascript, PHP và MySQL [bạn có thể cần nhấp vào hoạt ảnh đó để xem hoạt ảnh].

Vậy hãy quay lại câu hỏi, "Làm cách nào để Javascript gọi một số mã PHP [hoặc MySQL]?" . Sau đó, PHP có thể phản hồi bằng thứ gì đó mà Javascript có thể sử dụng.

Quá trình này hiển nhiên xảy ra một lần khi tải trang, nhưng điều gì sẽ xảy ra khi bạn muốn Javascript gọi PHP mà không cần tải lại trang? .

AJAX là viết tắt của A. đồng bộ J. jav một. thứ X. máy học. 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 đề cập đến cách thực hiện lệnh gọi AJAX từ đầu vì nó có thể phức tạp. May mắn thay, có các thư viện Javascript phổ biến như jQuery giúp tạo các lệnh gọi AJAX cực kỳ dễ dàng.

Giả sử bạn có một trang web tại địa chỉ http. //www. trang web của tôi. com/chỉ mục. html và bạn muốn khách truy cập có thể nhập số. Bạn muốn lấy số đó, tra cứu 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 làm những việc sau.

Trang web. http. //www. trang web của tôi. com/chỉ mục. html
1. Đảm bảo rằng trang web có.
    a. Đã tải jQuery [các thư viện khác cũng hoạt động]
    b. Một cách để khách truy cập nhập số bản ghi
    c. Một nút để họ nhấp vào để lấy bản ghi
    d. Nơi hiển thị kết quả.

Tập lệnh PHP. http. //www. trang web của tôi. com/getrecord. php
2. Đảm bảo rằng chúng tôi có một tập lệnh PHP.
    a. Kết nối với cơ sở dữ liệu của chúng tôi
    b. Tìm bản ghi được yêu cầu
    c. Hiển thị kết quả


Vì vậy, trước tiên, hãy tạo một trang mẫu.

    
  Record Number:

  
  

  
  

   

   Result:
   
   
   




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: "//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 
.
    jQuery["#divRecordResult"].html[result];

  }];

}

Bây giờ chúng ta đã có trang web sẵn sàng, chúng ta chỉ cần tập lệnh PHP. Chúng tôi sẽ nói nó trông giống như thế này.
______1
Tuyệt vời. Bây giờ chúng tôi có một mô hình AJAX đang hoạt động. Chúng tôi có một trang web gửi yêu cầu AJAX tới PHP. Sau đó, PHP gọi cơ sở dữ liệu và tra cứu số bản ghi và trả về tên hoặc thông báo "Số bản ghi không hợp lệ. " thông điệp. Ngay khi PHP phản hồi, jQuery lấy kết quả đó và đặt nó vào

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

http. //api. jquery. com/jQuery. ajax/

AJAX và Bảo mật
AJAX 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 xử lý nó bằng .

Trong ví dụ trên của tôi, không gì có thể ngă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 sử dụng bởi AJAX hay không. Vì vậy, mặc dù BẠN có thể chỉ sử dụng getrecord. php đúng cách với AJAX, người khác vẫn có thể truy cập getrecord. php trực tiếp và sử dụng nó để đánh cắp dữ liệu của bạn.

Luôn luôn là một ý tưởng hay khi suy nghĩ về những cách mà một tập lệnh PHP có thể bị sử dụng sai bởi một người nào đó với mục đích 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 khuyên bạn nên đọc bài viết của mình về bảo mật ứng dụng web như một phần tiếp theo của bài viết này trên AJAX.

https. //www. trao đổi chuyên gia. com/Programming/Project_Management/Security/A_1263-5-Steps-to-Securing-Your-Web-Application. html

Bây giờ hãy xây dựng thứ gì đó.

Bản quyền  ©  2013 - Jonathan Hilgeman. Đã đăng ký Bản quyền.  

• Facebook
• Twitter
• LinkedIn
• https. //www. trao đổi chuyên gia. com/articles/11997/How-to-Make-Javascript-Talk-to-PHP. html bản sao

Đặt câu hỏi liên quan

Bình luận [5]

Eduardo Fuerte

Nhà phát triển và nhà phân tích

Đã nhận xét. 2013-07-10

Xin chào gr8gonzo.

Thật không may sau một số thử nghiệm, tôi đã không thành công trong việc làm cho nó hoạt động.
Có lẽ tôi đang làm sai điều gì đó hoặc phải điều chỉnh điều gì đó.

Có vẻ như getrecord. php không bao giờ bị sa thải.

Tôi đã thực hiện kiểm tra với giá trị được cung cấp để xem nó có ổn không.


Không sao đâu.

Sau đó, tôi đã thực hiện một số sửa đổi và dự kiến ​​để nó chạy, nhưng cũng không thành công.

______2

Chọn tất cả Mở trong cửa sổ mới

Could you give me assistance?

Any other check could be done?

Sorry if I've confused something.

Thanks in advance!

gr8gonzo

Nhà tư vấn

CHUYÊN GIA ĐƯỢC CHỨNG NHẬN

Cộng đồng chuyên gia của chúng tôi đã được xem xét kỹ lưỡng về chuyên môn và kinh nghiệm trong ngành

Tác giả

Đã nhận xét. 2013-07-10

Xin chào Efuerte,

Việc này không được thực hiện vì bạn đang gửi biểu mẫu. Khi bạn nhấp vào nút gửi bên trong

Đó là lý do tại sao tôi sử dụng



. tạo một nút có nhãn "Nhận bản ghi" và khi người dùng nhấp vào nút đó ["onClick"], trình duyệt sẽ cố chạy chức năng Javascript có tên "requestRecord[]".

Eduardo Fuerte

Nhà phát triển và nhà phân tích

Đã nhận xét. 2013-07-10

Xin chào g8gonzo

Vì vậy, tôi đã quay lại mã ban đầu của bạn vì

Chỉ để bạn kiểm tra xem bạn có thể.

http. //www. phích cắm siêu năng lực. com. br/Espiriplug_prj/Kool_Teste/Teste_g8gonzo. php

http. //www. phích cắm siêu năng lực. com. br/Espiriplug_prj/Kool_Teste/getrecord. php

Mã

    
  Record Number:

  
  

  
  

   

   Result:
   
   
   




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: "//www.mysite.com/getrecord.php",
    url: "//www.espiriplug.com.br/Espiriplug_prj/Kool_Teste/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 
.
    jQuery["#divRecordResult"].html[result];

  }];

}



 

Chọn tất cả Mở trong cửa sổ mới

và

Chọn tất cả Mở trong cửa sổ mới

Thanks.

gr8gonzo

Nhà tư vấn

CHUYÊN GIA ĐƯỢC CHỨNG NHẬN

Cộng đồng chuyên gia của chúng tôi đã được xem xét kỹ lưỡng về chuyên môn và kinh nghiệm trong ngành

Tác giả

Đã nhận xét. 2013-07-10

Bạn gặp lỗi Javascript. Bạn đang thiếu dấu phẩy sau url của mình.

url. "http. //www. phích cắm ngoại cảm. com. br/Espiriplug_prj/Kool_Teste/getrecord. php"
phải là.
url. "http. //www. phích cắm siêu năng lực. com. br/Espiriplug_prj/Kool_Teste/getrecord. php",

Tôi khuyên bạn nên sử dụng Firefox với plug-in Firebug để giúp gỡ lỗi Javascript.

Nếu có thêm câu hỏi, vui lòng mở một câu hỏi trong vùng PHP để phần nhận xét ở đây không chứa đầy mã. Cảm ơn.

Eduardo Fuerte

Nhà phát triển và nhà phân tích

Đã nhận xét. 2013-07-10

Xin chào  gr8gonzo.

Bây giờ nó đã hoạt động tốt. Xin lỗi vì sự bất tiện này và xin chân thành cảm ơn.

JavaScript có thể hoạt động cùng với PHP không?

JavaScript giao tiếp với PHP như thế nào?