Bình trong html là gì?

Làm việc với Flask [một framework web siêu nhỏ được viết bằng python] là một trong những điều tôi thực sự muốn thử nhưng chưa bao giờ làm được 😕

Nhưng cuối cùng. Tôi đã làm nó…. yaaay. và tôi thực sự vui mừng được chia sẻ nó với tất cả các bạn… Nó siêu dễ và cực hay

Tôi sẽ giúp bạn những kiến ​​thức cơ bản về cách tạo trang web bằng HTML và cách thêm tuyến đường qua bình

Đầu tiên, cài đặt gói Flask. pip install Flask

Tạo một thư mục mới và bên trong thư mục dự án của bạn, tạo một thư mục tĩnh và thư mục mẫu

Thư mục tĩnh sẽ chứa các tệp CSS and images của bạn trong khi các mẫu sẽ chứa các tệp HTML của bạn. Điều này rất quan trọng vì ban đầu khi tôi thử làm việc trên Flask mà không biết gì về cây thư mục, tôi đã không thể chạy tệp và khi đó tôi phát hiện ra rằng bình tìm kiếm các mẫu cho các chế độ xem chứa các tệp HTML. Và api. py là tệp chính mà bạn sẽ phải chạy để làm cho tệp HTML của bạn hoạt động

Vì vậy, cây thư mục của bạn sẽ trông giống như

gây nhầm lẫn? . https. //github. com/pemagrg1/flask-dành cho người mới bắt đầu

Vì vậy, api. tệp py sẽ chứa tất cả các tuyến sẽ liên kết mã HTML và mã python của bạn

Hãy tạo một

tạo một tệp HTML và đặt tên là home. html

    
    First Flask App


    

        Hello!! Testing if it works on web! :p
    

Tạo một trang HTML đơn giản để hiển thị văn bản

Và trong api của bạn. py

from flask import Flask, render_templateapp = Flask[__name__]
@app.route['/']
def home[]:
    return render_template['home.html']
if __name__ == '__main__':
    app.run[debug=True, host='0.0.0.0', port=5000]

tạo một tuyến đường ”/” và trở về nhà. html từ chức năng. Sau đó chạy api của bạn. py và nhấp vào liên kết mà nó cung cấp sau khi chạy. Nếu nó không hiển thị cho bạn bất kỳ liên kết nào, hãy mở trình duyệt của bạn và trên hộp url, hãy nhập http. //0. 0. 0. 0. 5000/

Dễ dàng?

Bây giờ, hãy lấy thông tin đầu vào từ trang web đến bình và in lại

Bây giờ sao chép dán cái này vào api của bạn. py

from flask import Flask, request, render_template,jsonifyapp = Flask[__name__]def do_something[text1,text2]:
   text1 = text1.upper[]
   text2 = text2.upper[]
   combine = text1 + text2
   return combine@app.route['/']
def home[]:
    return render_template['home.html']@app.route['/join', methods=['GET','POST']]
def my_form_post[]:
    text1 = request.form['text1']
    word = request.args.get['text1']
    text2 = request.form['text2']
    combine = do_something[text1,text2]
    result = {
        "output": combine
    }
    result = {str[key]: value for key, value in result.items[]}
    return jsonify[result=result]if __name__ == '__main__':
    app.run[debug=True, host='0.0.0.0', port=5000]

tạo một route mới “/join” với các phương thức “get and post”. Lấy thông tin đầu vào từ hộp nhập liệu trên web thông qua request.form[]. Thực hiện một số thao tác văn bản trong hàm và trả về giá trị dưới dạng JSON cho web

Sao chép cái này vào nhà. html

    
    First Flask App
    function myFunction[] {
var text1= $['#text1'].val[];
var text2= $['#text2'].val[];
  $.ajax[{
              url: "/join",
              type: "POST",
              data: {text1:text1,
              text2:text2}          }].done[function[response] {            var html= "


  RESULT : 
";            response =response.result;
                 $.each[response,function[key,val]{
                 console.log[val];
                    html+="
"+val+"
"                }];
                html +="
";
                $[".show-data"].append[html];
            }];
};  

    

        Taking input from web

            Text_Value1


            Text_Value2


            Submit
        

  


    
    

Chạy tệp API

mở liên kết trên trình duyệt. Nhập các giá trị và nhấp vào gửi, kết quả sẽ được hiển thị trên cùng một trang