Django 并在不同视图中将请求发布到外部 API

Question

So i want to create a Django App where my users can post data through a form and make a post request to an external API, but getting the response in the same page/view

For example, i have my view

class Home(TemplateView):
    template_name: 'home/index.html'

And i have my index.html:

<form id="formdata" >
    <select id="options">
        <option id="sku">Option 1</option>
        <option id="sku2">Option 2</option>
    </select>    

    <input name="number" type="text"  id="number">

    <select id="price">
        <option id="price1">$5</option>
        <option id="price2">%10</option>
    </select>    

    <button type="button" data-loading-text="enviando..." onclick="submitInfo()">Send</button>
</form>

Let's ignore the fact HTML may be wrong, it is a basic structure of a form with selects and input field, but note that i need to pass "product", "number" and "price" as parameters in the post request.

The thing is that when the user clics on the submit button, they make a post request to an external api, i know i can do int with JavaScript using fetch, but the thing is that i need to pass my personal Token Key in the body params, also i'd like to hide the real api url hiding it with an url of my website, for example: www.myurl.com/my-api-call

So i'm thinking about creating a "external_api_view" with post request, something like this:

import requests
import time
from rest_framework import status
from rest_framework.response import Response

def external_api_view(request):
    if request.method == "POST":
        attempt_num = 0  # keep track of how many times we've retried
        while attempt_num < MAX_RETRIES:
            url = 'www.apiexternal.com/endpoint'
            payload = {'Token':'My_Secret_Token','product':'product_select_in_form','price':'price_selected_in_form'}
            response = requests.post(url, data = payload)
            if r.status_code == 200:
                data = r.json()
                return Response(data, status=status.HTTP_200_OK)
            else:
                attempt_num += 1
                # You can probably use a logger to log the error here
                time.sleep(5)  # Wait for 5 seconds before re-trying
        return Response({"error": "Request failed"}, status=r.status_code)
    else:
        return Response({"error": "Method not allowed"}, status=status.HTTP_400_BAD_REQUEST)

But not i have the problem that i don't know how to pass inputs of the form into that view, so i can make the post request and get the response through javascript on my index.html file (adding obviously the javascript needed)

I don't even know if this is possible, i was thinking in doing something like so with rest framework, but also i have no idea how to

Any help would be really appreciated:)

Answer 1

First add an action attribute and method attribute to your form. Then add a csrf token for security. Also add name attributes to the select elements.

<form method="post" action="/external" id="formdata" >
  {% csrf_token %}
<select name="options" id="options">
    <option id="sku">Option 1</option>
    <option id="sku2">Option 2</option>
</select>    

<input name="number" type="text"  id="number">

<select name="price" id="price">
    <option id="price1">$5</option>
    <option id="price2">%10</option>
</select>    

<button type="button" data-loading-text="enviando..." onclick="submitInfo()">Send</button>

Next add the url path for the action you added. urls.py:

from django.urls import path
from . import views

app_name = "main"   

urlpatterns = [
    ...
    path("external", views.external_api_view, name="home")

]

Then get the input values in views.py

import requests
import time
from rest_framework import status
from rest_framework.response import Response

def external_api_view(request):
    if request.method == "POST":
        attempt_num = 0  # keep track of how many times we've retried
        while attempt_num < MAX_RETRIES:
            url = 'www.apiexternal.com/endpoint'
            payload = {'Token':'My_Secret_Token','product':request.POST.get("options"),'price':request.POST.get("price")}
            r = requests.post(url, data = payload)
            if r.status_code == 200:
                data = r.json()
                return Response(data, status=status.HTTP_200_OK)
            else:
                attempt_num += 1
                # You can probably use a logger to log the error here
                time.sleep(5)  # Wait for 5 seconds before re-trying
        return Response({"error": "Request failed"}, status=r.status_code)
    else:
        return Response({"error": "Method not allowed"}, status=status.HTTP_400_BAD_REQUEST)