问[ Python ][Javascript]无法知道如何从NEXTjs网页GUI向Python后端发送API调用

EN

#!/usr/bin/env python
# coding=utf-8


import time
import falcon
import json


class Resource(object):

    def on_post(self, req, resp, **kwargs):
        request_body = req.media

        print('POST Request: {}'.format(req))
        print('Request body: {}'.format(request_body))

        start = time.time()

        resp.body = json.dumps({
            'count_identical_pairs': count_identical_pairs(request_body),
            'computation_time': int((time.time() - start) * 1000)
        })


def count_identical_pairs(integers_array):
    total = 0
    count = dict()

    # Type checking
    if not isinstance(integers_array, list):
        return -1

    # Check if N is within the range [0..100,000]
    if len(integers_array) > 100000:
        return -2

    for integer in integers_array:

        # Check if each element of the array is within the range [−1,000,000,000..1,000,000,000]
        if integer not in range(-1000000000, 1000000000):
            return -3

        if str(integer) not in count:
            count[str(integer)] = 1
        else:
            count[str(integer)] += 1

    for key, value in count.items():
        total += value * (value - 1) / 2

    return total


api = application = falcon.API()

api.add_route('/count_identical_pairs', Resource())

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';

class Index extends React.Component {
    constructor() {
        super();
        this.state = {
            input_array: [],
        };
        this.onSubmit = this.onSubmit.bind(this);
        this.myHeaders = new Headers();
    }

    onChange = evt => {
        // This triggers everytime the input is changed
        this.setState({
            [evt.target.name]: evt.target.value,
        });
    };

    onSubmit = evt => {
        evt.preventDefault();
        console.log('this.state.input_array = ' + this.state.input_array);
        console.log('JSON.stringify(this.state.input_array) = ' + JSON.stringify(this.state.input_array));
        // Making a post request with the fetch API
        // Test payload [1, 7, 7, 5, 7, 5, 6, 1]
        fetch('http://vps638342.ovh.net:8080/count_identical_pairs', {
            method: 'POST',
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json; charset=utf-8'
            },
            mode: 'no-cors',    // Security hazard?
            body: JSON.stringify(this.state.input_array),
            redirect: 'follow'
        })
        .then(response => response.text())
        .then(data => console.log('Data: ' + data))
        .catch(error => console.log('Error: ' + error))
    };

    render() {
        return (
            <form onSubmit={this.onSubmit} >
                <input
                    name="input_array"
                    type="text"
                    id="name"
                    value={this.state.input_array}
                    onChange={this.onChange}>
                </input>
                <input type="submit" />
            </form>
        );
    };
}

ReactDOM.render(<Index />, document.getElementById("root"));