JavaScript 프런트엔드에서 FastAPI 백엔드로 JSON 데이터를 올바르게 보내는 방법은 무엇입니까?

JavaScript 프런트엔드에서 FastAPI 백엔드로 JSON 데이터 게시

문제 이해

시도할 때 오류가 발생합니다. JavaScript 프런트엔드에서 FastAPI 백엔드로 JSON 페이로드를 전달합니다. 특히 차트를 생성하기 위해 클라이언트 입력 양식에서 "ethAddress" 값을 전달하려고 합니다.

문제 해결

이 오류는 FastAPI 때문에 발생합니다. 엔드포인트는 "ethAddress" 매개변수를 JSON 본문의 일부가 아닌 쿼리 매개변수로 예상합니다. 따라서 해결책은 JSON 페이로드를 처리하도록 FastAPI 엔드포인트를 수정하는 것입니다.

해결책: JSON 페이로드 처리

옵션 1: Pydantic 모델 사용

• 요청을 표현하는 Pydantic 모델 생성 body:

from pydantic import BaseModel

class EthAddressModel(BaseModel):
    eth_addr: str

• Pydantic 모델을 예상하도록 엔드포인트 수정:

@app.post('/ethAddress')
def add_eth_addr(item: EthAddressModel):
    return item

옵션 2: Body 매개변수 사용

• 직접 주석을 달고 "ethAddress" 매개변수를 본문 매개변수로 사용:

from fastapi import Body

@app.post('/ethAddress')
def add_eth_addr(eth_addr: str = Body()):
    return {'eth_addr': eth_addr}

옵션 3: Body(embed=True) 수정자 사용

• 전체 요청 본문을 단일로 구문 분석하는 Body(embed=True) 수정자 매개변수:

from fastapi import Body

@app.post('/ethAddress')
def add_eth_addr(eth_addr: str = Body(embed=True)):
    return {'eth_addr': eth_addr}

수정된 JavaScript 코드

JSON 본문을 올바르게 보내도록 JavaScript 가져오기 요청을 수정하세요.

fetch("http://localhost:8000/ethAddress", {
  method: "POST",
  headers: { "Content-Type": "application/json" },
  body: JSON.stringify({ eth_addr: "your_eth_address" }),
}).then(fetchEthAddresses);

결론

채용으로 이러한 솔루션 중 하나를 사용하면 FastAPI 백엔드를 활성화하여 JavaScript 프런트엔드에서 JSON 페이로드를 올바르게 수신하고 처리할 수 있으며, 차트 생성을 위해 "ethAddress" 값을 전달하고 사용할 수 있습니다.

위 내용은 JavaScript 프런트엔드에서 FastAPI 백엔드로 JSON 데이터를 올바르게 보내는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!