Truyền biến php vào javascript

Tôi sẽ thử một câu trả lời đơn giản hơn:

Giải thích vấn đề

Trước tiên, hãy hiểu luồng sự kiện khi một trang được phục vụ từ máy chủ của chúng tôi:

• PHP đầu tiên được chạy, nó tạo ra HTML được phục vụ cho máy khách.
• Sau đó, HTML được gửi đến máy khách, sau khi PHP hoàn thành với nó, tôi muốn nhấn mạnh rằng một khi mã rời khỏi máy chủ - PHP được thực hiện với nó và không thể truy cập được nữa.
• Sau đó, HTML với JavaScript đến máy khách, có thể thực thi JS trên html đó.

Vì vậy, thực sự, điều cốt lõi cần nhớ ở đây là HTTP là không trạng thái . Khi một yêu cầu rời khỏi máy chủ, máy chủ không thể chạm vào nó. Vì vậy, đó là lựa chọn của chúng tôi để:

1. Gửi thêm yêu cầu từ khách hàng sau khi yêu cầu ban đầu được thực hiện.
2. Mã hóa những gì máy chủ đã nói trong yêu cầu ban đầu.

Các giải pháp

Đó là câu hỏi cốt lõi bạn nên tự hỏi mình là:

Tôi đang viết một trang web hoặc một ứng dụng?

Trang web chủ yếu dựa trên trang và thời gian tải trang cần phải nhanh nhất có thể (ví dụ: Wikipedia). Các ứng dụng web nặng hơn AJAX và thực hiện nhiều chuyến đi khứ hồi để có được thông tin nhanh của khách hàng (ví dụ: bảng điều khiển chứng khoán).

Trang mạng

Gửi thêm yêu cầu từ khách hàng sau khi yêu cầu ban đầu được thực hiện là chậm vì nó yêu cầu nhiều yêu cầu HTTP hơn có chi phí đáng kể. Hơn nữa, nó đòi hỏi sự không đồng bộ khi thực hiện một yêu cầu AJAX yêu cầu xử lý khi hoàn thành.

Tôi không khuyên bạn nên thực hiện một yêu cầu khác trừ khi trang web của bạn là một ứng dụng để nhận thông tin đó từ máy chủ.

Bạn muốn thời gian phản hồi nhanh có ảnh hưởng lớn đến thời gian chuyển đổi và tải. Thực hiện các yêu cầu ajax là chậm cho thời gian hoạt động ban đầu trong trường hợp này và không cần thiết.

Bạn có hai cách để giải quyết vấn đề

• Đặt cookie - cookie là các tiêu đề được gửi trong các yêu cầu HTTP mà cả máy chủ và máy khách đều có thể đọc được.
• Mã hóa biến là JSON - JSON trông rất gần với các đối tượng JavaScript và hầu hết các đối tượng JSON là các biến JavaScript hợp lệ.

Đặt cookie thực sự không khó lắm, bạn chỉ cần gán cho nó một giá trị:

setcookie("MyCookie", $value); // sets the cookie to the value, remember, do not
                               // set it with HTTP only to true.

Sau đó, bạn có thể đọc nó bằng JavaScript bằng cách sử dụng document.cookie:

Đây là một trình phân tích cú pháp cuộn tay ngắn, nhưng câu trả lời tôi liên kết ở bên trên này đã được thử nghiệm tốt hơn:

var cookies = document.cookie.split(";").
    map(function(el){ return el.split("="); }).
    reduce(function(prev,cur){ prev[cur[0]] = cur[1];return prev },{});

cookies["MyCookie"] // value set with php.

Cookies là tốt cho một ít dữ liệu. Đây là những gì dịch vụ theo dõi thường làm.

Khi chúng ta có nhiều dữ liệu hơn, chúng ta có thể mã hóa nó bằng JSON bên trong một biến JS:

Giả sử $valuelà json_encodecó thể ở bên PHP (nó thường là). Kỹ thuật này là những gì StackOverflow làm với trò chuyện của nó chẳng hạn (chỉ sử dụng .net thay vì php).

Ứng dụng

Nếu bạn đang viết một ứng dụng - đột nhiên thời gian tải ban đầu không phải lúc nào cũng quan trọng như hiệu suất liên tục của ứng dụng và nó bắt đầu trả hết để tải dữ liệu và mã riêng biệt.

Câu trả lời của tôi ở đây giải thích cách tải dữ liệu bằng AJAX trong JavaScript:

function callback(data){
    // what do I do with the response?
}

var httpRequest = new XMLHttpRequest;
httpRequest.onreadystatechange = function(){
    if (httpRequest.readyState === 4) {// request is done
        if (httpRequest.status === 200) {// successfully
            callback(httpRequest.responseText);// we're calling our method
        }
    }
};
httpRequest.open('GET', "/echo/json");
httpRequest.send();

Hoặc với jQuery:

$.get("/your/url").done(function(data){
    // what do I do with the data?
});

Bây giờ, máy chủ chỉ cần chứa một /your/urltuyến đường / tệp chứa mã lấy dữ liệu và thực hiện một cái gì đó với nó, trong trường hợp của bạn:

<$php
 ...
 $val = myService->getValue(); // makes an api and db call
 echo json_encode($val); // write it to the output
 $>

Theo cách này, tệp JS của chúng tôi yêu cầu dữ liệu và hiển thị nó thay vì yêu cầu mã hoặc bố cục. Điều này là sạch hơn và bắt đầu trả hết khi ứng dụng cao hơn. Nó cũng phân tách mối quan tâm tốt hơn và nó cho phép kiểm tra mã phía máy khách mà không có bất kỳ công nghệ phía máy chủ nào liên quan, đó là một điểm cộng khác.

Postcript: Bạn phải rất chú ý đến các vectơ tấn công XSS khi bạn tiêm bất cứ thứ gì từ PHP sang JavaScript. Đó là rất khó khăn để thoát khỏi các giá trị đúng và đó là bối cảnh nhạy cảm. Nếu bạn không chắc chắn làm thế nào để đối phó với XSS, hoặc không biết về nó - vui lòng đọc bài viết OWASP này , bài viết này và câu hỏi này .

83 hữu ích 5 bình luận chia sẻ