16

私は bitlfu という名前のPerlアプリケーションを実行しています。ログインにはApache HTTP Basic Authのようなものを使用していますが、フォームは使用していません。ユーザー名とパスワード フィールドを使用してログイン用のフォームを作成したいと考えています。JavaScript と PHP を試しましたが、今のところ結果はありません。

だから私は助けが必要です！

PS: この種の URL は動作します

http://user:password@host.com
4

4 に答える 4

8

私は次のような単純なJavaScriptだと思います。

document.location='http://' + user + ':' + pass + '@mydomain.tld';

仕事をする必要があります。

したがって、基本的には、ユーザーとパスフィールドを使用してフォームを作成し、送信時に、ここで指定されているJavaScriptの部分を使用する必要があります。

<form method="post" onsubmit="javascript:document.location='http://' + $('login') + ':' + $('pass') + '@mydomain.tld';">
    <input type="text" name="login" id="login" />
    <input type="password" name="pass" id="pass" />
    <input type="submit" value="ok"/>
</form>

ここで、$（）はdocument.getElementByIdまたはjqueryなどです。$（）関数を使用して、コードを短くしました。これが実装ですが、すべてのブラウザで機能するわけではありません。繰り返しますが、クロスブラウザソリューションについてはjQueryをスローしてください。

function $(_id) { return document.getElementById(_id); }

それ以外の場合は、phpを使用して、ヘッダーの場所でユーザーをリダイレクトできます。

phpの方法：

<?php

if (isset($_POST['login']) && isset($_POST['password'])) { header('Location: ' . urlencode($_POST['login']) . ':' . urlencode($_POST['password']) . '@domain.tld'); }
else
{
?>
<form method="post" onsubmit="javascript:document.location='http://' + $('login') + ':' + $('pass') + '@mydomain.tld';">
    <input type="text" name="login" id="login" />
    <input type="password" name="pass" id="pass" />
    <input type="submit" value="ok"/>
</form>

<?php
}
于 2010-06-20T11:36:17.540 に答える
4

http://user:password@host.comPerl または JavaScript を使用して、ユーザーを にリダイレクトできます。私は Perl を知らないので、JS を示します。

function submitted() {
    document.location = "http://" + document.getElementById("username").value + ":" + document.getElementById("password").value + "@host.com";
}

<form onSubmit="submitted">...blablabla...</form>

これはうまくいくはずです。唯一の問題は、URL にパスワードが表示されることです。

jQuery を使用した素晴らしい AJAX の方法:

$.ajax({
   'url': 'http://host.com/',
   //'otherSettings': 'othervalues',
   username: $("username").val(),
   password: $("password").val()
   },
   sucess: function(result) {
     alert('done');
   }
});

究極のPerlのやり方（だと思います）

$username = # somehow get username
$password = # somehow get password
use CGI;
my $query=new CGI;
print $query->redirect('http://host.com/');
于 2010-06-20T11:30:58.280 に答える
2

document.locationURL に username@password を指定して明示的にリダイレクトする方法により、Safari でフィッシング警告が表示されるという問題が発生しました。

代わりに、最初に基本的な認証ヘッダーが追加された URL に AJAX リクエストを作成し、URL にユーザー名/パスを指定せずに document.location をリダイレクトすると、うまく機能しました。

例

<script
  src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
    integrity="sha256-k2WSCIexGzOj3Euiig+TlR8gA0EmPjuc79OEeY5L45g="
      crossorigin="anonymous"></script>
<script>
$(document).ready(function() {
    $('form').submit(function() {
        $.ajax({
            url: 'https://site/collaborators/',
            username: $("#login").val(),
            password: $("#pass").val()
        }).done(function() {
            $("#error_msg").html("");
            document.location='https://site/collaborators/';
        }).fail(function(result) {
            console.error(result);
            $("#error_msg").html("Error logging in: "+result.statusText);
        });
        return false;
    });
});
</script>



<div id="error_msg" style="color: red"></div>

<form method="post">
    Username:
    <input type="text" name="login" id="login" />
    Password:
    <input type="password" name="pass" id="pass" />
    <input type="submit" value="Submit"/>
</form>

Safari のみの残念な注意事項です。ユーザー名とパスワードを間違って入力すると、別の標準の HTTP 基本認証ポップアップが作成されますが、これは、document.location にユーザー名/パスを含めるときに発生する大きな赤い「フィッシング警告」よりはましです。

ただし、ログイン資格情報が正しくない場合、Chrome にポップアップが重複することはありません

于 2017-07-17T14:36:48.610 に答える