KYO

NuxtからLaravelに画像ファイルをアップロードする個人的メモ

2019年2月18日 Nuxt.js , ,

今回の内容は、開発中の物に対する個人的なメモです。

 

fileに対してv-bindは使えないというのはvue界隈では有名なお話なので、変更があった際にファイルを設定してあげるようにするのが定石です。

こんな感じにしてあげるとfile情報をaxiosなりでブチ込めるようになります。

ただ、この状態で普通にやるとLaravel側でうまく取り込めませんでした。

なんか送られてくるものをfileとして認識していないのか?色々試したけどうまくいきませんでした。

そこで送る際に一度FormDataにしてあげることでうまくいきました

これでやるとしっかりlaravelのほうでも処理できました。

この例でいうと、アップロードした画像をpublicフォルダのimagesフォルダに格納してくれます。
ここでかなり時間くってしまった。。。

 


関連記事

auth-moduleの挙動がよくわからんで泥沼にはまっている

2019年3月17日

Nuxt.jsとLaravelでWebアプリを作っています。 ログイン機能にauth-moduleを使っています。 というか、本当にこいつが原因なのかも不明なのですが、多分こいつなんです。 結論からいうと、Trying to get property of non-object というあるあるエラーが起きてしまうのですが、 バックエンドが...

Nuxt.jsをサーバーで動かす時の設定

2018年11月28日

npm run generateでdistフォルダが出来上がるが、それをサーバーに置くとどうなるのか実験しました。 とりあえず何も考えずに超絶シンプルなものを作る $ vue init nuxt-community/starter-template sample $ cd sample $ npm install $ npm run de...

Nuxt.jsでaxiosとvuexを使ってみる

2018年11月27日

最近Vue.jsが面白くて勉強して、Nuxt.jsも勉強し始めたのでメモします。   キーワードを入力するとQiitaから関連する記事を取得してきて表示するというシンプルなサイトを作ってみました。 ただ作るのはあれなんで、厨二病っぽいデザインにしました これでスタバにいってドヤ顔しましょう 英語はよくわかんないので強そうなワード...