skillup

技術ブログ

JavaScript

vue-routerと認証など

投稿日:2022年3月13日 更新日:

vue-routerで簡単な認証に関する処理など。

例によって

https://github.com/umanari145/admin_tool

を題材に。

サーバーサイドとのルーティング

サーバー側のルーティングを制御していないとURLを直で叩いても404になることに注意。

ちなみにlaravelのルーティングであれば、

でOK。要はこれより上部で拾えなかったら全てここにくる(welcomeはvueを読み込んだbladeという意味)

vue-router×vuex

https://github.com/umanari145/admin_tool/blob/main/resources/js/router/index.js

  • 基本的にログインに関するユーザー情報の変数はvuexで管理することになると思うのでvuexが必須
  • 認証と非認証ページをつかいわける(上のソースでいうと meta:{requireAuth:true} )
  • version3と4で呼び出し方が少し変わるので注意。

-JavaScript
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

AngularJSでのinfite_scroll

今回もAngularネタです。 一般的なデータの一覧画面ではページャーをボタンで移動するのではなく、スクロールするだけで次々とアクセスできるようになるのが一般的でしょう。 facebookやtwitt …

no image

オートコンプリートのプラグイン

最近だとフォームの入力画面で最初の数文字を入力すると候補を予測して表示してくれる機能(=オートコンプリート)があることが一般的ですね。 いろいろなプラグインがありますが、今回お勧めしたいのはBoots …

no image

複数の非同期処理終了後(when&Promise.all)

JavaScriptで複数の非同期処理(例:API)を走らせて、その非同期処理が全て終わった後で、何らかの処理をしたい時について。 Contents1 when2 Promise_all when j …

no image

vue-routerについて

vueでのルーティングに関して。 Vueの場合、いわゆるSPA(シングルページアプリケーション)という用途で使われることがあると思います。 ただその場合でも擬似的なルーティング(URLの切り替えなどに …

no image

JavaScriptのコールバック関数について

JavaScriptでのコールバック関数について。 たまにでてきますが、これまた慣れないと手間取ります。 コールバック関数に関してまとめると以下のような感じでしょうか。 ある関数(func1)の引数と …

アーカイブ