Có thể sử dụng jquery với python không?
|
Các ứng dụng web thông thường truyền thông tin đến và từ máy chủ bằng cách sử dụng các yêu cầu đồng bộ, có nghĩa là chúng tôi điền vào biểu mẫu, nhấn gửi và được chuyển đến một trang mới với thông tin mới từ máy chủ Show Nói cách khác, ứng dụng web cần chuyển dữ liệu từ phía máy khách sang các phương thức phía máy chủ để nhận phản hồi từ máy chủ. jQuery chỉ là một cách đơn giản để đạt được điều này. Chúng tôi có thể sử dụng các thư viện hoặc khung phía máy khách khác như AngularJS để POST dữ liệu lên ứng dụng web python Tuy nhiên, với AJAX, khi chúng tôi nhấn gửi, những điều sau sẽ xảy ra
AXJS(JavaScript và XML không đồng bộ) là Không đồng bộ, vì vậy người dùng có thể tiếp tục sử dụng ứng dụng trong khi chương trình máy khách yêu cầu thông tin từ máy chủ ở chế độ nền Chúng tôi sẽ sử dụng virtualenvwrapper k@laptop:~$ mkvirtualenv venv New python executable in /home/k/Envs/venv1/bin/python Installing setuptools, pip, wheel...done. (venv) k@laptop:~$ cài đặt bình $ pip install Flask ... Successfully installed Flask-0.11.1 Jinja2-2.8 MarkupSafe-0.23 Werkzeug-0.11.11 click-6.6 itsdangerous-0.24 Chúng ta sẽ bắt đầu từ ứng dụng đơn giản from flask import Flask
app = Flask(__name__)
@app.route("/")
def hello():
return "Hello World!"
if __name__ == "__main__":
app.run()
Đây là danh sách các tệp của chúng tôi được sử dụng trong hướng dẫn này Trang đăng ký - sign Up. html Chúng tôi có thể muốn tạo một trang Đăng ký có tên là mẫu/đăng ký. html bằng Bootstrap để cấp nguồn cho các tệp html của chúng tôi
SignUp Template for Bootstrap
Chúng ta cần thêm một phương thức python có tên signUp để xử lý yêu cầu và hiển thị tệp html tương ứng. Chúng tôi sử dụng render_template để hiển thị trang đăng ký theo yêu cầu /signUp. Chúng tôi trả lại mẫu được hiển thị dưới dạng phản hồi from flask import Flask, render_template, request, json
app = Flask(__name__)
@app.route('/')
def hello():
return "Hello World!"
@app.route('/signUp')
def signUp():
return render_template('signUp.html')
if __name__=="__main__":
app.run()
Bây giờ chúng ta sẽ sử dụng jQuery AJAX để đăng dữ liệu biểu mẫu lên phương thức Python Flask Vì vậy, hãy tạo một tệp JavaScript mới có tên signUp. js và đưa nó vào sau jQuery trong signUp. html ... trong kịch bản. js, chúng tôi sẽ đính kèm một sự kiện nhấp chuột khi nhấp vào nút và gọi phương thức python bằng jQuery AJAX. Chúng tôi sẽ tuần tự hóa dữ liệu biểu mẫu bằng cách sử dụng $form. serialize() và đăng nó lên phương thức python, /signUpUser $(function(){
$('button').click(function(){
var user = $('#inputUsername').val();
var pass = $('#inputPassword').val();
$.ajax({
url: '/signUpUser',
data: $('form').serialize(),
type: 'POST',
success: function(response){
console.log(response);
},
error: function(error){
console.log(error);
}
});
});
});
/signUpUser phương thức trong ứng dụng. py Bây giờ, hãy thêm phương thức python signUpUser() để nhận dữ liệu từ phía máy khách from flask import Flask,render_template, request,json
app = Flask(__name__)
@app.route('/')
def hello():
return "Hello World!"
@app.route('/signUp')
def signUp():
return render_template('signUp.html')
@app.route('/signUpUser', methods=['POST'])
def signUpUser():
user = request.form['username'];
password = request.form['password'];
return json.dumps({'status':'OK','user':user,'pass':password});
if __name__=="__main__":
app.run()
Ở đây, để truy xuất các tham số đã đăng, chúng tôi đã sử dụng mô-đun yêu cầu. Chúng tôi cũng đã sử dụng mô-đun json để trả lại dữ liệu json cho phía máy khách. json. kết xuất trả lại json cho phía máy khách jQuery là một thư viện JavaScript nhỏ thường được sử dụng để đơn giản hóa việc làm việc với DOM và JavaScript nói chung. Nó là công cụ hoàn hảo để làm cho các ứng dụng web năng động hơn bằng cách trao đổi JSON giữa máy chủ và máy khách Bản thân JSON là một định dạng vận chuyển rất nhẹ, rất giống với cách các nguyên hàm Python (số, chuỗi, ký tự và danh sách) trông giống như được hỗ trợ rộng rãi và rất dễ phân tích cú pháp. Nó đã trở nên phổ biến cách đây vài năm và nhanh chóng thay thế XML làm định dạng truyền tải trong các ứng dụng web Đang tải jQueryĐể sử dụng jQuery, trước tiên bạn phải tải xuống và đặt nó vào thư mục tĩnh của ứng dụng của bạn, sau đó đảm bảo rằng nó đã được tải. Lý tưởng nhất là bạn có một mẫu bố cục được sử dụng cho tất cả các trang mà bạn chỉ cần thêm một câu lệnh script vào cuối ________số 8_______ Một phương pháp khác là sử dụng API Thư viện AJAX của Google để tải jQuery <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">script> <script>window.jQuery || document.write(' Như bạn có thể thấy, tôi cũng đã thêm một phương thức chỉ mục ở đây để hiển thị một mẫu. Mẫu này sẽ tải jQuery như trên và có một biểu mẫu nhỏ để chúng ta có thể thêm hai số và liên kết để kích hoạt chức năng ở phía máy chủ Lưu ý rằng chúng tôi đang sử dụng phương pháp ở đây sẽ không bao giờ thất bại. Nếu khóa bị thiếu, giá trị mặc định (ở đây HTMLchỉ mục của bạn. mẫu html phải mở rộng mẫu <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">script> <script>window.jQuery || document.write(' |
