500 (Internal Server Error)とUncaught (in promise) Error: Request failed with status code 500

前提・実現したいこと

GoとVueでのspa開発で、動作確認の際に2つの500番エラーがでてしまいました。

発生している問題・エラーメッセージ

spread.js:25 GET http://127.0.0.1:8080/fetchAllProducts 500 (Internal Server Error)
(anonymous) @ spread.js:25
e.exports @ spread.js:25
e.exports @ spread.js:25
Promise.then (async)
r.request @ spread.js:25
r.<computed> @ spread.js:25
(anonymous) @ spread.js:25
doFetchAllProducts @ vueProduct.js:57
boundFn @ vue.js:197
created @ vueProduct.js:50
callHook @ vue.js:2895
Vue._init @ vue.js:4547
Vue$3 @ vue.js:4646
(anonymous) @ vueProduct.js:1

Uncaught (in promise) Error: Request failed with status code 500
    at e.exports (spread.js:25)
    at e.exports (spread.js:25)
    at XMLHttpRequest.l.onreadystatechange (spread.js:25)
e.exports @ spread.js:25
e.exports @ spread.js:25
l.onreadystatechange @ spread.js:25
Promise.then (async)
doFetchAllProducts @ vueProduct.js:58
boundFn @ vue.js:197
created @ vueProduct.js:50
callHook @ vue.js:2895
Vue._init @ vue.js:4547
Vue$3 @ vue.js:4646
(anonymous) @ vueProduct.js:1

該当のソースコード

Vue
1new Vue({
2    // 「el」プロパティーで、Vueの表示を反映する場所＝HTML要素のセレクター（id）を定義
3    el: '#app',
4
5    // data オブジェクトのプロパティの値を変更すると、ビューが反応し、新しい値に一致するように更新
6    data: {
7        // 商品情報
8        products: [],
9        // 品名
10        productName: '',
11        // メモ
12        productMemo: '',
13        // 商品情報の状態
14        current: -1,
15        // 商品情報の状態一覧
16        options: [
17            { value: -1, label: 'すべて' },
18            { value:  0, label: '未購入' },
19            { value:  1, label: '購入済' }
20        ],
21        // true：入力済・false：未入力
22        isEntered: false
23    },
24
25    // 算出プロパティ
26    computed: {
27        // 商品情報の状態一覧を表示する
28        labels() {
29            return this.options.reduce(function (a, b) {
30                return Object.assign(a, { [b.value]: b.label })
31            }, {})
32        },
33        // 表示対象の商品情報を返却する
34        computedProducts() {
35          return this.products.filter(function (el) {
36            var option = this.current < 0 ? true : this.current === el.state
37            return option
38          }, this)
39        },
40        // 入力チェック
41        validate() {
42            var isEnteredProductName = 0 < this.productName.length
43            this.isEntered = isEnteredProductName
44            return isEnteredProductName
45        }
46    },
47
48    // インスタンス作成時の処理
49    created: function() {
50        this.doFetchAllProducts()
51    },
52
53    // メソッド定義
54    methods: {
55        // 全ての商品情報を取得する
56        doFetchAllProducts() {
57            axios.get('/fetchAllProducts')
58            .then(response => {
59                if (response.status != 200) {
60                    throw new Error('レスポンスエラー')
61                } else {
62                    var resultProducts = response.data
63
64                    // サーバから取得した商品情報をdataに設定する
65                    this.products = resultProducts
66                }
67            })
68        },
69        // １つの商品情報を取得する
70        doFetchProduct(product) {
71            axios.get('/fetchProduct', {
72                params: {
73                    productID: product.id
74                }
75            })
76            .then(response => {
77                if (response.status != 200) {
78                    throw new Error('レスポンスエラー')
79                } else {
80                    var resultProduct = response.data
81
82                    // 選択された商品情報のインデックスを取得する
83                    var index = this.products.indexOf(product)
84
85                    // spliceを使うとdataプロパティの配列の要素をリアクティブに変更できる
86                    this.products.splice(index, 1, resultProduct[0])
87                }
88            })
89        },
90        // 商品情報を登録する
91        doAddProduct() {
92            // サーバへ送信するパラメータ
93            const params = new URLSearchParams();
94            params.append('productName', this.productName)
95            params.append('productMemo', this.productMemo)
96
97            axios.post('/addProduct', params)
98            .then(response => {
99                if (response.status != 200) {
100                    throw new Error('レスポンスエラー')
101                } else {
102                    // 商品情報を取得する
103                    this.doFetchAllProducts()
104
105                    // 入力値を初期化する
106                    this.initInputValue()
107                }
108            })
109        },
110        // 商品情報の状態を変更する
111        doChangeProductState(product) {
112            // サーバへ送信するパラメータ
113            const params = new URLSearchParams();
114            params.append('productID', product.id)
115            params.append('productState', product.state)
116
117            axios.post('/changeStateProduct', params)
118            .then(response => {
119                if (response.status != 200) {
120                    throw new Error('レスポンスエラー')
121                } else {
122                    // 商品情報を取得する
123                    this.doFetchProduct(product)
124                }
125            })
126        },
127        // 商品情報を削除する
128        doDeleteProduct(product) {
129            // サーバへ送信するパラメータ
130            const params = new URLSearchParams();
131            params.append('productID', product.id)
132
133            axios.post('/deleteProduct', params)
134            .then(response => {
135                if (response.status != 200) {
136                    throw new Error('レスポンスエラー')
137                } else {
138                    // 商品情報を取得する
139                    this.doFetchAllProducts()
140                }
141            })
142        },
143        // 入力値を初期化する
144        initInputValue() {
145            this.current = -1
146            this.productName = ''
147            this.productMemo = ''
148        }
149    }
150})
151

Go
1package controller
2
3import (
4    // 文字列と基本データ型の変換パッケージ
5    strconv "strconv"
6
7    // Gin
8    "github.com/gin-gonic/gin"
9
10    // エンティティ(データベースのテーブルの行に対応)
11    entity "github.com/noa-1129/golang_spa/models/entity"
12
13    // DBアクセス用モジュール
14    db "github.com/noa-1129/golang_spa/models/db"
15)
16
17// 商品の購入状態を定義
18const (
19    // NotPurchased は 未購入
20    NotPurchased = 0
21
22    // Purchased は 購入済
23    Purchased = 1
24)
25
26// FetchAllProducts は 全ての商品情報を取得する
27func FetchAllProducts(c *gin.Context) {
28    resultProducts := db.FindAllProducts()
29
30    // URLへのアクセスに対してJSONを返す
31    c.JSON(200, resultProducts)
32}
33
34// FindProduct は 指定したIDの商品情報を取得する
35func FindProduct(c *gin.Context) {
36    productIDStr := c.Query("productID")
37
38    productID, _ := strconv.Atoi(productIDStr)
39
40    resultProduct := db.FindProduct(productID)
41
42    // URLへのアクセスに対してJSONを返す
43    c.JSON(200, resultProduct)
44}
45
46// AddProduct は 商品をDBへ登録する
47func AddProduct(c *gin.Context) {
48    productName := c.PostForm("productName")
49    productMemo := c.PostForm("productMemo")
50
51    var product = entity.Product{
52        Name:  productName,
53        Memo:  productMemo,
54        State: NotPurchased,
55    }
56
57    db.InsertProduct(&product)
58}
59
60// ChangeStateProduct は 商品情報の状態を変更する
61func ChangeStateProduct(c *gin.Context) {
62    reqProductID := c.PostForm("productID")
63    reqProductState := c.PostForm("productState")
64
65    productID, _ := strconv.Atoi(reqProductID)
66    productState, _ := strconv.Atoi(reqProductState)
67    changeState := NotPurchased
68
69    // 商品状態が未購入の場合
70    if productState == NotPurchased {
71        changeState = Purchased
72    } else {
73        changeState = NotPurchased
74    }
75
76    db.UpdateStateProduct(productID, changeState)
77}
78
79// DeleteProduct は 商品情報をDBから削除する
80func DeleteProduct(c *gin.Context) {
81    productIDStr := c.PostForm("productID")
82
83    productID, _ := strconv.Atoi(productIDStr)
84
85    db.DeleteProduct(productID)
86}
87

試したこと

・既存のコードのコピペ

throw new Error('レスポンスエラー')

↓

.catch(error => {
      console.error(error);

に変えてみたり

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

・go version go1.15.2 darwin/amd64

・vue@2.6.12

行動規範の内容に同意します

回答1件

自己解決

ターミナルにエラーが出力されており、そちらを確認したら
Error 1045: Access denied for user 'root'@'localhost' (using password: YES)
Error 1049: Unknown database 'shopping'
db接続のパスワードをrootにしていたので自身のrootパスワードに変更。
shoppinというデータベースがないとのことなので、create database shoppingで作成することで解決できました！

今回はdb接続のコードに問題があり、データベースは自動作成されるものだと思ってしまっていました????

投稿2020/10/17 06:19

noa-1129

総合スコア25