Arkadaşlar API'den sorgu çekmeye çalışıyorum fakat hep 401 hatası alıyorum... Yaptığım işi şöyle bir özetleyeyim size:
1) localStorage.getItem ile axios'ın header'ına Authorization'ı ekliyorum; eğer boşsa 'Bearer null' oluyor, Sonra Vue içinde tekrar boşsa oluşturuyorum.
2) /oauth/token'a post ile bir sorgu gönderiyorum. İçinde username(email), password, client_id, client_secret, grant_token=password mevcut.
Not: Burada sadece username ve password'un gönderilmesi gerektiğini, diğerlerinin api içinde GuzzleHttp ile alınması gerektiğini biliyorum. Fakat guzzle sorgusu yaptığım kısım resmen karadeliğe dönüşüyor. Hiçbir yanıt gelmiyor uygulamadan. Taa ki terminal'den çıkıp php artisan serve'yi durdurana kadar... Ama normal js ile istek yapınca da geriye bir şey gelmiyor.
3) Buraya kadar kullanıcının personal access token'ini aldıktan sonra başka bir api url'ine sorgu yaptığımda yukarıda belirttiğim 401 hatasını alıyorum.
Sorun nerededir? Kafayı yemek üzereyim resmen. Sadece şu api olayı yüzünden takıldım kaldım ilerleyemiyorum. Lütfen bir el atın...
Yaptıklarım:
routes/api.php
use GuzzleHttp\Exception\GuzzleException;
use GuzzleHttp\Client;
// /api/login
Route::get('login', function()
{
$query = [
'form_params' => [
"client_id" => 2,
"client_secret" => 'ggUwcwsvBcFIzA67yg3xzoVu9plxekCYk5w6CFOQ',
"grant_type" => 'password'
]
];
$client = new Client();
$url = "http://start.app:8000/oauth/token";
$response = $client->createRequest("POST", $url, ['auth' => ['me@example.com','123123'],'body'=>$query]);
$response = $client->send($response);
return dd($response);
// try {
// $client = new GuzzleHttp\Client();
// $res = $client->post('http://start.app:8000/api/test', $query);
// \Log::critical($res->getBody());
// } catch(GuzzleException $e) {
// \Log::error($e->getMessages());
// }
// return ['message' => 'Log dosyasına bak!'];
});
Route::post('test', function()
{
$credentials = request(['email','password']);
if (Auth::guard('admin')->attempt($credentials))
{
return response()->json(auth('admin')->user());
}
return response()->json(['error' => 'giriş yapılamadı', 'request' => request('username', 'password'), 'admin' => auth('admin')->user()], 203);
});
bootstrap.js içinde axios kısmı vue import edildikten hemen sonra
window.axios = require('axios');
window.axios.defaults.headers.common['X-CSRF-TOKEN'] = window.Laravel.csrfToken;
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
window.axios.defaults.headers.common['Authentication'] = 'Bearer ' + localStorage.getItem('access_token');
// ...
spa-app.js dosyası.
require('../bootstrap');
require('../adminlte');
window.Vue = require('vue');
require('./vue-configs'); // Vue için production modunu ayarla:
import Auth from '../apps/authentications/auth';
Vue.use(Auth);
import VueRouter from 'vue-router';
Vue.use(VueRouter);
/* -------------------------------------------------------------
| Global Komponentleri Vue.component(...) ile tanımla
-------------------------------------------------------------- */
Vue.component('passport-clients', require('../components/passport/Clients.vue'));
Vue.component('passport-authorized-clients', require('../components/passport/AuthorizedClients.vue'));
Vue.component('passport-personal-access-tokens', require('../components/passport/PersonalAccessTokens.vue'));
/* -------------------------------------------------------------
| Admin Routes Loading...
-------------------------------------------------------------- */
import Routes from '../routes';
const router = new VueRouter({
// mode: 'history',
routes: Routes
});
import LoginApp from '../views/login-app.vue'; // login sayfasının göründüğü kısım
import AdminApp from '../views/admin-app.vue'; // uygulamanın giriş noktası
/* -------------------------------------------------------------
| Global Vue App
------------------------------------------------------------- */
const app = new Vue({
el: '#spa-app',
router,
render: h => {
return Vue.auth.isAuth()
? h(AdminApp)
: h(LoginApp);
},
data () { return {key: null} },
created () {
if(Vue.auth.isAuth()) {
window.axios.defaults.headers.common['Authentication'] = 'Bearer ' + Vue.auth.getToken();
}
},
computed: {
authentication: {
set(value) {
Vue.auth.setToken(value.data);
console.log("token atandı...");
},
get() {
console.log("token alınıyor...");
return Vue.auth.getToken();
}
}
}
});
router.beforeEach((to, from, next) => {
if (to.matched.some(record => record.meta.reuse === false)) {
app.key = to.path
} else {
app.key = null
}
next();
});
/** --------------------------------------------------
| Notification Plugins
----------------------------------------------------- */
require('../apps/push-notifications/laravel-echo');
// require('./apps/push-notifications/one-signal');
routes.js route bilgilerini almak için.
// const LoginRoutes = [
// { name: 'login', path: '/', component: require('./views/login-app.vue'), meta: { reuse: false } },
// ];
/* -------------------------------------------------------------
| Admin Route List
------------------------------------------------------------- */
const Routes = [
{ name: 'login', path: '/', component: require('./views/login-app.vue'), meta: { reuse: false } },
{ name: 'dashboard', path: '/admin', component: require('./views/pages/dashboard-page.vue'), meta: { reuse: false } },
{ name: 'logout', path: '/logout' },
{ name: 'messages', path: '/all-messages', component: require('./views/pages/messages-page.vue'), meta: { reuse: false } },
{ name: 'message', path: '/message/:id', component: require('./views/message/show.vue'), meta: { reuse: false } },
{ name: 'friends', path: '/friends' },
{ name: 'followers', path: '/followers' },
{ name: 'sellers', path: '/sellers' },
{ name: 'profile.show', path: '/profile/:id' },
{ name: 'user.show', path: '/user/:id' },
/* Şöyle kullanılır: <router-link :to="{ name: 'user.show', params: { id: this.$route.params.id } }">Kullanıcı Bilgisi</router-link> */
];
export default Routes;
/* -------------------------------------------------------------
| Return Routes
------------------------------------------------------------- */
// export { LoginRoutes, AdminRoutes }