我正在嘗試使用 TS/Express 服務器查詢外部 API。理想情況下,用戶會選擇一個產品。這將觸發對服務器的 GET 請求,然后服務器將向外部 API 提交查詢以獲取價格資訊。
這個專案只是為了好玩,為了學習,所以請原諒我的非基于類的方法。它將被重構為類,我只是想讓它暫時起作用。
// product.route.ts
import { Express } from "express"
import { getProductData } from "../controllers/product.controller"
// We don't need to write products into a DB if we can retrieve pricing via API
// We are not processing payments
// K.I.S.S.
const productRoute = (app: Express) => {
app.get("/api/v1/product", getProductData)
}
export { productRoute }
// product.controller.ts
const getProductData = async (req: Request, res: Response) => {
try {
const query: string = nike
// const { query } = req.body
const api: string = `https://api.exchange.shoes.com/products/${query}/stats`
const response: AxiosResponse = await axios.get(api)
let queryObj = await res.json(response.data)
return queryObj
} catch (error) {
res.json({ error })
}
}
export { getProductData }
當我執行上述操作時,它會起作用。但是,如果我想讓它動態化并在前端有一個表單,用戶可以在其中輸入“adidas”,我將如何將其傳遞到 api url 中?我以為我可以解構 req.body,并讓前端發送 {"product":"nike"},但是當我嘗試這樣做時,我收到了 404。
任何線索或想法?我幾乎認為我的路線應該是一個帖子而不是一個獲取,但是你應該只回傳一個 200 w/一個 POST。相反,您實際上不應該將 req.body 發送到 GET(您可能只是沒有那么有用)。
小編輯:或者,由于我不需要將憑據傳遞給此 API 端點,我是否應該將其留給前端并在后端忘記它。
uj5u.com熱心網友回復:
// product.controller.ts
const getProductData = async (req: Request, res: Response) => {
try {
const { product } = req.body
const api: string = `https://api.exchange.shoes.com/products/${product}/stats`
const response: AxiosResponse = await axios.get(api)
let queryObj = await res.json(response.data)
return queryObj
} catch (error) {
res.json({ error })
}
}
export { getProductData }
由于您決定發送帶有密鑰名稱的 req.bodyproduct來自您的前端
你應該改變
const {查詢} = req.body
進入
const {產品} = req.body
這意味著您必須將 url 上的動態變數更改product為query
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/370368.html
