Question

我有一个使用bootstrap和jquery构建的静态html页面。其中有一个联系我们表单，我已将Ajax Post调用设置为我的django应用程序。

静态html页面托管在Windows服务器上，我的django应用程序托管在heroku上。 在ajax调用中，我通过jquery获取csrf令牌，但它返回null。

 $("#submit_button").click(function() {
        var from_name           = $("#Name").val();
        var from_email          = $("#email").val();
        var story_subject       = $("#Message").val();
        var csrftoken = getCookie('csrftoken');
        console.log(from_name);
        console.log(from_email);
        console.log(story_subject);
        console.log(csrftoken);
        $.ajax({
          type: 'POST',
          url: 'http://www.example.com/users/api-26/',
          useDefaultXhrHeader: false,
          crossDomain: true, // enable this
          dataType: 'jsonp',
          data: {
          'from_name': from_name,
          'from_email':from_email,
          'story_subject':story_subject,
          'csrfmiddlewaretoken': csrftoken
          },
          beforeSend: function(xhr) {
            xhr.setRequestHeader('X-CSRFToken', $.cookie('csrftoken')),
          },
          success: function (response_data) {
            var _result = JSON.parse(response_data);
            if(_result.status == 'True'){
              $('#myModal').hide();
              console.log("sent");
            }else{
              console.log(response.error.message);
            }
          },
          error: function(xhr, textStatus, thrownError) {
            console.log(xhr.status + ": " + xhr.responseText);
          }

        });
        return false;
      });

function getCookie(name) {
    var cookieValue = null;
    if (document.cookie && document.cookie != '') {
        var cookies = document.cookie.split(';');
        for (var i = 0; i < cookies.length; i++) {
            var cookie = cookies[i].trim();
            // Does this cookie string begin with the name we want?
            if (cookie.substring(0, name.length + 1) == (name + '=')) {
                cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                break;
            }
        }
    }
    return cookieValue;
}

和Django视图

@csrf_protect
@require_http_methods(["POST"])
def Contactus(request):

由于我遇到csrf令牌问题，是否有其他方法可以使此呼叫安全。

Answer 1

如前所述，您需要在端点上启用CORS（跨源资源共享）以执行Ajax操作或使用JSONP进行响应，我建议将其作为一种更简单的方法。

要启用CORS，您可以使用django-cors-headers包，其中包含一些选项，例如白名单。

跨越不同域应用程序的Ajax Post Form

1 个答案: