ti-enxame.com

Enviar POST dados no redirecionamento com JavaScript / jQuery?

Basicamente, o que eu quero fazer é enviar dados POST quando eu alterar o window.location, como se um usuário tivesse enviado um formulário e fosse para uma nova página. Preciso fazer isso porque preciso repassar um URL oculto e não posso simplesmente colocá-lo no URL como GET por razões estéticas.

Isso é o que eu tenho no momento, mas não envia dados POST.

if(user has not voted) {

    window.location = 'http://example.com/vote/' + Username;

}

Eu sei que você pode enviar POST dados com jQuery.post(), mas eu preciso que ele seja enviado com o novo window.location.

Então, para recapitular, preciso enviar o valor api_url via POST para http://example.com/vote/, enquanto envio o usuário para a mesma página ao mesmo tempo.


Para referência futura, acabei fazendo o seguinte:

if(user has not voted) {

    $('#inset_form').html('<form action="http://example.com/vote/' + Username + '" name="vote" method="post" style="display:none;"><input type="text" name="api_url" value="' + Return_URL + '" /></form>');

    document.forms['vote'].submit();

}
190
Josh Foskett

Construa e preencha um formulário method=POST action="http://example.com/vote" oculto e envie-o, em vez de usar window.location.

149
Kevin Reid

per @ resposta de Kevin-Reid, aqui está uma alternativa para o exemplo "Acabei fazendo o seguinte" que evita a necessidade de nomear e, em seguida, procurar o objeto de formulário novamente, construindo o formulário especificamente (usando jQuery) ..

var url = 'http://example.com/vote/' + Username;
var form = $('<form action="' + url + '" method="post">' +
  '<input type="text" name="api_url" value="' + Return_URL + '" />' +
  '</form>');
$('body').append(form);
form.submit();
197
tardate

Aqui está uma pequena função simples que pode ser aplicada em qualquer lugar, desde que você esteja usando o jQuery.

var redirect = 'http://www.website.com/page?id=23231';
$.redirectPost(redirect, {x: 'example', y: 'abc'});

// jquery extend function
$.extend(
{
    redirectPost: function(location, args)
    {
        var form = '';
        $.each( args, function( key, value ) {
            value = value.split('"').join('\"')
            form += '<input type="hidden" name="'+key+'" value="'+value+'">';
        });
        $('<form action="' + location + '" method="POST">' + form + '</form>').appendTo($(document.body)).submit();
    }
});
44
tfont

Se você estiver usando jQuery, há um plugin de redirecionamento que funciona com o método POST ou GET. Ele cria um formulário com entradas ocultas e envia para você. Um exemplo de como fazê-lo funcionar:

$.redirect('demo.php', {'arg1': 'value1', 'arg2': 'value2'});

Nota: Você pode passar os tipos de métodos GET ou POST como um terceiro parâmetro opcional; POST é o padrão.

24
Tom Sarduy

Aqui está um método que não usa jQuery. Eu usei para criar um bookmarklet, que verifica a página atual no validador w3-html.

var f = document.createElement('form');
f.action='http://validator.w3.org/check';
f.method='POST';
f.target='_blank';

var i=document.createElement('input');
i.type='hidden';
i.name='fragment';
i.value='<!DOCTYPE html>'+document.documentElement.outerHTML;
f.appendChild(i);

document.body.appendChild(f);
f.submit();
17
olee

As respostas aqui podem ser confusas, por isso vou dar-lhe um exemplo de código com o qual estou trabalhando.

Para começar, note que não existe nenhum parâmetro POST na função windows.location do script Java à qual você está se referindo.

Então você tem que ...

  1. Crie dinamicamente um formulário com um parâmetro POST.

  2. Colocar dinamicamente uma caixa de texto ou caixas de texto com seus valores desejados para postar

  3. Invoque o formulário de envio criado dinamicamente.

E para o exemplo.

     //---------- make sure to link to your jQuery library ----//

<script type="text/javascript" >

    var form = $(document.createElement('form'));
    $(form).attr("action", "test2.php");
    $(form).attr("method", "POST");
    $(form).css("display", "none");

    var input_employee_name = $("<input>")
    .attr("type", "text")
    .attr("name", "employee_name")
    .val("Peter" );
    $(form).append($(input_employee_name));


    var input_salary = $("<input>")
    .attr("type", "text")
    .attr("name", "salary")
    .val("1000" );
    $(form).append($(input_salary));

    form.appendTo( document.body );
    $(form).submit();

</script>

Se tudo for bem feito, você será redirecionado para test2.php e você pode usar POST para ler os valores passados ​​de employee_name e salário; será Peter e 1000 respectivamente.

Em test2.php você pode obter seus valores assim.

$employee_name = $_POST['employee_name'];
$salary = $_POST['salary'];

Escusado será dizer, certifique-se de higienizar seus valores passados.

11
webs

Função genérica para postar qualquer objeto JavaScript no URL fornecido.

function postAndRedirect(url, postData)
{
    var postFormStr = "<form method='POST' action='" + url + "'>\n";

    for (var key in postData)
    {
        if (postData.hasOwnProperty(key))
        {
            postFormStr += "<input type='hidden' name='" + key + "' value='" + postData[key] + "'></input>";
        }
    }

    postFormStr += "</form>";

    var formElement = $(postFormStr);

    $('body').append(formElement);
    $(formElement).submit();
}
7
therealrootuser

Isso é bastante útil para usar:

var myRedirect = function(redirectUrl, arg, value) {
  var form = $('<form action="' + redirectUrl + '" method="post">' +
  '<input type="hidden" name="'+ arg +'" value="' + value + '"></input>' + '</form>');
  $('body').append(form);
  $(form).submit();
};

então use como:

myRedirect("/yourRedirectingUrl", "arg", "argValue");
6
Ali John
var myRedirect = function(redirectUrl) {
var form = $('<form action="' + redirectUrl + '" method="post">' +
'<input type="hidden" name="parameter1" value="sample" />' +
'<input type="hidden" name="parameter2" value="Sample data 2" />' +
'</form>');
$('body').append(form);
$(form).submit();
};

Código encontrado em http://www.prowebguru.com/2013/10/send-post-data-while-redirecting-with-jquery/

Indo tentar esta e outras sugestões para o meu trabalho.

Existe alguma outra maneira de fazer o mesmo?

1
Rajesh

Você pode usar o atributo target para enviar o formulário com o redirecionamento do iframe. Sua tag de abertura de formulário seria algo assim:

method="post" action="http://some.url.com/form_action" target="_top"
0
joni jones