編集履歴

質問編集履歴

ファイルの修正

2020/11/09 02:12

投稿

anguraaaa

スコア21

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -8,8 +8,6 @@
 URLが /register?に飛んでしまいます
-vuexにてaxiosを使用してサーバーへリクエストを送っています。
 [画像](https://gyazo.com/2eeb56189eec7d7dcb86902e4c523d49)
@@ -222,310 +220,126 @@
-javascript/store/modules/users.js
+javascript/router/index.js
 ```
-import axios from '../../plugins/axios'
-const state = {
-  authUser: null
-}
-const getters =  {
-  authUser: state => state.authUser
-}
-const mutations = {
-  setUser: (state, user) => {
-    state.authUser = user
-  }
-}
-const actions = {
-  async loginUser({ commit }, user) {
-    const sessionsResponse = await axios.post('sessions', user)
-    localStorage.auth_token = sessionsResponse.data.token
-    axios.defaults.headers.common['Authorization'] = `Bearer ${localStorage.auth_token}`
-    const userResponce = await axios.get('users/me')
-    commit('setUser', userResponce.date)
-  },
-  logoutUser({ commit }) {
-    localStorage.removeItem('auth_token')
-    axios.defaults.headers.common['Authorization'] = ''
-    commit('setUser', null)
-  },
-  async fetchAuthUser({ commit, state }) {
-    if (!localStorage.auth_token) return null
-    if (state.authUser) return state.authUser
-    const userResponse = await axios.get('users/me')
-      .catch((err) => {
-        return null
-      })
-    if (!userResponse) return null
-    const authUser = userResponse.data
-    if (authUser) {
-      commit('setUser', authUser)
-      return authUser
+import Vue from 'vue'
+import Router from 'vue-router'
+import store from '../store'
+import ItemIndex from '../pages/item/index'
+import RegisterIndex from '../pages/register/index'
+import LoginIndex from '../pages/login/index'
+import DeleteListIndex from '../pages/delete_list/index'
+import NotFound from '../components/shared/NotFound'
+Vue.use(Router)
+const router = new Router({
+  mode: 'history',
+  routes: [
+    {
+      path: '/',
+      component: ItemIndex,
+      name: 'ItemIndex',
+      meta: { requiredAuth: true },
+    },
+    {
+      path: '/register',
+      component: RegisterIndex,
+      name: 'RegisterIndex',
+    },
+    {
+      path: '/login',
+      component: LoginIndex,
+      name: 'LoginIndex',
+    },
+    {
+      path: '/delete-list',
+      component: DeleteListIndex,
+      name: 'DeliteListIndex',
+      meta: { requiredAuth: true }
+    },
+    {
+      path: '*',
+      component: NotFound,
+      name: 'NotFound'
+    }
+  ],
+})
+router.beforeEach((to, from, next) => {
+  store.dispatch('users/fetchAuthUser').then((authUser) => {
+    if (to.matched.some(record => record.meta.requiredAuth) && !authUser) {
+      next({ name: 'LoginIndex' });
     } else {
-      commit('setUser', null)
-      return null
+      next();
     }
-  },
+  })
-}
+});
-export default {
+export default router
-  namespaced: true,
-  state,
-  getters,
-  mutations,
-  actions
-}
 ```
-controllers/api/users_controllers
-```
-class Api::UsersController < ApplicationController
-  before_action :authenticate!, only: %i[me]
-  def create
-    user = User.new(user_params)
-    if user.save
-      render json: user
-    else
-      render json: user.errors, status: :bad_request
-    end
-  end
-  def me
-    render json: current_user
-  end
-  private
-  def user_params
-    params.require(:user).permit(:email, :password, :password_confirmation)
-  end
-end
-```
-javascript/router/index.js
-```
-import Vue from 'vue'
-import Router from 'vue-router'
-import store from '../store'
-import ItemIndex from '../pages/item/index'
-import RegisterIndex from '../pages/register/index'
-import LoginIndex from '../pages/login/index'
-import DeleteListIndex from '../pages/delete_list/index'
-import NotFound from '../components/shared/NotFound'
-Vue.use(Router)
-const router = new Router({
-  mode: 'history',
-  routes: [
-    {
-      path: '/',
-      component: ItemIndex,
-      name: 'ItemIndex',
-      meta: { requiredAuth: true },
-    },
-    {
-      path: '/register',
-      component: RegisterIndex,
-      name: 'RegisterIndex',
-    },
-    {
-      path: '/login',
-      component: LoginIndex,
-      name: 'LoginIndex',
-    },
-    {
-      path: '/delete-list',
-      component: DeleteListIndex,
-      name: 'DeliteListIndex',
-      meta: { requiredAuth: true }
-    },
-    {
-      path: '*',
-      component: NotFound,
-      name: 'NotFound'
-    }
-  ],
-})
-router.beforeEach((to, from, next) => {
-  store.dispatch('users/fetchAuthUser').then((authUser) => {
-    if (to.matched.some(record => record.meta.requiredAuth) && !authUser) {
-      next({ name: 'LoginIndex' });
-    } else {
-      next();
-    }
-  })
-});
-export default router
-```
 ご教授お願いします

ファイルの追加

2020/11/09 02:12

投稿

anguraaaa

スコア21

test CHANGED Viewed

File without changes

test CHANGED Viewed

@@ -8,6 +8,8 @@
 URLが /register?に飛んでしまいます
+vuexにてaxiosを使用してサーバーへリクエストを送っています。
 [画像](https://gyazo.com/2eeb56189eec7d7dcb86902e4c523d49)
@@ -218,6 +220,136 @@
+javascript/store/modules/users.js
+```
+import axios from '../../plugins/axios'
+const state = {
+  authUser: null
+}
+const getters =  {
+  authUser: state => state.authUser
+}
+const mutations = {
+  setUser: (state, user) => {
+    state.authUser = user
+  }
+}
+const actions = {
+  async loginUser({ commit }, user) {
+    const sessionsResponse = await axios.post('sessions', user)
+    localStorage.auth_token = sessionsResponse.data.token
+    axios.defaults.headers.common['Authorization'] = `Bearer ${localStorage.auth_token}`
+    const userResponce = await axios.get('users/me')
+    commit('setUser', userResponce.date)
+  },
+  logoutUser({ commit }) {
+    localStorage.removeItem('auth_token')
+    axios.defaults.headers.common['Authorization'] = ''
+    commit('setUser', null)
+  },
+  async fetchAuthUser({ commit, state }) {
+    if (!localStorage.auth_token) return null
+    if (state.authUser) return state.authUser
+    const userResponse = await axios.get('users/me')
+      .catch((err) => {
+        return null
+      })
+    if (!userResponse) return null
+    const authUser = userResponse.data
+    if (authUser) {
+      commit('setUser', authUser)
+      return authUser
+    } else {
+      commit('setUser', null)
+      return null
+    }
+  },
+}
+export default {
+  namespaced: true,
+  state,
+  getters,
+  mutations,
+  actions
+}
+```
 controllers/api/users_controllers
 ```