Reactの本のログインメモ

この本「TypeScriptとReact/Next.jsでつくる実践Webアプリケーション開発」のログインをcurl叩きたかった。

TypeScriptとReact/Next.jsでつくる実践Webアプリケーション開発

ローカルでモックのjson-serverを起動していてのログインのコマンド。

curl -X POST -H "Content-Type: application/json" -d '{"username":"user", "password":"password"}' localhost:8000/auth/signin

React(Nuxt.js)のコードでここでパスが//がダブっていたのか、Herokuでbuildした方は 個々の解釈に差があってログインできなかった。

const signin = async (
  context: ApiContext,
  params: SigninParams,
): Promise<User> => {
  return await fetcher(
    `${context.apiRootUrl.replace(/\/$/g, '')}/auth/signin`,
    {

server.post('/auth/signin', (req, res) => {
  if (
    !(req.body['username'] === 'user' && req.body['password'] === 'password')
  ) {
    return res.status(401).json({
      message: 'Username or password are incorrect',
    });
  }

  res.cookie('token', 'dummy_token', {
    maxAge: 3600 * 1000,
    httpOnly: true,
  });
  res.status(201).json(authUser);
});

みたいなモックを、json-serverをHerokuに上げてるんだが、

API_BASE_URL=https://gihyo-json-server-shinriyo.herokuapp.com/
NEXT_PUBLIC_API_BASE_PATH=/api/proxy

API_BASE_URLのを/外したらいけた。

API_BASE_URL=https://gihyo-json-server-shinriyo.herokuapp.com
NEXT_PUBLIC_API_BASE_PATH=/api/proxy

普段の商品を掲載しているURLはなぜか問題ない。

const useSearch = ( で試しに

const path = `${context.apiRootUrl.replace(/\/$/g, '')}//products`

みたいに//とやってもいけたのでuseSWR経由なのでこっちはいけるのかも？