ရှေ့တန်းမှ fetch API နှင့်သင့်လျော်သောတုံ့ပြန်မှုခေါင်းစဉ်ပုံစံကိုသတ်မှတ်ခြင်း

ရှေ့ပြေးအဆင့်မြှင့်တင်မှုတွင် API သည် http တောင်းဆိုမှုများကိုပေးပို့ရန်နှင့်တုံ့ပြန်မှုများကိုရယူရန်အသုံးပြုသောအလွန်အသုံးများသော interface တစ်ခုဖြစ်သည်။ ရှေ့တန်းနှင့်နောက်ခံအဆုံးသည်အချက်အလက်များကိုမှန်ကန်စွာဖလှယ်နိုင်ကြောင်းသေချာစေရန်တုန့်ပြန်မှုခေါင်းစဉ်၏ပြင်ဆင်မှုသည်အလွန်အရေးကြီးသည်။ HTTP တုန့်ပြန်မှုခေါင်းကြီးများကိုသတ်မှတ်ရန် PHP သည် header function ကိုထောက်ပံ့ပေးသည်။ Front-end api ကိုအသုံးပြုသော API နှင့်အသုံးပြုသောအခါမှန်ကန်သော configuration သည်တုန့်ပြန်မှုပုံစံများနှင့်လက်ဝါးကပ်တိုင်တောင်းဆိုမှုများကဲ့သို့သောပြ problems နာများကိုဖြေရှင်းနိုင်ရန်သေချာစေနိုင်သည်။

1 ။ PHP တွင်တုန့်ပြန်ခေါင်းစီးများကိုသတ်မှတ်ရန် header function ကိုသုံးပါ

PHP တွင် Http Response Hevers Headers ကို browser သို့ပို့ရန် HTTP Response headers များကိုပို့ရန်အသုံးပြုသည်။ များသောအားဖြင့်၎င်းသည်အကြောင်းအရာအမျိုးအစား (Content-type), cache control control, cache control inste quating foring (CORS) နှင့်အခြားသတင်းအချက်အလက်များကိုသတ်မှတ်ရန်အသုံးပြုသည်။

 <?php
// တုံ့ပြန်မှုခေါင်းစီးကိုသတ်မှတ်ပါ，အဖြစ်တုံ့ပြန်မှုအကြောင်းအရာအမျိုးအစားကြေညာ JSON
header('Content-Type: application/json');

// တည်ဆောက်သည် CORS ဉီးခေါင်း，တိကျသောဒိုမိန်းအမည်များမှတောင်းဆိုမှုများကိုခွင့်ပြုပါ
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET, POST, PUT, DELETE');
header('Access-Control-Allow-Headers: Content-Type');

// Simulation ပြန်လာ JSON အချက်များ
$response = ['message' => 'Hello, World!'];
echo json_encode($response);
?>

အထက်ပါ PHP Code တွင် header function ကို JSON format တွင်ပါဝင်သည့်အကြောင်းအရာအမျိုးအစားကိုသတ်မှတ်ခြင်းအပါအ 0 င်တုံ့ပြန်မှုခေါင်းစီးကိုသတ်မှတ်ရန်အသုံးပြုသည်။ Access-control- ခွင့်ပြုထားသော - ဇာစ်မြစ် မှတစ်ဆင့် cross-domain access အတွက်စည်းမျဉ်းစည်းကမ်းများချမှတ်ခြင်း, မည်သည့်အရင်းအမြစ်မှတောင်းဆိုမှုများကိုခွင့်ပြုသည်။ ယခုအချိန်တွင်ရှေ့ဆုံးအဆုံးသည်ပုံမှန်အားဖြင့် API မှတစ်ဆင့်ပုံမှန်အားဖြင့်တုံ့ပြန်မှုအချက်အလက်များကိုလက်ခံရရှိနိုင်သည်။

2 ။ အဆိုပါ fetch API နှင့်တွဲဖက်။ တောင်းဆိုမှုများပေးပို့ပါ

ရှေ့တန်းကုဒ်တွင် HTTP တောင်းဆိုမှုများကိုပေးပို့ရန်နှင့်တုန့်ပြန်မှုကိုရယူရန် Fetch API ကိုအသုံးပြုသည်။ Fetch ၏အခြေခံ syntax သည်အောက်ပါအတိုင်းဖြစ်သည် -

 fetch('http://m66.net/api/example.php', {
  method: 'GET', // တောင်းဆိုမှုကိုနည်းလမ်း
  headers: {
    'Content-Type': 'application/json' // တောင်းဆိုချက် header，Send sendify JSON 格式的အချက်များ
  }
})
.then(response => response.json()) // တုံ့ပြန်မှုခွဲခြမ်းစိတ်ဖြာ JSON အချက်များ
.then(data => console.log(data)) // ထုတ်လုပ်ခြင်း响应အချက်များ
.catch(error => console.error('Error:', error)); // အမှားကိုင်တွယ်

အထက်ပါကုဒ်သည် PHP back ည့ ် ဆီသို့တောင်းဆိုမှုကိုရယူသည် ။

3 ။ Cross-Domain ပြ problems နာများကိုဖြေရှင်းပါ

လက်ရှိအဆုံးနှင့် backend သည်တူညီသော domain name သို့မဟုတ် port တစ်ခုတည်းတွင်မပါ 0 င်သည့်အခါ, Fetch API ကိုလက်ဝါးကပ်တိုင်ဒိုမိန်းတောင်းဆိုမှုများကိုမှန်ကန်စွာကိုင်တွယ်ရန် Backend သည်တုန့်ပြန်ခေါင်းစီးတွင် Cors (Cross-Dome Resource Resouring Sharing) နှင့်ဆက်စပ်သောဆက်တင်များထည့်သွင်းရမည်။

PHP တွင် Cors Headers များကို Cors-Control-Allow-Outs-Outs-Outsoint မှတစ်ဆင့်သွားခွင့်ပြုသည့် header function ကိုမှတစ်ဆင့် header function မှတဆင့်သတ်မှတ်နိုင်သည်။ ဥပမာအားဖြင့်:

 // အားလုံးအရင်းအမြစ်များမှလက်ဝါးကပ်တိုင်တောင်းဆိုမှုများကိုခွင့်ပြုပါ
header('Access-Control-Allow-Origin: *');
// 允许တောင်းဆိုမှုကိုနည်းလမ်း GET、POST、PUT、DELETE
header('Access-Control-Allow-Methods: GET, POST, PUT, DELETE');
// 允许တောင်းဆိုချက် header中包含 Content-Type
header('Access-Control-Allow-Headers: Content-Type');

ဤချိန်ညှိချက်များသည်ရှေ့ပြေး ရယူခြင်း တောင်းဆိုမှုကိုအောင်မြင်စွာပေးပို့နိုင်သည်။

4 ။ ပြီးပြည့်စုံသောဥပမာ

ရှေ့တန်းနှင့် back-end code ကိုပေါင်းစပ်ပြီး PHP ၏ header function adi ကို fetch API ကို အသုံးပြု. တုန့်ပြန်မှုခေါင်းစဉ်ပုံစံကိုမည်သို့ဖြေရှင်းရမည်ကိုပြသနိုင်သည့်အပြည့်အဝဥပမာတစ်ခုရနိုင်သည်။

PHP Code:

 <?php
// တုံ့ပြန်မှုခေါင်းစီးကိုသတ်မှတ်ပါ
header('Content-Type: application/json');
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET, POST, PUT, DELETE');
header('Access-Control-Allow-Headers: Content-Type');

// Simulation ပြန်လာ JSON အချက်များ
$response = ['message' => 'Hello, World!'];
echo json_encode($response);
?>

JavaScript Code:

 fetch('http://m66.net/api/example.php', {
  method: 'GET',
  headers: {
    'Content-Type': 'application/json'
  }
})
.then(response => response.json())
.then(data => console.log(data)) // ထုတ်လုပ်ခြင်း：{ message: "Hello, World!" }
.catch(error => console.error('Error:', error));

ဤနည်းအားဖြင့်ရှေ့တန်းနှင့်နောက်ခံအကြားဆက်သွယ်မှုသည်ချောချောမွေ့မွေ့ဆက်လက်လုပ်ဆောင်နိုင်ပြီးအချက်အလက်များကို JSON format တွင်မှန်ကန်စွာကူးစက်နိုင်ပြီး Cross-Domain Access ၏ပြ problem နာကိုဖြေရှင်းနိုင်ရန်သေချာစေနိုင်သည်။

အကျဉ်းချုပ်

ဤဆောင်းပါးသည် PhP တွင် PHP တွင်တုန့်ပြန်မှုခေါင်းစဉ်ပုံစံကိုရှေ့တန်းမှနောက်ဆုံးအဆုံးသို့မှန်ကန်စွာဖြတ်သန်းနိုင်ရန်အတွက် ကြိုတင်ပြင်ဆင်ထားသည့် api ကို သတ်မှတ်ထားကြောင်းဖော်ပြထားသည်။ အကြောင်းအရာ - အမျိုးအစား နှင့် control-operty-origining ကဲ့သို့သောသင့်လျော်သောတုန့်ပြန်မှုခေါင်းစဉ်များကိုပြင်ဆင်ခြင်းအားဖြင့်ကူးသန်းရောင်းမီဒီယာတောင်းဆိုမှုများနှင့်တုံ့ပြန်မှုများကိုသင်သေချာစေနိုင်သည်။ အကယ်. သင်သည်ရှေ့နှင့်နောက်ပြန်ဆက်သွယ်ရေးဆက်သွယ်ရေးဆိုင်ရာလျှောက်လွှာများကိုရေးဆွဲနေပါကဤတုံ့ပြန်မှုခေါင်းစီးများကိုမည်သို့ပြင်ဆင်ရမည်ကိုနားလည်ခြင်း။