質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.37%
Echo(フレームワーク)

Echoは、Go言語で作られたフレームワーク。非常に軽量で、小~中規模のアプリ構成を想定した仕様になっています。公式ドキュメントが用意されており、初心者でも始めやすい点が特徴です。

Go

Go(golang)は、Googleで開発されたオープンソースのプログラミング言語です。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Q&A

解決済

1回答

2470閲覧

サーバーサイドから送信されたcookieをブラウザに設定したい

退会済みユーザー

退会済みユーザー

総合スコア0

Echo(フレームワーク)

Echoは、Go言語で作られたフレームワーク。非常に軽量で、小~中規模のアプリ構成を想定した仕様になっています。公式ドキュメントが用意されており、初心者でも始めやすい点が特徴です。

Go

Go(golang)は、Googleで開発されたオープンソースのプログラミング言語です。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

0グッド

0クリップ

投稿2021/11/12 16:22

編集2021/11/20 18:22

前提・実現したいこと

サーバーサイドはGoのecho、フロントエンドはReactを使ったアプリを開発しています。
サーバー側でcookieを生成・送信しているはずなのですが、ブラウザ側でcookieが保持されません。
どのように対処すれば良いのでしょうか。
サーバー側でcookieを生成し送信すれば、ブラウザに保持されるものと考えていたのですが、React(javascript)でも何らかの処理が必要になるのでしょうか。

ブラウザのネットワークタブで表示されたレスポンスヘッダー

Access-Control-Allow-Origin: * Content-Length: 0 Date: Fri, 12 Nov 2021 15:57:51 GMT Set-Cookie: token=xxxxxxxx; Path=/; Expires=Fri, 12 Nov 2021 16:57:51 GMT; HttpOnly; SameSite=Lax Vary: Origin

該当のソースコード

go

1package main 2 3"net/http" 4"time" 5"github.com/labstack/echo/v4" 6"github.com/labstack/echo/v4/middleware" 7 8func main() { 9 e := echo.New() 10 e.Use(middleware.CORS()) 11 e.POST("/login", Login) 12} 13 14func Login(c echo.Context) error { 15 // 省略 16 17 myCookie := &http.Cookie{ 18 Name: "token", 19 Value: "xxxxxxxx", 20 Path: "/", 21 Expires: time.Unix(3600, 0), 22 Secure: false, 23 HttpOnly: true, 24 SameSite: http.SameSiteLaxMode, 25 } 26 c.SetCookie(myCookie) 27 28 return c.NoContent(http.StatusOK) 29}

js

1import axios from 'axios'; 2import { configure } from 'axios-hooks' 3 4const axiosInstance = axios.create({ 5 baseURL: 'http://localhost:8080' 6}); 7configure({cache:false, axios:axiosInstance }); 8 9axios.post('login', { 10 email: 'xxx@example.com', 11 password: 'xxxxxxxxxx' 12}).then((res) => { 13}) 14.catch((err) => { 15}); 16

補足情報(FW/ツールのバージョンなど)

go 1.16
echo 4.4.0
axios 0.24.0
axios-hooks 2.7.0

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2021/11/12 22:10

> ブラウザ側でcookieが保持されません。 これはどのように確認しましたか?
退会済みユーザー

退会済みユーザー

2021/11/12 22:39 編集

chromeの開発者ツールのApplicationタブ→Cookiesから確認しました。 「Set-Cookie: token=xxxxxxxx」の内容が表示されるかと思ったのですが、何も表示されていないようです。
退会済みユーザー

退会済みユーザー

2021/11/13 00:27

確認方法は質問に追記しておいてください。
退会済みユーザー

退会済みユーザー

2021/11/20 18:26

ありがとうございます。 確かに、withCredentialsをgolangとreact双方に設定する必要がありました。
guest

回答1

0

ベストアンサー

レスポンスヘッダに Set-Cookie があるのに、ブラウザに保存されていないという事は削除されているのだと思います。
サーバかブラウザのどちらかの時計がズレていんではないでしょうか?

投稿2021/11/13 00:28

編集2021/11/13 00:32
退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2021/11/20 18:25

ありがとうございます。 時刻設定にloc, err := time.LoadLocation("Asia/Tokyo")、cors設定にAllowCredentials: trueを追加することで、cookieを取得することができました。
退会済みユーザー

退会済みユーザー

2021/11/20 20:19

> cors設定にAllowCredentials: 別の port にでもリクエストしていたんですかね? だとしたら、こっちですね。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.37%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問