Ответ 1

Я думаю, что простой 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 или так. Я использовал функцию $(), чтобы сделать код короче. Вот реализация, которая не работает в каждом браузере. Опять же, посмотрите throw jQuery для кросс-браузера.

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

В противном случае вы можете использовать php и перенаправить пользователя с расположением заголовка.

php way:

<?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
}

Ответ 2

Вы можете перенаправить пользователя на http://user:[email protected] с помощью Perl или с помощью JavaScript. Я не знаю Perl, поэтому я покажу вам JS:

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

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

Это должно сработать. Единственная проблема заключается в том, что это показывает пароль в URL-адресе.

Ужасный способ AJAX с использованием jQuery:

$.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/');

Ответ 3

Метод явного перенаправления document.location с именем пользователя @password в URL-адресе вызвал у меня некоторые проблемы с Safari, дающими фишинг-предупреждение.

Если я вместо этого сначала сделаю запрос AJAX к URL-адресу с добавленными основными заголовками auth, а затем перенаправлю document.location без имени пользователя/прохода в URL-адресе, тогда он работал лучше для меня

Пример

<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://efishgenomics.integrativebiology.msu.edu/collaborators/',
            username: $("#login").val(),
            password: $("#pass").val()
        }).done(function() {
            $("#error_msg").html("");
            document.location='https://efishgenomics.integrativebiology.msu.edu/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 basic, но это лучше, чем большое красное "предупреждение о фишинге", которое возникает, когда вы делаете document.location include имя пользователя/передача

В Chrome нет дублированного всплывающего окна, если учетные данные неверны, хотя

Ответ 4

Это простое решение для plug & play;-). Будет работать для любого домена (и HTTPS тоже):

<script>
function submitAuthForm() {
    var login = document.getElementById('login').value;
    var pass = document.getElementById('pass').value;
    location = location.href.replace('://', '://' + encodeURIComponent(login) + ':' + encodeURIComponent(pass) + '@');
    // might be required to reload on Firefox (FF shows confirmation dialog)
    setTimeout(function(){
        location.reload(true);
    }, 5000);
}
</script>
<form method="get" onsubmit="submitAuthForm(); return false">
    <input type="text" id="login" />
    <input type="password" id="pass" />
    <input type="submit" value="OK" />
</form>

Вы можете отказаться от этого в своем документе с ошибкой 401.

Обратите внимание, что return false требуется, чтобы страница не перезагружалась дважды.