Laravel 做 API 服务端，VueJS+iView 做 SPA，给新手一个 Demo

mark

Good Job !

@lbui2002 互相学习 :smile:

@Corwien 共同进步 :smile:

:+1: :+1: :+1:

马克

access_token 每次登录都重新获取么？

@Jinrenjie 嗯是的，不过不需要每次都登陆，前端做了自动登录处理。默认将access_token存储到localStorage里面。

@轻色年华 除了获取 AccessToken 接口，其他的 API 访问均需要在 Request Header 中加入： Bearer access_token
请问这个是前端加的吗？但是在后台好像没有看到判断加没加入access_token

@leung0826 嗯，前端访问API接口需要在请求头加上上面内容，例如：

Vue.http.get(server.api.user, {
                    headers: {
                        'Authorization': 'Bearer ' + store.state.access_token
                    }
                }).then((response) => {
                    store.commit('setUser', response.body.data);
                }, (error) => {
                    redirect({name: 'login'});
                });

至于没有在后台看到验证，那是因为可以Laravel已经自动做了验证（在Middleware：auth:api 中完成的。），具体的请查看：https://learnku.com/docs/laravel/5.4/passport#prot...

在 js 里面直接暴露了 client_secret，这样的处理会不会不太好？

@qqjt 没有深究 :smile:

请教个问题，组件里的这个route对象是什么概念？找了vue-router的文档，没找到
我在自己的项目里加这个，却没效果，route里的data函数貌似没执行

export default {
    route: {
        data() {
            document.title = config.web_name;
        }
    },
    data() {
        return {
            web: {
                name: '云书签',
                url: 'https://cloudbookmark.cn'
            }
        }
    }
}

@klgd 首先，我使用的是vue-router 1.0版本，至于你说的route对象，那是我在main.js中 Vue.use(VueRouter) 插件，这会自动在vue实例中插入route对象，至于data()函数是一个vue-router生命周期内的一个状态，其意思就是加载数据时所处的状态。具体请查看：https://github.com/vuejs/vue-router/blob/1...

Mark

@轻色年华 感谢，原来到2以后已经不用这种方式了

github的文档有点问题，克隆下来后要先将 .env.example 复制一份为 .env 文件，然后执行 php artisan migrate 安装数据表，然后再生成key，命令 php artisan key:generate，要不然会报错的

学习下:+1:

@如此甚好 好的，多谢反馈，我待会测试下

Vue.http.get(server.api.user, {
headers: {
'Authorization': 'Bearer ' + store.state.access_token
}
}).then((response) => {
store.commit('setUser', response.body.data);
}, (error) => {
redirect({name: 'login'});
});
头部也有这个，但还是报
url: "http://test.book.com/oauth/token", ok: false, status: 401, statusText: "Unauthorized"
"{"error":"invalid_client","message":"Client authentication failed"}"
是什么情况，前面的域名是本地自己指定的虚拟域名

@秋风瑟瑟 Authorization成功传入了吗？有没有丢失的情况？另外API的登陆验证的中间件是api.auth,并不是auth

按照文档走了一遍 我用的是密码授权客户端 access_token 能正常获取 但是认证访问一直是 Unauthenticated 各种配置也检查 不知道怎么解决

namespace App\Http\Proxy;
use GuzzleHttp\Client;
use GuzzleHttp\Exception\GuzzleException;

class TokenProxy
{
    protected $http;

    public function __construct(Client $http)
    {
        $this->http = $http;
    }

    public function proxy($grant_type, array $data = [])
    {
        $data = array_merge($data, [
            'client_id'     => env('PASSPORT_CLIENT_ID'),
            'client_secret' => env('PASSPORT_CLIENT_SECRET'),
            'grant_type'    => $grant_type,
        ]);

        $url      = 'http://xq.com/oauth/token';
        try {
            $response = $this->http->request("POST", $url, [
                'form_params' => $data
            ]);
            dump($response);
            exit;
        } catch (GuzzleException $e) {
            dump($e->getMessage());
        }
        exit;
        $token = json_decode((string)$response, true);
        return response()->json([
                                    'token'      => $token['access_token'],
                                    'expires_in' => $token['expires_in']
                                ])
            ->cookie('refreshToken', $token['refresh_token'], 86400, null, null, false, true);
      }
   }

我用postmain 直接请求 http:/xxx.com/oauth/token 是可以获取access_token的

我用postmain 按老师写的那种方法：use GuzzleHttp\Client 里面的 post方法请求，一直卡着，到最后nginx提示错误，我看了日志文件是：

2018/04/05 16:01:32 [info] 6824#6196: *49 client timed out (10060: A connection attempt failed because the connected party did not properly respond after a period of time, or established connection failed because connected host has failed to respond) while waiting for request, client: 127.0.0.1, server: 0.0.0.0:80
看样子是超时的意思，在视频里面老师

我用的是laravel 5.6
GuzzleHttp\Client 版本是：6.2

https://github.com/Qsnh/CloudBookMark/issu... 这是我提交的issue 链接

学习下 :blush: