FastAPI 백엔드로 JSON 또는 Form 데이터를 Axios JavaScript HTTP 요청을 통해 보는 방법은 무엇인가요?

내가 다음과 같이 구성된 FastAPI 백엔드를 가지고 있습니다:

@app.post(/engines/completions)
async def read_completions(
    # engine_id:str,
    prompt: Optional[str] = None,
    max_tokens: Optional[int] = 16,
    temperature: Optional[float] = 1.0,
    top_p: Optional[float] = 1.0,
    top_k: Optional[int] = 40,
    n: Optional[int] = 1,
    stream: Optional[bool] = False,
    logprobs: Optional[int] = None,
    echo: Optional[bool] = False,
    stop: Optional[list] = None,
    presence_penalty: Optional[float] = 0.0001,
    frequency_penalty: Optional[float] = 0.0001,
    best_of: Optional[int] = 1,
    recursive_depth: Optional[int] = 0,
    recursive_refresh: Optional[int] = 0,
    logit_bias: Optional[Dict[str, float]] = None,
):

그리고 Axios 요청은 다음과 같이 구성되어 있습니다:

let stop = stuff;
let prompt =test;
let url = http://localhost:8000/engines/completions;
const options = {
  method: POST,
  headers: { content-type: application/json},
  timeout: 2000000,
  body: {stop, prompt},
  url,
};
axios(options)

요청은 442 오류 없이 통과되지만, prompt 및 stop 속성은 read_completions 함수에서 None이 되는 것 같습니다. 무엇이 잘못되었을까요?

답변 1

axios의 옵션에서 body 대신 data를 사용하세요.

axios 문서의 요청 구성 (Request Config)을 참조하세요.

답변 2

Axios는 JavaScript를 통해 HTTP 요청을 처리하는 데 사용되는 라이브러리입니다. 이 라이브러리는 FastAPI 백엔드로 JSON 또는 Form 데이터를 보내는 데 매우 유용합니다. FastAPI는 Python으로 작성된 빠른 웹 프레임워크로, 데이터를 처리하고 응답하는 데 사용됩니다. 이 문서에서는 Axios를 사용하여 FastAPI 백엔드에 JSON 또는 Form 데이터를 전송하는 방법에 대해 설명하겠습니다.
Axios를 사용하여 FastAPI에 데이터를 보내기 위해, 먼저 Axios를 설치해야 합니다. 다음 명령을 사용하여 프로젝트에 Axios를 설치할 수 있습니다:
```
npm install axios
```
이제 Axios를 사용하여 FastAPI로 데이터를 전송하는 방법에 대해 알아보겠습니다.
JSON 데이터를 FastAPI에 보내기 위해서는 다음과 같이 Axios 요청을 설정해야 합니다:
```javascript
import axios from 'axios';
const sendData = async () => {
const data = {
name: 'John Doe',
age: 25,
};
try {
const response = await axios.post('http://fastapi-backend.com/json-endpoint', data);
console.log(response.data);
} catch (error) {
console.error(error);
}
};
```
위의 코드에서는 Axios `post()` 메서드를 사용하여 FastAPI 백엔드에 POST 요청을 보냅니다. 데이터는 JavaScript 객체 형태로 생성되고 요청과 함께 전송됩니다. FastAPI 백엔드의 JSON 엔드포인트 URL을 제공해야 합니다. 응답은 `response.data`를 통해 사용할 수 있습니다.
Form 데이터를 FastAPI에 보내기 위해서는 다음과 같이 Axios 요청을 설정해야 합니다:
```javascript
import axios from 'axios';
const sendData = async () => {
const data = new FormData();
data.append('name', 'John Doe');
data.append('age', '25');
try {
const response = await axios.post('http://fastapi-backend.com/form-endpoint', data);
console.log(response.data);
} catch (error) {
console.error(error);
}
};
```
위의 코드에서는 Axios `post()` 메서드를 사용하여 FastAPI 백엔드에 POST 요청을 보냅니다. 데이터는 `FormData` 객체를 사용하여 생성됩니다. `append()` 메서드를 사용하여 각 필드와 해당 값들을 추가합니다. FastAPI 백엔드의 Form 데이터 엔드포인트 URL을 제공해야 합니다. 응답은 `response.data`를 통해 사용할 수 있습니다.
Axios를 사용하여 FastAPI의 백엔드에 JSON 또는 Form 데이터를 전송하는 방법에 대해 알아보았습니다. 이를 통해 클라이언트 사이드 JavaScript에서 데이터를 보낼 수 있는 기본적인 개념을 이해할 수 있습니다. 이는 웹 응용 프로그램을 개발하는 데 매우 유용한 기술입니다.