Django 如何从 javascript 将数据添加到数据库

Question

我在 django 中创建了一个页面，在此页面上我创建了一个调用 JavaScript 函数的按钮，该函数又从 API 获取数据。我的代码的这一部分按预期工作，因为它将响应数据写入控制台。但是我似乎无法将数据插入到我在 django 中创建的模型中。

我不确定 python/javascript/models 是如何链接在一起的。

模型.py

from django.db import models


class Set(models.Model):
    scry_id = models.CharField(max_length=255)
    code = models.CharField(max_length=255)
    name = models.CharField(max_length=255)
    set_type = models.CharField(max_length=255)
    release_date = models.DateField()
    card_count = models.IntegerField()
    block_code = models.CharField(max_length=255, null=True)
    block_name = models.CharField(max_length=255, null=True)
    parent_set_code = models.CharField(max_length=255, null=True)
    digital_only = models.BooleanField(default=False)
    foil_only = models.BooleanField(default=False)
    nonfoil_only = models.BooleanField(default=False)
    icon = models.CharField(max_length=255)
    status = models.BooleanField(default=False)

    def __str__(self):
        return self.name

sets.html

{% extends "main/index.html "%}

{% block content %}
  <div class="background card">
    <div class="card-body">
      <button class="btn" id="setRefresh" style="border: 1px solid" onclick="setRefresh()"><i class="fas fa-sync"></i></button>

    </div>
  </div>
{% endblock%}

自定义.js

function setRefresh() {
  const Url="https://api.scryfall.com/sets";
  fetch(Url)
    .then(res => res.json())
    .then(data => obj = data.data)
    .then(() => obj.sort(function(a,b){return a.released_at.localeCompare(b.released_at);}))
    .then(() => {
      for (var i = 0; i < obj.length; i++) {
        //console.log(obj[i].name);
      }
    })
}

view.py

def sets(request):
    return render(request,
                  "main/sets.html",
                  {"Sets": Set.objects.all})

Answer 1

有两个零件缺失。首先，您需要有一个

url

来监听更改，然后您需要有一个

view

函数来设置数据。您需要对代码的

JS

部分进行一些更改。下面的示例可以解决这个问题，并且它也可以正常工作：

views.py：

def views_name(request):
    if not request.is_ajax():
        return HttpResponseBadRequest()
    try:
        if request.method == 'POST':
            post_id = request.POST.get('post')
            YourModel.objects.create(id=post_id)
    except Exception:   # pragma: no cover
        return HttpResponseBadRequest()

urls.py：

urlpatterns = [
    url(r'^whatever/$', views.views_name, name='whatever'),
]

自定义.js：

$(function () {
    $(".class-name").click(function () {
        var csrf = $(this).attr('csrf');
        var post = $(this).attr('page-id');
        $.ajax({
            url: '/whatever/',
            data: {
                'post': post,
                'csrfmiddlewaretoken': csrf
                },
            type: 'post',
            cache: false,
            success: function (returned_values) {
                // do whatever you want after success!                
                },
        });
    });
})

Answer 2

有两种方法

1. 方法1：检索数据后，将它们发送到您的django应用程序，而不是将它们记录到控制台中。有一个 django 视图，它处理来自包含数据的 js 代码的相应请求，然后将它们添加到数据库中。换句话说，您应该再次获取，但这次使用 post 请求获取您的 django 应用程序。

.您的视图应如下所示：

    from .models import Set
    from django.http import HttpResponse
    import json
    
    def save(request):
        data=json.loads(request.body)
        for entry in data:
            s = Set()
            s.scry_id=entry["scry_id"]
            #in the next lines you map entry fields to Set fields



            s.save()
         return HttpResponse("ok")

2. 方法2：您的按钮在单击时调用您的django应用程序，然后您的django应用程序从https://api.scryfall.com/sets本身检索数据，然后将它们保存到数据库。你的代码应该是这样的

   from .models import Set
   from django.http import HttpResponse
   import json
   import requests
   
   def save(request):
       response = requests.request("GET", "https://api.scryfall.com/sets")
       data=response.json()
       for entry in data:
           s = Set()
           s.scry_id=entry["scry_id"]
           #in the next lines you map entry fields to Set fields
   
   
   
           s.save()
        return HttpResponse("ok")
   

当然，无论哪种情况，都不要忘记将您的 urlconf 映射到保存视图