質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

Q&A

解決済

1回答

904閲覧

(Laravel + Vue.js)AJAX(axios)を使ったDB登録ができない

morguri

総合スコア46

Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

0グッド

0クリップ

投稿2018/11/06 03:31

こんにちは。
現在、Webアプリを作成しているのですが
あるエラーが解決出来ないため、質問させていただきました。

前提・実現したいこと

AJAXを使って、データベースにデータ登録を行いたい。

環境:
Laravel + Vue.js
AJAXはaxiosを使って実行しています。

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

Error: Request failed with status code 500

該当のソースコード

Vue

1 methods:{ 2 postItem() { 3 const item = { 4 name: this.addItem.name, 5 description: this.addItem.description 6 }; 7         8   //下記コードにてデータが入っていることは確認済み 9 alert(item.name); 10 alert(item.description); 11 12 window.axios.post('/api/item/store', item) 13 .then(() => { 14 alert('store complete!!'); 15 this.addItem.name = ''; 16 this.addItem.description = ''; 17 }) 18 .catch((error) => { 19 //Error: Request failed with status code 500 20 alert(error); 21 }); 22 }

Laravel

1public function storeItem(Request $request) { 2 3 $addItem = new Item(); 4 5 // 失敗 6 //$addItem->name = $request['item.name']; 7 //$addItem->description = $request['item.description']; 8 9 // 失敗 10 //$addItem->name = $request->input('item.name'); 11 //$addItem->description = $request->input('item.description'); 12 13 // 失敗 14 //$addItem->name = $request('item.name'); 15 //$addItem->description = $request('item.description'); 16 17 // 成功したパターン(Requestデータは使わずに文字列指定) 18 //$addItem->name = 'additem'; 19 //$addItem->description = 'adddescription'; 20 21 $addItem->save(); 22 23 }

試したこと

$addItem->name = 'additem';
$addItem->description = 'adddescription';

Laravel側のコードにありますが、上記のように
Requsetされたデータを使わないリテラルパターンにすれば
DBにデータ挿入が成功し、alert('store complete!!');が実行されます。
(実際にデータが挿入されていて
AJAXにてDBからデータを取得して表示するページにも表示されています)

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

フロント:Vue2.5.7
バックエンド(api):Laravel5.6

ルート設定はapiにしています。(現時点では、認証等は行っていません)
ソースは全て同一サーバ上で稼動しています。

Requestされたデータへのアクセスか何かが悪いのかと思うのですがうまくいきません。

お手数ですが、お力添え頂けると幸いです。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

もしかしたら取れるのかもしれないですが、

php

1$request['item.name'];

php

1$request->input('name');

かな

あと、
Error: Request failed with status code 500
の内容が重要なので載せていただければ回答しやすくなります。

投稿2018/11/06 03:52

rururu3

総合スコア5545

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

morguri

2018/11/06 04:11

ご回答頂きありがとうございます。 $request->input('name'); にしたところ上手くいきました! Requestデータの構造とアクセスについて勉強しないといけないですね。 >Error: Request failed with status code 500 >の内容が重要なので載せていただければ回答しやすくなります。 これについては確かにそうですよね。すみませんでした。 この度はありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問