在C#后端處理React前端的異步請求,通常需要以下幾個步驟:
創建一個Web API項目:首先,你需要在Visual Studio中創建一個ASP.NET Web API項目。這將作為你的后端服務,用于處理來自React前端的請求。
安裝必要的NuGet包:確保已安裝如下NuGet包:Microsoft.AspNet.WebApi.Cors和Newtonsoft.Json。
配置跨域資源共享(CORS):在Web API項目的WebApiConfig.cs文件中,啟用CORS以允許跨域請求。例如:
public static class WebApiConfig
{
public static void Register(HttpConfiguration config)
{
// 啟用CORS
var cors = new EnableCorsAttribute("*", "*", "*");
config.EnableCors(cors);
// 其他配置...
}
}
創建API控制器:在項目中創建一個新的API控制器,用于處理React前端發送的請求。例如,創建一個名為“ValuesController”的控制器。
編寫異步操作方法:在API控制器中,編寫異步操作方法以處理前端請求。使用async/await關鍵字實現異步操作。例如:
public class ValuesController : ApiController
{
[HttpGet]
public async Task<IHttpActionResult> GetValues()
{
// 模擬異步操作,例如從數據庫獲取數據
await Task.Delay(1000);
// 返回結果
return Ok(new string[] { "value1", "value2" });
}
}
async function fetchData() {
try {
const response = await fetch('http://localhost:5000/api/values');
const data = await response.json();
console.log(data);
} catch (error) {
console.error('Error fetching data:', error);
}
}
// 調用fetchData函數
fetchData();
注意:在實際項目中,你可能需要處理更復雜的業務邏輯、錯誤處理和身份驗證。但是,這個示例提供了一個基本的框架,說明如何在C#后端處理React前端的異步請求。