جالس اتعلم استخدم laravel sanctum للتحقق و لكن اريد ان احصل bearer token الخاص بالمستخدم لارسال البيانات.
هل اعمل fetch api يأخذ bearer token الخاص بالمستخدم الذي يكون مخزن في session او هناك طريقة اخرى احصل عليه و اضعه في authorization header ؟
انا اريد استخدامه ليس في postman بل في موقع الكتروني عادي بستخدام fetch لان اذا استخدم auth:snctum يظهر لي unauthnticated لان bearer token ليس موجود في header كيف اجيب bearer token و اضعه header?
المتصفح لا يقوم تلقائياً بإرسال الـ Bearer Token مع طلبات fetch كما يفعل مع الـ Cookies. ولذلك ستحتاج إلى تخزين الـ Token الذي يرجعه الخادم عند تسجيل الدخول وإرساله في كل طلب fetch مثال على ذلك
const token = localStorage.getItem('auth_token');
fetch('https://your-api.com/api/user-data', {
method: 'GET',
headers: {
'Authorization': `Bearer ${token}`,
'Accept': 'application/json', // مهم جداً حتى يرجع Laravel خطأ 401 بدلاً من التحويل لصفحة Login
'Content-Type': 'application/json'
}
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));
ولكن أنت لست بحاجة إلى التعامل مع الـ Bearer Token . حيث يوفر Sanctum ميزة SPA (Single Page Application) Authentication، والتي تعتمد على ملفات تعريف الارتباط (Cookies) المشفرة الخاصة بـ Laravel، وهي أكثر أماناً (لأنها محمية من ثغرات XSS التي يمكنها سرقة الـ localStorage).
ربما لم تقم بالإعدادات بالشكل المناسب . ولذلك يمكنك الإطلاع على التعليق التالي والتأكد من الخطوات
وتأكد أيضاً من عدم غياب HasApiTokens من نموذج المستخدم. أو نسيان إضافة Accept: application/json في الترويسات، مما يجعل Laravel يرجع استجابة HTML بدلًا من JSON.
للاسف كله هذا سويته ولا زال يظهر لي unauthenticated .
كود جافاسكريبت
async function checkName(bodyForm){
try{
const name=await fetch("api/addCompany",{
method:"POST",
// credentials:"include",
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
"Authorization": `Bearer ${document.querySelector('input[name=_token]').value}`,// crsf tokenهذا
"X-CSRF-Token": document.querySelector('input[name=_token]').value
},
body:bodyForm
});
const namesJson=await name.json();
console.log(namesJson)
// const retName=await namesJson.recName;
// console.log(retName);
}
catch(error)
{
return console.log(error.message);
}
}
المشكلة هي ان token لابد يكون موجود في bearer token في header. و مشكلتي هي هل الافضل حفظ token في session من ناحية امنية؟
التعليقات