аутентификация входа с использованием ajax-вызова на фляжный сервер (сломанная труба)

Я пытаюсь аутентифицировать пользователей в веб-приложении, используя ajax-вызов на сервер Python (Flask), который, в свою очередь, вызывает основной сервер. Я могу передать учетные данные на сервер Flask и выполнить аутентификацию. Но после аутентификации он должен передать клиенту сообщение об успешном завершении, чтобы я мог соответствующим образом перенаправить/показать сообщение на веб-странице. Но он не возвращает сообщение. Вместо этого он выдает ошибку сломанного канала после аутентификации. написали следующий код Клиентский код:

1)Джаваскрипт:

function login()
{
var user=document.getElementById("username").value;
var pass=document.getElementById("password").value;
//alert(JSON.stringify({username:user,password:pass}));
//var contentType = "application/x-www-form-urlencoded";
var ajax=$.ajax({
    type: "POST",
    //crossDomain: true,
    data: JSON.stringify({username:user,password:pass}),
    contentType:"application/x-www-form-urlencoded",
    dataType: "json",
    url: "http://0.0.0.0:8081"
    //async:true
}).done(function(data){


        //   alert(data);
    });
ajax.fail(function(data){


    //alert(data);
});

}

2) HTML:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<!--link rel="stylesheet" type="text/css" href="login.css"-->
<script type="text/javascript" src="login_auth.js" ></script>

</head>
<body>
<!-- Begin Page Content -->
<div id="container">
<form>

    <input type="text" id="username" name="username" value="sayan" >
    <input type="password" id="password" name="password" value="3BxTPu+y4YA">
    <div id="lower">
        <input type="checkbox" id="checkbox" name="checkbox"><label class="check" for="checkbox">Keep me logged
        in</label>
        <input type="submit" value="Login" onclick="login()">
    </div>
    <!--/ lower-->
</form>
</div><!--/ container-->
<!-- End Page Content -->
</body>
</html>

3) Код сервера Flask:

app = Flask(__name__)
@app.route('/', methods=['POST','GET','OPTIONS'])
@crossdomain(origin='*')
def login():

    data= request.get_json(force=True);
    br=mechanize.Browser()
    br.open('https://weaveprod.ucdp.utah.edu/geoserver/web/?wicket:bookmarkablePage=:org.geoserver.web.GeoServerLoginPage')
    br.select_form(nr=0) 
    username=data['username'];
    password=data['password'];
    br['username']= username
    br['password']= password

    response= br.submit()
    mainpage=response.read()
    val=mainpage.find('Invalid username/password combination')

    if val==-1:
            success = True
    else:
        success=False

    print success

    return jsonify(text=success);


if __name__ == "__main__":
    app.run(host="0.0.0.0", port=8081, debug=True,threaded=True)

Вопросы:

1) Если я делаю запрос через браузер Mozilla вместо Chrome, я получаю запрос GET вместо POST, и аутентификация не происходит.

2) Хотя я делаю запрос POST, я вижу имя пользователя и пароль в URL-адресе в адресной строке.

Пожалуйста, помогите мне... Я тружусь над этим уже 2 дня.

Спасибо, Саян


python javascript flask ajax broken-pipe
person user2284140    schedule 12.03.2014    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Код javascript должен быть включен последним (или задержать выполнение с помощью $(document).ready). Код пытался получить элементы с помощью document.getElementById("username").value еще до того, как были отрисованы поля формы. Кроме того, при нажатии кнопки отправки форма обычно отправляется, обновляя страницу и делая вызов ajax ранее бесполезным. Кроме того, обновление страницы может прервать выполненный ранее вызов ajax, что приведет к ошибке «разорванный канал», которую вы видите в журналах.

Вот немного лучший подход. Давайте напрямую свяжемся с событием отправки формы. Перед этим добавьте id="loginForm" в форму, чтобы мы могли получить ее напрямую с помощью jQuery, а также удалите атрибут onclick из кнопки отправки.

Теперь часть javascript.

$(document).ready(function() {
    // bind the form submit event to our function
    $("#loginForm").bind('submit', function(e) {
        // prevent page refresh
        e.preventDefault();
        // post the data
        var ajax=$.ajax({
            type: "POST",
            data: $("#loginForm").serialize(),
            url: "http://localhost:8081/"
        }).done(function(data){
            console.log('done!')
        });
        ajax.fail(function(data){
            console.log('error!');
        });
    });
});

На стороне сервера получите данные поля формы, такие как request.form.get('username') и request.form.get('password').

person vivekagr    schedule 12.03.2014