rails+vue(axios)でToken認証を試していて、ログイン認証後画面遷移を行いたいのですが、
遷移したいurlがvue-routerで定義したものではなくrailsのrouts.rbで定義しているものに遷移したいです。
今致し方なく、axios.post
で認証を行い200やresponseにtokenが返ってきた後、
window.location.href = 'http://localhost:3000/api/v1'
という様な形で画面遷移を行っていますが、
window.location.hrefですとrequest headerにtokenなどを含めてrequestを行えないので、
認証済みユーザーではない状態で遷移してしまいます。
その為、javascriptでrequest headerに値を含めてrailsで定義したurl(アクション)に遷移する方法を教えていただきたいです。
該当のコードは以下になります。
/* 現在のコード */ axios .post("http://localhost:3000/api/v1/auth/sign_in", { email: this.email, password: this.password, }) .then((response) => { localStorage.setItem("access-token", response.headers["access-token"]); localStorage.setItem("uid", response.headers["uid"]); localStorage.setItem("token-type", response.headers["token-type"]); localStorage.setItem("client", response.headers["client"]); localStorage.setItem("expiry", response.headers["expiry"]); window.location.href = 'http://localhost:3000/api/v1'; })
返ってきたレスポンスをweb storageに保存しており。
こちらの値を使いheaderに含め window.location.href = 'http://localhost:3000/api/v1';
から、何かに置き換えたいです。
調べてみたのですが、axios.getを使うとvue-routerを使う必要があるらしく、極力rails routerを使用したいのもあり、なかなかいい検索結果ができません。
どうしたらrequest headerに値を含めることができるでしょうか?
ご回答よろしくお願いします。
あなたの回答
tips
プレビュー