[vue Laravel] axiosでpushするデータに、ログインユーザーIDを設定したい

Question

初歩的な質問で申し訳ございません。
恐らく、とても簡単な内容です。

前提・実現したいこと

Vue.js
Laravel
axios

jsファイルからaxiosでpushするデータに、ログインユーザーIDを設定したいです。
ただ、jsファイルでログインユーザーIDを取得するのは難しそうと判断しました。
そこで、axiosでpushするjsファイルではuser_idを1と設定し、受け取ったcontrollerで、ユーザーIDをAuth::user()->id;と設定することにしました。

やったこと

１．jsファイルで直接取得

参考：https://www.it-swarm-ja.tech/ja/javascript/vuejs%E3%81%A8laravel%E3%82%92%E4%BD%BF%E7%94%A8%E3%81%97%E3%81%A6%E7%8F%BE%E5%9C%A8%E8%AA%8D%E8%A8%BC%E3%81%95%E3%82%8C%E3%81%A6%E3%81%84%E3%82%8B%E3%83%A6%E3%83%BC%E3%82%B6%E3%83%BCid%E3%82%92%E5%8F%96%E5%BE%97%E3%81%99%E3%82%8B%E6%96%B9%E6%B3%95/806941096/

// jsファイルに直接記述
$http.get('api/user').then(response => {
   console.log(response.body);
})
// エラー：[Vue warn]: Error in v-on handler: "ReferenceError: $http is not defined"

２．JSファイルにユーザーIDを設定

let userId = Auth::user()->id;
console.log(userId);
// Unexpected token, expected ";"

３．controllerにsubmitされた配列に直接記述

public function store(ChargeRemarkRequest $request)
	$params = $request->all();
    // ユーザーIDを直接登録する
    $params['user_id'] = Auth::user()->id;
    $chargeRemark = new ChargeRemark();
    $chargeRemark->fill($request->all())->save();
    return response()->json(['id' => $chargeRemark->id]);
}
// 何も変更なし

わからないこと

１. jsファイルでユーザーIDを取得することはできるのか
２. できない場合、コントローラーで上書きすることはできるのか
３. いずれも正しくない場合、どのようにして取得すれば良いのか

コード

１．axiosでpushするjsファイル

registerMemo(state, { infoId, content }) {
    state.calendars[infoId.calendarId][infoId.columnStatus][infoId.lineId].memos[infoId.memberId] = { content: content };
    let timeType = 0;
    switch (infoId.columnStatus) {
        case 'amcolumns':
            timeType = 1;
            break;
        case 'pmcolumns':
            timeType = 2;
            break;
        case 'yetcolumns':
            timeType = 0;
            break;
    };
    let params = {
        user_id: 1,
        charge_id: state.managerLists[infoId.memberId].id,
        time_type: timeType,
        work_on: state.calendars[infoId.calendarId].date.replaceAll('/', '-'),
        remarks: content,
    };
    let userId = Auth::user()->id
    console.log(userId);
    // メモ情報のIDがセットされていない場合は登録API、セットされている場合は更新APIを呼び出す
    if (!state.remarkId) {
        axios.post('/api/charge-remarks', params)
            .then(result => {
                console.log('register memo has succeeded!');
                // 返却されたIDをcalendarsの値へ返す
                state.calendars[infoId.calendarId][infoId.columnStatus][infoId.lineId].memos[infoId.memberId] = {
                    remarkId: result.id,
                    content: content
                };
                console.log(state.calendars[infoId.calendarId][infoId.columnStatus][infoId.lineId].memos[infoId.memberId]);
            })
            .catch(result => {
                console.log('error', result);
            });
    } else {
        axios
            .put('/api/charge-remarks/' + state.remarkId, params)
            .then(result => {
                console.log('update memo has succeeded!');
            })
            .catch(result => {
                console.log('error', result);
            });
    }
    Vue.set(state, 'refreshVal', state.refreshVal + 1);
},

２．axiosでpushされた値を処理するcontrollerファイル

public function store(ChargeRemarkRequest $request)
    {
        $chargeRemark = new ChargeRemark();
        $request->user_id = Auth::user()->id;
        $chargeRemark->fill($request->all())->save();
        return response()->json(['id' => $chargeRemark->id]);
    }

Answer 1

「requestの上書き」なんて意味不明な発想を捨てればいい。
変な本は$request->all()使ってるけど最初からall()を使わなければそんな発想は出てこない。

$chargeRemark->fill([
    'user_id' => $request->user()->id,
])->save();

質問の情報が足りないから分かりにくいけど、↑も違ってて本来はこの形でuser_idの指定なんかしない。

$request->user()->charge()->create($request->only([]));

JS側に渡すなら

<example user-id="{{ auth()->user()->id }}"></example>

Comments

[nanami0221]

有難うございます、前者の方で設定できました！
後者の方がよくわからず、、、

$chargeRemark->fill([
'user_id' => $request->user()->id, // ユーザーID
'charge_id' => $request->charge_id, // 担当者
'work_on' => $request->work_on, // 日付
'time_type' => $request->time_type, // AM・PM・未定
'remarks' => $request->remarks // メモ内容
])->save();