apiから値を取得しようとするもなぜかhtmlのような値が返ってくる場合

 

axios.get('/api/hogehoge) でapiから値を取りたいのに、戻り値がこんな風になる。

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="csrf-token" content="hLBaqxbg5QiEuL0AenaYsyMqw9tP5fabFpgv2DjR">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
   
    <title>Example</title>
<link rel="stylesheet" href="/css/app.css">
</head>
<body onfocus="top.focus()">
    <div id="app">
        <App />
    </div>

<script src="/js/app.js"></script>
</body>
</html>

 

postとgetを間違えている

例えばLaravelでapi.phpを使っているなら

Route::post('/customers/archive', [CustomerController::class, 'show']);
//↓
Route::get('/customers/archive', [CustomerController::class, 'show']);

これで解決

 

/api/が抜けてる

これもバックエンドがLarvelの例だが、フロント側の呼び出し方に問題があるパターン。

axios.get('/api/authorinfo')
    .then(response => {
        console.log(response)
    })        
//↓
axios.get('/api/authorinfo')
    .then(response => {
        console.log(response)
    })

aip.phpを使うなら、/api/が必須。

 

 

無制限に質問可能なプログラミングスクール!

万が一転職できない場合は、転職保障全額返金できるコースもあり!!

無制限のメンター質問対応

 

DMMウェブキャンプでプログラミングを学習しませんか?

独学より成長スピードをブーストさせましょう!

 

まずは無料相談から!

おすすめの記事