平時jq ajax跑的通的post請求，換fastapi就報HTTP 422 Unprocessable Entity

首先打開chrome開發者工具一調試，會發現jq的ajax請求類型是標準的封裝好的xhr請求，並不是post。這樣一來fastapi框架就不認爲這個ajax請求所傳過來的參數是post，這樣一來，後耑接口邏輯講也就認爲沒有合法的參數傳進來。

現象就是，比如你有2個參數，分別是param_a, param_b，後耑除了返回422報錯之外，還會給你以下的響應實體

{
    "detail": [{
        "type": "missing",
        "loc": [
            ...,
            "param_a"  // <---找不到param_a
        ]
        "msg": "Field required",
        "input": "null"
        },
        {
        "type": "missing",
        "loc": [
            ...,
            "param_b"  // <---找不到param_b
        ]
        "msg": "Field required",
        "input": "null"
        },
    ]
}

意思是你一個參數都沒傳進來，怎麽處理呢？

在fastapi後耑邏輯上，把方法參數寫成類似以下的樣子：

from fastapi import Cookie, Form

@router.post("/pythonapi/foo")
async def foo(
    param_a: int = Form(...),  # 注意這裡爲參數param_a
    param_b: str = Form(...),  #  注意這裡爲參數param_b
    # some_cookie_a: str = Cookie('cookie_key_a')  # 這裡不用管, 我隨便寫的
):

後面的= Form(...) 意思就是用Form表單的格式讀取，別忘了標頭import一下Form

前耑ajax要做一下標注

contentType: 'application/x-www-form-urlencoded'

舉例說明

$.ajax({
    url: "/pythonapi/foo",
    type: 'POST',
    data: {
        param_a: someInt,
        param_b: someText,
    },
    contentType:'application/x-www-form-urlencoded',
    dataType: 'JSON', success: (r) => {
        // todo
    }, complete: () => {
        // todo
    }
});

完結撒花