1

我在 Django 上有一个应用程序作为后端运行，另一个项目用于前端演示。对于使用 django-rest-framework 和身份验证方法是基于令牌的后端项目公开。

主项目核心在 127.0.0.1:8000 运行，演示项目在 127.0.0.1:8001 运行。现在，当我在 cms 上创建简单页面并将 HTML 表单作为下面提供的代码放置时，它可以正常工作并返回令牌。但问题是它重定向到 127.0.0.1:8000 因为 url 在表单操作中给出。

<form action="http://127.0.0.1:8000/api-token-auth/" class=" form-inline" method="post" id="loginform">

    <div id="div_id_username" class="clearfix control-group">
        <div class="controls">
            <Label class="span4">Username:</label>
            <input style="height: 25px" type="text" name="username" maxlength="100" autocapitalize="off" autocorrect="off" class="textinput textInput" id="id_username">
        </div>
    </div>
    <div id="div_id_password" class="clearfix control-group">
        <div class="controls">
            <Label class="span4">Password:</label>
            <input style="height: 25px" type="password" name="password" maxlength="100" autocapitalize="off" autocorrect="off" class="textinput textInput" id="id_password">
        </div>
    </div>
    <div class="form-actions-no-box">
         <button type="submit" title="Get Token">POST</button>
    </div>
</form>

提交后的回应是：

{'token':'fdsf4d6a4d6a4d64ad4ada54d65a4'}

现在，当我将此代码更改为 jquery Post 时：

代码：

<form action="http://127.0.0.1:8000/api-token-auth/" class=" form-inline" method="post" id="loginform">

    <div id="div_id_username" class="clearfix control-group">
        <div class="controls">
            <Label class="span4">Username:</label>
            <input style="height: 25px" type="text" name="username" maxlength="100" autocapitalize="off" autocorrect="off" class="textinput textInput" id="id_username">
        </div>
    </div>
    <div id="div_id_password" class="clearfix control-group">
        <div class="controls">
            <Label class="span4">Password:</label>
            <input style="height: 25px" type="password" name="password" maxlength="100" autocapitalize="off" autocorrect="off" class="textinput textInput" id="id_password">
        </div>
    </div>
    <div class="form-actions-no-box">
         <button type="button" title="Get Token" onclick="submitme('http://127.0.0.1:8000/api-token-auth/', 'loginform')">POST</button>
    </div>
</form>

和点击时调用的 Jquery 函数：

function submitme(url, formid)
{
    $.post(url, $("#" +formid).serialize())
            .done(function() { alert("second success"); })
            .fail(function(jqXHR, textStatus, errorThrown) { alert(textStatus); alert(errorThrown);})
            .always(function() { alert("finished"); }
        );
    location.reload();
}

它显示错误为 textStatus 但 errorThrown 为空。

*问题可能是jquery ajax post不支持跨域查询？

  • 任何解决方案？

我已经对此进行了更新，但仍然无法正常工作。

function submitme(url, formid)
{
    $.ajax({
        url: url,
        type: 'POST',
        data: $("#" +formid).serialize(),
        dataType: 'jsonp',
        jsonpCallback: 'callback',
        success: function(data) {
             alert(data);
        }
    });
}
function callback(data)
{
    alert(data);
}

还有其他解决方案吗？

4

2 回答 2

1

$.post不支持跨域请求。

使用获取请求

例子

$.ajax({
        url: url,
        type: 'GET',
        dataType: 'jsonp',
        jsonpCallback: 'callback',
        success: function(data) {
             alert(data)
        } 
    });
于 2013-07-09T08:20:05.223 回答
0

单击提交按钮后表单正在提交，导致ajax调用失败。用于preventDefault停止表单的默认操作。

HTML

<button type="button" title="Get Token" 
    onclick="submitme(event,'http://127.0.0.1:8000/api-token-auth/',
         'loginform')">POST</button>

Javascript

function submitme(e, url, formid)
{
    e.preventDefault();
    $.post(url, $("#" +formid).serialize())
            .done(function() { alert("second success"); })
            .fail(function(jqXHR, textStatus, errorThrown) { alert(textStatus); alert(errorThrown);})
            .always(function() { alert("finished"); }
        );
    location.reload();
}
于 2013-07-09T08:20:03.893 回答