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

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

ただいまの
回答率

90.35%

  • PHP

    22389questions

    PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

  • Laravel 5

    2285questions

    Laravel 5は、PHPフレームワークLaravelの最新バージョンで、2014年11月に発表予定です。ディレクトリ構造がが現行版より大幅に変更されるほか、メソッドインジェクションやFormRequestの利用が可能になります。

  • Ajax

    1222questions

    Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

  • Laravel

    770questions

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

  • OAuth 2.0

    96questions

    OAuth 2.0(Open Authorization 2.0)は、APIを通して保護されたリソース(サードパーティのアプリケーション)へアクセスする為のオープンプロトコルです。

Laravel 5.4でAPI認証(Passport)を使った「/oauth/clients」で新クライアントを作成できないです。。

解決済

回答 2

投稿

  • 評価
  • クリップ 0
  • VIEW 2,026

前提・実現したいこと

Laravel5.4にてAPI認証(Passport)で「/oauth/clients」(Post)にてクライアントを作成しました。

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

app.js:29
POST http://localhost:8000/oauth/clients 401 (Unauthorized)

send @app.js:29
ajax @app.js:29
(anonymous)    @VM716:1

該当のソースコード

$.ajax({
       url: 'http://localhost:8000/oauth/clients',
       type: 'POST',
  headers: {'X-CSRF-TOKEN':$('meta[name="csrf-token"]').attr('content'),
            'content-type':'application/json',
            'Accept': 'application/json',
            'X-Requested-With': 'XMLHttpRequest'
    },
data:'{"name":"taro","redirect":"http://localhost:8000"}',
        success: function(response){ console.log(response.data); },
        error: function(req, err){ console.log(err);}
    });

試したこと

「php artisan passport:client」でクライアントの作成はできるが、APIからのクライアント作成ができないです。
また、クライアントがある状態でのトークンの作成「/oauth/token」はできています。
そのため、passportのインストールはできていると思います。

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

chromeのコンソールで、Ajaxを実行しています。

3日ほどかけて調査してますが、原因がわからず、どなたかご教示いただきたく思っています。。

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

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

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

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 2

checkベストアンサー

+1

Laravel 5.4 API認証(Passport)
ドキュメントの内容を一通りやってみた所、/oauth/clientsを叩くには、まずユーザーがログイン認証している状態でないと401エラーになります。

開発検証を行う手順としては、

  1. Laravel Passportを導入
  2. php artisan make:auth でログイン画面のスキャフォールドを作成し、ユーザー登録とユーザーログインを行う
  3. その後に/oauth/clientsをvendor:publishで作成されるVueの管理画面で検証

動作が確認できて出来ていない状態でjQueryで頑張るよりも、用意されたVueコンポーネントから理解するほうが早いと思います。

以下の記事なども参考にしてください
LARAVEL 5.3 で PASSPORTを試す
API認証(Passport)機能の動作確認

 検証に利用したPassportのvueコンポーネントを使うbladeテンプレート 

※ app.jsとapp.cssはLaravel mixにて作成されるので、ドキュメントのフロントエンド・クイックスタートの導入後npm run devで事前にビルドしておいてください

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>Document</title>
    <link rel="stylesheet" href="{{ mix('css/app.css') }}">
    <script src="{{ mix('js/app.js') }}" defer></script>
</head>
<body>

<div id="app">
    <passport-clients></passport-clients>
    <passport-authorized-clients></passport-authorized-clients>
    <passport-personal-access-tokens></passport-personal-access-tokens>
</div>
</body>
</html>

authのミドルウェアを外したclient登録のルート定義の参考例
RouteServiceProvider.php

public function map()
{
    $this->mapApiRoutes();

    $this->mapWebRoutes();
    #Laravel\Passport\RouteRegistrarより prefixをoauth_no_loginに変更
    Route::group(['prefix' => 'oauth_no_login', 'namespace' => 'Laravel\Passport\Http\Controllers','middleware' => ['web']], function ($router) {
        $router->get('/clients', [
            'uses' => 'ClientController@forUser',
        ]);

        $router->post('/clients', [
            'uses' => 'ClientController@store',
        ]);

        $router->put('/clients/{client_id}', [
            'uses' => 'ClientController@update',
        ]);

        $router->delete('/clients/{client_id}', [
            'uses' => 'ClientController@destroy',
        ]);
    });
}

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2017/08/05 14:05

    Vueコンポーネントで動きをみれました。
    ログインしないと使えないようでした。
    ログインしないで、アカウント登録をしたかったのですが、LaravelのデフォルトのAPIでは用意されていないのでしょうか。

    キャンセル

  • 2017/08/05 14:27

    Passport::routes();で登録されるルート定義はauthがついているので、回答にauthのミドルウェアを外したoauth/clientAPIの追加ルート定義の参考例を追加してみました。詳しくはAuthServiceProviderで登録するPassport::routes();の中身である、Laravel\Passport\PassportやLaravel\Passport\RouteRegistrarなどのクラスを確認してみてください

    キャンセル

  • 2017/08/06 16:08

    ありがとうございます!
    試してみます!!

    キャンセル

+1

最初はLaravelが用意してるものを使ったほうがいいです。
まずフロントエンド・クイックスタートで作られるVueコンポーネントで問題なく動くか確認。
https://readouble.com/laravel/5.4/ja/passport.html#frontend-quickstart
自分で作りたければClients.vueを参考に作る。

jQueryではなくaxiosならcsrf部分を自分で設定する必要はなくなります。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2017/08/05 14:03

    Vueコンポーネントで動きを観れました。
    ログインしないと使えないようです。
    ありがとうございました。

    キャンセル

同じタグがついた質問を見る

  • PHP

    22389questions

    PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

  • Laravel 5

    2285questions

    Laravel 5は、PHPフレームワークLaravelの最新バージョンで、2014年11月に発表予定です。ディレクトリ構造がが現行版より大幅に変更されるほか、メソッドインジェクションやFormRequestの利用が可能になります。

  • Ajax

    1222questions

    Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

  • Laravel

    770questions

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

  • OAuth 2.0

    96questions

    OAuth 2.0(Open Authorization 2.0)は、APIを通して保護されたリソース(サードパーティのアプリケーション)へアクセスする為のオープンプロトコルです。

  • トップ
  • PHPに関する質問
  • Laravel 5.4でAPI認証(Passport)を使った「/oauth/clients」で新クライアントを作成できないです。。