> ## Content Index
> Fetch the complete content index at: https://informatic-ar.com/llms.txt
> Use this file to discover other available public pages before exploring further.

# إستدعاء الـ ASP.NET Web API في الـ ASP.NET MVC
- URL: https://informatic-ar.com/consuming-aspnet-web-api/
- Published: 2018-08-08T16:57:53.000Z
- Updated: 2026-10-03T22:31:26.000Z
- Author: محمد أحمد حسين
- Tags: برمجة, دوت نت, الويب, #wordpress-archive, #Import 2026-10-03 20:48

... تحدثتُ في المقالة السابقة لي، عن كيفية تهيئة الـ Service من خلال استخدام منصة الـ ASP.NET Api وعرضت مشروع مبسط يختص بتجديد واصدار جوازات المواطنين، كما عرضت كيفية اختبار الشفرات بإستخدام منصة مايكروسوفت Unit Test لجميع الأساليب التي أنشأناها في فئة التحكم PersonsController وكما اسلفت في تلك المقالة ان فئات التحكم في مشروع الـ Web Api ترث من فئة الـ ApiController ولا تقوم بإرجاع صفحات Html بل تقوم بإرجاع عناوين نقل المعلومات والتي يتولاها برتوكول الـ HTTP؛ بمعنى آخر يستقبل العميل صيغتان وهما – Xml و json ويستطيع العميل تهيتة تلك الصيغتان في بيئته البرمجية...(وهذا ما سنراه في هذه المقالة)!

بإمكانك مراجعة المقالة السابقة من هنا

[مفهوم الـ WEB API … تهيئتهُ … إستدعاءهُ … إختبار الشفرات عن طريق الـ Unit Testing](https://informatic-ar.com/aspnet-web-api-introduction/)

.... ويجب عليك مراجعتها (المقالة) ان أردت ان تواصل في هذه المقالة الجديدة لأنها تعتمد على المقالة الأولى.

وكما موضح بالصورة ادناه جميع البيانات التي يظهرها متصفح الكروم بصيغة XML والتي تم عرضها من المقالة السابقة

![](https://informatic-ar.com/wp-content/uploads/2018/08/5-300x146.png) إرجاع جميع المواطنين بصيغة XML من مشروع الـ Web Service

في هذه المقالة سنقوم ببناء تطبيق بسيط لبنك يختص بفتح حسابات جديدة للمواطنين، وفتح الحساب يعتمد على ان يكون جواز المواطن ساري المفعول وهو يعتمد على الأسلوب ValidToOpenAccountForCustomer الذي أنشأناه في المشروع السابق (مشروع الـ Api) فإذا كان جواز المواطن ساري المفعول سيتم فتح حساب جديد...اما اذا كان غير ذلك فلن يستطيع موظف البنك فتح حساب لأن الخدمة عبارة عن Readonly يتم قراءتها عبر رابط من الـ Services داخل شفرة تطبيق العميل.

البيئة البرمجية التي استخدمها في هذه المقالة هي Visual Studio 2017 بالنسبة لتطبيق العميل Client او لنقل الـ Consume وبالنسبة للخدمة نفسها (Api) كما في المقالة السابقة موضحة، قمت بإستخدام Visual Studio 2015 .. لكن أثناء كتابتي وتحرير لشفرة تطبيق العميل استخدمت Visual Studio Express 2013 For Web لفتح تطبيق الـ Web API.

> ملاحظة – يمكنك استخدام Visual Studio 2013 اذا اردت تنفيذ هذا المشروع، سواء إعادة بناء الخدمة Web API وبناء شفرة العميل.

في المقالة الأولى التي أشرت لرابطها آنفا توجد لدينا قاعدة يبانات باسم WebAPI\_DB وبها جدول واحد بإسم AccountDetails وداخل هذا الجدول يوجد حقل بإسم IsProcessFininshing ويُعني بإنتهاء عملية تجديد الجواز ففي حالة True – تم تجديد الجواز. وفي حالة False – الجواز لم يتم تجديده بعد.

مشروع العميل Client/Consume سيعتمد على هذا الحقل لفتح حساب بنكي لمواطن ما عن طريق رقمه الوطني وفتح الحساب البنكي يعتمد على القيمة True في الحقل المعني.

... سأقوم بعمل التطبيق خطوة بخطوة وسأقوم بشرح ما سنكتبه من شفرات بعد الإنتهاء من كل خطوة.

> في المشروع السابق الذي أشرت لرابطه أعلاه قم بعمل تعديل بسيط على أحد حقول البيانات للحقل IsProcessFininshing ليصبح False.

قم بفتح الفيجوال ستديو 2017 أو 2015 أو 2013 لديك وقم بعمل تطبيق ويب جديد من النوع الفارغ (Empty) وقم بتسمة المشروع **ASPNETConsumeWebApi** كما مبين في الصورة ادناه.

![](https://informatic-ar.com/wp-content/uploads/2018/08/1-300x183.png)

> بيئة العمل لدى تعمل على فيجوال ستديو 2017 واقوم بإستخدام الـ Dot Net Frameworm 4.7.1

من الصفحة التي ستظهر بعد انشاء المشروع قم بإختيار النوع Empty ولا تنسى تحديد نوع المشروع ليكون MVC وكما موضح بالصورة أدناه.

![](https://informatic-ar.com/wp-content/uploads/2018/08/2-300x194.png)

قم بتثبيت الحزم التالية على من على الـ Nuget داخل المشروع:

```csharp
System.Net.Http Microsoft.Net.Http System.Net.Http.Formatting
```

![](https://informatic-ar.com/wp-content/uploads/2018/08/3-300x159.png)

هذه المكتبات ستساعدنا على في مشروعنا والتي مرتبطة بالعمل مع الـ Web API ...

قم بإنشاء فئة بإسم AccountDetail داخل ملف الـ Models وألصق بها الشفرة التالية:

```csharp
[Table("AccountDetails")]
public class AccountDetail
{
    [Key]
    public Int32 PersonID { get; set; }
    public String Name { get; set; }
    public String NID { get; set; }
    public Boolean? Received { get; set; }
    public Nullable<DateTime> ReceivedDate { get; set; }
    public Boolean IsProcessFinishing { get; set; }
}
```

لاحظ ان تلك الفئة هي نفسها الفئة الموجودة بمشروع الـ Web service والتي ستقوم بإرجاع العناصر الموجودة داخل قاعدة البيانات...(حيث لاتوجد قاعدة بيانات داخل مشروع العميل Client / Consume).

قم بإنشاء فئة تحكم جديدة بإسم BankAccountController وتلك الفئة بها اسلوبين *Two Action Result* الاول يقوم بإرجاع جميع المواطنين من خدمة الـ Web API والثاني يقوم بإرجاع مواطن واحد لفتح حساب بنكي لهُ ويعتمد فتح الحساب البنكي للمواطن على الإسلوب ValidToOpenAccountForCustomer والموجود بفئة التحكم PersonsController والتي موجودة بمشروع الـ Web API Service ، الآن قم بلصق الشفرة التالية داخل الفئة التي اشئتها اخيرا:

```csharp
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading;
using System.Threading.Tasks;
using System.Web;
using System.Web.Http;
using System.Net.Http;
using System.Net.Http.Headers;
using System.Web.Mvc;
using ASPNETConsumeWebApi.Models;

String myBaseAddress = "http://localhost:3570/";
public async Task<ActionResult> GetAllPersons()
{
    IEnumerable<AccountDetail> acc = null;
    HttpClient client = new HttpClient();
    client.BaseAddress = new Uri(myBaseAddress);
    client.DefaultRequestHeaders.Accept.Clear();
    client.DefaultRequestHeaders.Accept.Add(
        new MediaTypeWithQualityHeaderValue("application/json"));
    HttpResponseMessage response = await client.GetAsync("api/persons/getpersons");
    if (response.IsSuccessStatusCode)
    {
        var persons = response.Content.ReadAsAsync<IEnumerable<AccountDetail>>().Result;
        acc = persons;
    }
    return View(acc);
}

public async Task<ActionResult> OpenAccountForPersonHas(int id)
{
    AccountDetail acc = null;
    HttpClient client = new HttpClient();
    client.BaseAddress = new Uri(myBaseAddress);
    client.DefaultRequestHeaders.Accept.Clear();
    client.DefaultRequestHeaders.Accept.Add(
        new MediaTypeWithQualityHeaderValue("application/json"));

    HttpResponseMessage response =
        await client.GetAsync($"api/persons/ValidToOpenAccountForCustomer/{id}");

    if (response.IsSuccessStatusCode)
    {
        acc = await response.Content.ReadAsAsync<AccountDetail>();
        return View(acc);
    }
    else
    {
        return View("InvalidDocument", response.StatusCode);
    }
}
```

هل تدري ان هذا كل ما سنحتاجه للقيام بفتح حساب بنكي جديد للمواطن يعتمد على تنفيذه على خدمة خارجية عن طريق رابط يأتي من Web Server آخر غير الذي موجود به تطبيق العميل *Hosted*..

فقط سنقوم ببناء صفحات العرض Html views بالنسبة لتطبيق العميل Client/Consume

حسنا في الإسلوب الأول GetAllPerson قمنا بعمل مثيل من الواجهة IEnumerable والتي تقوم بإرجاع البيانات في شكل مصفوفة هذا المثيل *instance* قمنا بإعطاءه القيمة null والمثيل هذا (acc) سنقوم بإسناد جميع البيانات فيه لنقوم بعرضها على صفحة الـ view الخاصة بإرجاع جميع المواطنين.

في السطر الثاني في ذلك الاسلوب قمنا بعمل مثيل *instance* من الفئة **HttpClient**:

```csharp
HttpClient client = new HttpClient();
```

فئة الـ **HttpClient** هي محور استدعاء البيانات من مشروع الـ Web Service ، هذه الفئة بها خاصية تساعدنا على تحديد الرابط الذي سنستخدمه في جلب البيانات..او قل بمعنى آخر الرابط الذي سيوفره لنا المسؤول من تطبيق الـWeb API. وإذا لاحظت قمنا بتعريف الرابط في أعلى الفئة وتأخذ النوع النصي **String** وتوضح رقم المنفذ لدىّ **3570** والذي يعمل على بيئة التشغيل لدىّ *work station* من خلال الـ **IIS Express**

```csharp
String myBaseAddress = "http://localhost:3570/";
```

وهذه الخاصية من النوع الذي يمكن تغييره وجلبه:

```csharp
public Uri BaseAddress { get; set; }
```

في السطر الرابع قمنا بإستدعاء (*Property)* الخاصية **DefaultRequestHeaders** والتي من خلالها سنوضح أي صيغة من صيغ البيانات نود ارجاعهُ من خلال مشروع الـ Web API حيث قمت بعمل تنظيف لجميع الصيغ اولاً وفي السطر الذي يليه قمت بتحديد نوع الصيغة التي أود إرجاعها وهي من النوع **json** ، والخاصية **DefaultRequestHeaders** عبارة عن قارئ فقط اي **ReadOnly** وهي كالتالي:

```csharp
public HttpRequestHeaders DefaultRequestHeaders { get; }
```

في السطر السادس في الاسلوب GetAllPersons قمنا بإستخدام فئة **HttpRsponseMessage** والتي من خلاها سنستدعي الأسلوب الموجود بمشروع الـ Web API نفسه من خلال الرابط الذي قمنا بتعريفه في المثيل **client** من خلال الفئة **HttpClient** ولو لاحظت هنا قمت بإستخدام كلمة *await* والتي ستقوم بعمل **قفل** حتى يتم الانتهاء من استدعاء جميع المواطنين للطلب **Request** ومن خلال المثيل **response** سنختبر نجاح العملية عن طريق الخاصية **IsSuccessStatusCode** ومن ثم سنقوم بإرجاع الصفحة التي سيتم عليها عرض جميع المواطنين...لأن جميع البيانات ستضمّن في المثيل **response** والذي بدوره سينقل البيانات للمثيل الذي أنشأناه أولا **acc**.

حسنا قم بالضغط بالزر الأيمن للمؤشر (ماوس) على الاسلوب GetAllPersons وقم بإختيار Add View وقم بالضغط على Add مباشرة..سيقوم الفيجوال ستديو بإنشاء صفحة Html داخل الملف Views داخل الملف BankAccount لذلك الإسلوب... وقم بلصق الشفرة التالية داخل الصفحة:

```csharp
@model IEnumerable<ASPNETConsumeWebApi.Models.AccountDetail> @ { ViewBag.Title = "GetAllPersons";
}

<table>
    <tr>
        <td colspan="2" style="background-color:#808080;text-align:center;color:white;">جميع المواطنين</td>
    </tr>
    @foreach (var person in Model)
    {

        <tr>
            <td>@Html.ActionLink("قم بفتح حساب جديد", "OpenAccountForPersonHas", new { id = person.PersonID })</td>
            <td><h6>@person.Name</h6></td>
        </tr>
    }
</table>
```

هذه صفحة Html عادية جدا..بها جدول يوجد به اسماء المواطنين وامام كل مواطن يوجد رابط سنقلنا للإسلوب **OpenAccountForPersonHas** والذي مهمته فتح الحساب البنكي

> ملاحظة: دائما ما اكتب فتح حساب بنكي؛ فهذه طريقة إجرائية للشرح...مهمتي هنا ليست لإنشاء قاعدة بيانات لفتح الحسابات لبنك ما؛ بل لشرح إستدعاء مشروع الـ Web API من خلال روابط محددة تأخذ جميع الإجراءات من التطبيق...فإن أردت ان تقوم بعمل قاعدة بيانات داخل مشروع العميل Client/Consume فبإمكانك عمل هذا بإتمام عملية فتح الحساب البنكي...لكن الإجراء هنا اذا كان جواز المواطن ساري قم بفتح حساب واذا غير ذلك لن يتم فتح حساب.

الإسلوب الآخر **OpenAccountForPersonHas** لا يختلف كثيرا عن الإسلوب الاول فقط يكمن الفرق في هذا الاسلوب يأخذ معامل *Parameter* ليقوم بإرجاع مواطن واحد من الاسلوب **ValidToOpenAccountForCustomer** والذي يوجد بمشروع الـ Web API

```csharp
HttpResponseMessage response =
    await client.GetAsync($"api/persons/ValidToOpenAccountForCustomer/{id}");
```

لقد قمت بإستخدام الـ *String Interpolation* بإستخدام علامة الدولار **$** قبل فتح علامتي تنصيص **" "** والتي ستساعدني في القوائم المنسدلة التي يقوم الفيجوال بإستدعائها اثناء كتابة الجملة النصية نفسها..لاحظ الصورة ادناه.

![](https://informatic-ar.com/wp-content/uploads/2018/08/4-300x100.png)

يقوم ذلك الاسلوب بإرجاع صفحة لفتح حساب المواطن في حال كان الجواز ساري المفعول...وإلا سيقوم بعرض رسالة توضح عدم سريان الجواز للتمكن من فتح حساب بنكي جديد في صفحة **InvalidDocument**

الآن قم بإنشاء صفحة Html View لهذا الاسلوب وقم بلصق الشفرة التالية داخلها

```csharp
@model ASPNETConsumeWebApi.Models.AccountDetail @ { ViewBag.Title = "OpenAccountForPersonHas";
}

<h2>فتح حساب لعميل </h2>
<table>
    <tr>
        <td><input type="button" value="Open new account" style="width:200px;"/></td>
        <td><h4>@Model.Name</h4></td>
    </tr>
</table>
```

أيضا قم بعمل صفحة Html View وأعطها الاسم InvalidDocument وألصق بها الشفرة التالية:

```csharp
@ { Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title></title>
</head>
<body>
    <div>
        <h1>عفوا لا تستطيع فتح حساب لهذا المواطن نسبة لعدم صلاحية وثيقته الرسمية</h1>
    </div>
</body>
</html>
```

الآن قم بتشغيل التطبيقين تطبيق الـ **Web API** والتطبيق الذي تعمل عليه...تطبيق Web API سيتيح لنا قراءة المنفذ الذي موضحّ في السطر الأول من فئة **BackAccountController** الذي يأخذ النوع String وسيكون نشط دائما وإلا لن نستطيع إستدعاء البيانات من خلاله داخل مشروع العميل Client/Consume

قم بكتابة الرابط التالي داخل متصفحك

```csharp
http: //localhost:1788/BankAccount/GetAllPersons
```

> لا تنسى بأن المنفذ سيكون مختلفا لديك..وذلك لأنني أستخدم الـ IIS Express والذي يتم تثبيته أثناء تثبيت الفيجوال ستديو...لذلك قم بتشغيل التطبيق أولا ومن ثم؛ قم بلصق اسم فئة التحكم والاسلوب المعني.

هذا الرابط مهمته إرجاع جميع المواطنين...وسيقوم بإظهارهم لنا في صفحة الـمتصفح في صورة منسقة عكسا من عرضها على صيغة XML أو json التي تظهر من خلال مشروع الـ Web API service

ستظهر معك تلك البيانات كما موضح أدناه بالصورة:

![](https://informatic-ar.com/wp-content/uploads/2018/08/6-300x169.png)

في حال تمريرك للمؤشر (ماوس) فوق الرابط **قم بفتح حساب جديد** للمواطن الذي رقمه **1** أنظر لأسفل الشاشة كما موضح بالصورة التالية

![](https://informatic-ar.com/wp-content/uploads/2018/08/7-300x169.png)

ستوضح لك ماهو الأسلوب الذي سياخذه الرابط ... عند ضغطك على الرابط ستظهر معك بيانات المواطن والذي اسمه Person one ويوجد زر سينقلك لصفحة فتح حساب بنكي جديد.

![](https://informatic-ar.com/wp-content/uploads/2018/08/8-300x169.png)

قم بالضغط على **الرابط الثالث** للمواطن **Person Three** سيعرض لك الصفحة التالية:

![](https://informatic-ar.com/wp-content/uploads/2018/08/9-300x169.png)

ولأن ذلك المواطن جوازه غير ساري المفعول ستظهر معنا الرسالة الموضحة في الصورة اعلاها والتي تقرأ من صفحة **InvalidDocument**. لأن الحقل **IsProcessFininshing** لهذا المواطن *False* كما قمنا بتعديله في بداية تلك المقالة.

في حال أردت ان تقوم بإتمام عملية فتح الحساب البنكي بإمكانك إنشاء قاعدة بيانات داخل مشروع **ASPNETConsumeWebApi** وداخل قاعدة البيانات قم بإنشاء جدول به تفاصيل رئيسية لمعلومات فتح الحساب...بعدها قم بعمل أسلوب (*Action Result*) داخل فئة **BankAccountController** مهمتها عمل تنفيذ لفتح الحساب وقم بتعديل طفيف داخل صفحة **OpenAccountForPersonHas** لتنفيذ الجملة المنطقية Logic لزر فتح الحساب لينقلك لصفحة فتح الحساب.

أيضا إذا أردت ان تقوم بإختبار الشفرات فمن السهولة بمكان عمل الاختبار فقط قم بعمل مثيل instance لفئة الـ **HttpClient** من خلال المكتبة **Moq** لتستطيع العمل بصورة غير حقيقية virtual داخل بيئة إختبار الأكواد من خلال الفيجوال ستديو.

تحياتي - محمد