从Golang向nextjs前端输出JSON API调用响应

hl0ma9xz  于 2023-02-26  发布在  Go
关注(0)|答案(2)|浏览(220)

我得到的错误是

Error: Error serializing `.username` returned from `getServerSideProps` in "/".
Reason: `undefined` cannot be serialized as JSON. Please use `null` or omit this value.

我的后端去是工作正常,我可以检查它的 Postman ,但我不能得到API的响应,从我的后端弹出任何反馈或代码改进是受欢迎的:主.去

package main

import (
    "encoding/json"
    "fmt"
    "log"
    "net/http"
)

func main() {
    handler := http.HandlerFunc(func(rw http.ResponseWriter, req *http.Request) {
        var resp []byte
        if req.URL.Path == "/status" {
            resp = []byte(`{"status": "ok"}`)
        } else if req.URL.Path == "/username" {
            resp = []byte(GetData())
            json.NewEncoder(rw).Encode(resp)
        } else {
            rw.WriteHeader(http.StatusNotFound)
            return
        }
        
        rw.Header().Set("Content-Type", "application/json")
        rw.Header().Set("Content-Length", fmt.Sprint(len(resp)))
        rw.Write(resp)
    })

    log.Println("Server is available at http://localhost:8000")
    log.Fatal(http.ListenAndServe(":8000", handler))
}

:data.go -此文件用作API cool json响应

package main

import (
    "fmt"
    "io/ioutil"
    "log"
    "net/http"
    "os"
)

func GetData( ) string {
    response, err := http.Get("http://pokeapi.co/api/v2/pokedex/kanto/")

    if err != nil {
        fmt.Print(err.Error())
        os.Exit(1)
    }

    responseData, err := ioutil.ReadAll(response.Body)
    if err != nil {
        log.Fatal(err)
    }
    fmt.Println(string(responseData))
return ""
}

索引.ts nextjs文件,我正在使用它作为前端

export async function getServerSideProps() {
  const {status} = await fetch("http://localhost:8000/status").then(x => x.json());
  const {username} = await fetch("http://localhost:8000/username").then(x => x.json());
  let res = await {username: JSON, status: JSON}; 
  console.log("res: ", res);
  return {
    props: {
      status: status,
      username: username,
    }
  }
}

export default function Home({status, username}: {status: any, username: any}) {
  return (
    <div className="">

      <main className="">
        <h1 className="">
          Welcome to <a href="https://nextjs.org">Next.js!</a>
        </h1>
        <div>Status is: {status}, your username is: {username}</div>
      </main>
    </div>
  )
}
aiazj4mn

aiazj4mn1#

GetData()当前返回一个
您可以更新GetData以返回[]byte

func GetData() ([]byte, error) {
    response, err := http.Get("http://pokeapi.co/api/v2/pokedex/kanto/")
    if err != nil {
        return nil, err
    }

    responseData, err := ioutil.ReadAll(response.Body)
    if err != nil {
        return nil, err
    }
    return responseData, nil
}

然后,您可以将/username分支更新为如下所示:

} else if req.URL.Path == "/username" {
    data, err := GetData()
    if err != nil {
        http.Error(rw, err.Error(), http.StatusInternalServerError)
        return
    }
    resp = data
}

您的数据已经是json的字节数,因此您不需要json.NewEncoder().Encode,您只需重新分配resp值并直接写入这些字节。
如果你确实需要写json,你不能在写头之前写响应编写器,所以如果你最终要写更复杂的响应体,你可能需要移动那些头。

uhry853o

uhry853o2#

您的GetData()函数仅返回“”
你可能应该创建一个struct来将json解组,然后返回已编组的json,或者你可以只传递字节。

相关问题