主页 / 问题 / 1394226
Accepted
Dmitriy Begishev
Asked:2022-08-28 00:23:12 +0000 UTC2022-08-28 00:23:12 +0000 UTC

如何向服务器发送数据？

  • 772

使用 yandex.maps 时，我选择收货地址。如何将此地址发送到服务器并从服务器获取？

主要.py：

import os

from fastapi import FastAPI, Request, WebSocket
from fastapi.templating import Jinja2Templates
from fastapi.staticfiles import StaticFiles
from dotenv import load_dotenv

load_dotenv()

app = FastAPI()
app.mount("/static", StaticFiles(directory="static"), name="static")

templates = Jinja2Templates(directory="")

@app.get("/")
async def get(request: Request):
    return templates.TemplateResponse(
        "index.html",
        {"request": request, 
        "bella": os.getenv('SECRET_KEY'),
        "YANDEX_MAPS_API_KEY": os.getenv('YANDEX_MAPS_API_KEY'),}
        )

@app.websocket("/ws")
async def websocket_endpoint(websocket: WebSocket):
    await websocket.accept()
    while True:
        data = await websocket.receive_text()
        await websocket.send_text(f"Message text was: {data}")

索引.html：

<!DOCTYPE html>

<head>
    <title>Определение адреса клика на карте с помощью обратного геокодирования</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="static\css\styles.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
    <script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU&amp;apikey={{YANDEX_MAPS_API_KEY}}" type="text/javascript"></script>
    <script src="static/scripts/event_reverse_geocode.js" type="text/javascript"></script>
    
</head>
<body>
    <p class="header">Кликните по карте, чтобы указать адрес</p>
    <div id="map" style="width: 600px; height: 400px"></div>
    <div id="adress_box">Ищем доставку по адресу <span id="address_confirm"></span></div>
    <div id="shop-box"><p>shop-box</p></div>


<script> 
let response = await fetch(url);

if (address_confirm) { // если HTTP-статус в диапазоне 200-299
  // получаем тело ответа (см. про этот метод ниже)
  let json = await response.json();
  consol.log('response.ok')
} else {
  alert("Ошибка HTTP: " + response.status);
} 
</script>
</body>
</html>

我尝试根据FastAPI站点上的教程使用 WebSockets ，但该表单不适合我。点击地图并收到地址后，如何截取并发送到服务器？

javascript

1 个回答

  1. Best Answer

    向服务器发送数据：

    async function responseCoords(coords) {
    // функция responseCoords отправляет на сервер координаты доставки
    let response = await fetch('http://127.0.0.1:8080/', {
        method: 'POST', 
        headers: {
            'Content-Type': 'application/json;charset=utf-8'
        },
        body: JSON.stringify(coords)
    }) ; 
      markets = await response.json();
      rendering_markets_list(markets);//  эта функция отрисовывает магазины на странице
}

    服务器处理接收到的坐标发回结果

    @app.post('/')
async def add_address(request: Request):
    ''' Функция запрашивает доступные магазины с доставкой по
        указанному адресу
    '''    
    coords = await request.json()
    markets = sb_p.get_markets(lat = coords[0], lon = coords[1]) # скрипт обрабатывает координаты
    list_markets = markets
    return list_markets
    • 2

相关问题