JSONP з веб-API ASP.NET

Я працюю над створенням нового набору сервісів у ASP.MVC MVC 4 за допомогою Web API. Поки це чудово. Я створив сервіс і змусив його працювати, і тепер я намагаюся споживати його за допомогою JQuery. Я можу повернути рядок JSON за допомогою Fiddler, і, здається, це нормально, але оскільки служба існує на окремому сайті, намагаюся викликати її з помилками JQuery із пунктом "Не дозволено". Отже, це явно випадок, коли мені потрібно використовувати JSONP.

Я знаю, що веб-API новий, але сподіваюся, що хтось там може мені допомогти.

Як здійснити дзвінок до методу Web API за допомогою JSONP?

Задавши це питання, я нарешті знайшов те, що мені потрібно, тож відповідаю на нього.

Я наткнувся на цей JsonpMediaTypeFormatter . Додайте його до Application_Startсвого global.asax, зробивши це:

var config = GlobalConfiguration.Configuration;
config.Formatters.Insert(0, new JsonpMediaTypeFormatter());

і вам добре подзвонити з викликом JQuery AJAX, який виглядає приблизно так:

$.ajax({
    url: 'http://myurl.com',
    type: 'GET',
    dataType: 'jsonp',
    success: function (data) {
        alert(data.MyProperty);
    }
})

Здається, це працює дуже добре.

Ось оновлена ​​версія JsonpMediaTypeFormatter для використання з WebAPI RC:

public class JsonpMediaTypeFormatter : JsonMediaTypeFormatter
{
    private string callbackQueryParameter;

    public JsonpMediaTypeFormatter()
    {
        SupportedMediaTypes.Add(DefaultMediaType);
        SupportedMediaTypes.Add(new MediaTypeHeaderValue("text/javascript"));

        MediaTypeMappings.Add(new UriPathExtensionMapping("jsonp", DefaultMediaType));
    }

    public string CallbackQueryParameter
    {
        get { return callbackQueryParameter ?? "callback"; }
        set { callbackQueryParameter = value; }
    }

    public override Task WriteToStreamAsync(Type type, object value, Stream stream, HttpContent content, TransportContext transportContext)
    {
        string callback;

        if (IsJsonpRequest(out callback))
        {
            return Task.Factory.StartNew(() =>
            {
                var writer = new StreamWriter(stream);
                writer.Write(callback + "(");
                writer.Flush();

                base.WriteToStreamAsync(type, value, stream, content, transportContext).Wait();

                writer.Write(")");
                writer.Flush();
            });
        }
        else
        {
            return base.WriteToStreamAsync(type, value, stream, content, transportContext);
        }
    }


    private bool IsJsonpRequest(out string callback)
    {
        callback = null;

        if (HttpContext.Current.Request.HttpMethod != "GET")
            return false;

        callback = HttpContext.Current.Request.QueryString[CallbackQueryParameter];

        return !string.IsNullOrEmpty(callback);
    }
}

Ви можете використовувати ActionFilterAttribute так:

public class JsonCallbackAttribute : ActionFilterAttribute
{
    private const string CallbackQueryParameter = "callback";

    public override void OnActionExecuted(HttpActionExecutedContext context)
    {
        var callback = string.Empty;

        if (IsJsonp(out callback))
        {
            var jsonBuilder = new StringBuilder(callback);

            jsonBuilder.AppendFormat("({0})", context.Response.Content.ReadAsStringAsync().Result);

            context.Response.Content = new StringContent(jsonBuilder.ToString());
        }

        base.OnActionExecuted(context);
    }

    private bool IsJsonp(out string callback)
    {
        callback = HttpContext.Current.Request.QueryString[CallbackQueryParameter];

        return !string.IsNullOrEmpty(callback);
    }
}

Потім поставте це на свою дію:

[JsonCallback]
public IEnumerable<User> User()
{
    return _user;
}

Безумовно, відповідь Брайана є правильною, але якщо ви вже використовуєте формат Json.Net, який дає вам досить json дати та більш швидку серіалізацію, то ви не можете просто додати другий форматтер для jsonp, вам доведеться поєднати два. Корисно використовувати його в будь-якому випадку, оскільки Скотт Хензельман сказав, що при випуску веб-API ASP.NET використовується стандартний серіалізатор Json.Net.

public class JsonNetFormatter : MediaTypeFormatter
    {
        private JsonSerializerSettings _jsonSerializerSettings;
        private string callbackQueryParameter;

        public JsonNetFormatter(JsonSerializerSettings jsonSerializerSettings)
        {
            _jsonSerializerSettings = jsonSerializerSettings ?? new JsonSerializerSettings();

            // Fill out the mediatype and encoding we support
            SupportedMediaTypes.Add(new MediaTypeHeaderValue("application/json"));
            Encoding = new UTF8Encoding(false, true);

            //we also support jsonp.
            SupportedMediaTypes.Add(new MediaTypeHeaderValue("text/javascript"));
            MediaTypeMappings.Add(new UriPathExtensionMapping("jsonp", "application/json"));
        }

        public string CallbackQueryParameter
        {
            get { return callbackQueryParameter ?? "jsoncallback"; }
            set { callbackQueryParameter = value; }
        }

        protected override bool CanReadType(Type type)
        {
            if (type == typeof(IKeyValueModel))
                return false;

            return true;
        }

        protected override bool CanWriteType(Type type)
        {
            return true;
        }

        protected override Task<object> OnReadFromStreamAsync(Type type, Stream stream, HttpContentHeaders contentHeaders,
            FormatterContext formatterContext)
        {
            // Create a serializer
            JsonSerializer serializer = JsonSerializer.Create(_jsonSerializerSettings);

            // Create task reading the content
            return Task.Factory.StartNew(() =>
            {
                using (StreamReader streamReader = new StreamReader(stream, Encoding))
                {
                    using (JsonTextReader jsonTextReader = new JsonTextReader(streamReader))
                    {
                        return serializer.Deserialize(jsonTextReader, type);
                    }
                }
            });
        }

        protected override Task OnWriteToStreamAsync(Type type, object value, Stream stream, HttpContentHeaders contentHeaders,
            FormatterContext formatterContext, TransportContext transportContext)
        {
            string callback;
            var isJsonp = IsJsonpRequest(formatterContext.Response.RequestMessage, out callback);

            // Create a serializer
            JsonSerializer serializer = JsonSerializer.Create(_jsonSerializerSettings);

            // Create task writing the serialized content
            return Task.Factory.StartNew(() =>
            {
                using (JsonTextWriter jsonTextWriter = new JsonTextWriter(new StreamWriter(stream, Encoding)) { CloseOutput = false })
                {
                    if (isJsonp)
                    {
                        jsonTextWriter.WriteRaw(callback + "(");
                        jsonTextWriter.Flush();
                    }

                    serializer.Serialize(jsonTextWriter, value);
                    jsonTextWriter.Flush();

                    if (isJsonp)
                    {
                        jsonTextWriter.WriteRaw(")");
                        jsonTextWriter.Flush();
                    }
                }
            });
        }

        private bool IsJsonpRequest(HttpRequestMessage request, out string callback)
        {
            callback = null;

            if (request.Method != HttpMethod.Get)
                return false;

            var query = HttpUtility.ParseQueryString(request.RequestUri.Query);
            callback = query[CallbackQueryParameter];

            return !string.IsNullOrEmpty(callback);
        }
    }

Реалізація Ріка Штраля найкраще працювала для мене з RC.

JSONP працює лише з Http GET-запитом. У веб-api asp.net є підтримка CORS, яка добре працює з усіма дієсловами http.

Ця стаття може бути корисною для вас.

Оновлено

public class JsonpMediaTypeFormatter : JsonMediaTypeFormatter
    {
        private string callbackQueryParameter;

        public JsonpMediaTypeFormatter()
        {
            SupportedMediaTypes.Add(DefaultMediaType);
            SupportedMediaTypes.Add(new MediaTypeHeaderValue("text/javascript"));

            MediaTypeMappings.Add(new UriPathExtensionMapping("jsonp", DefaultMediaType));
        }

        public string CallbackQueryParameter
        {
            get { return callbackQueryParameter ?? "callback"; }
            set { callbackQueryParameter = value; }
        }

        public override Task WriteToStreamAsync(Type type, object value, Stream writeStream, HttpContent content, TransportContext transportContext)
        {
            string callback;

            if (IsJsonpRequest(out callback))
            {
                return Task.Factory.StartNew(() =>
                {
                    var writer = new StreamWriter(writeStream);
                    writer.Write(callback + "(");
                    writer.Flush();

                    base.WriteToStreamAsync(type, value, writeStream, content, transportContext).Wait();

                    writer.Write(")");
                    writer.Flush();
                });
            }
            else
            {
                return base.WriteToStreamAsync(type, value, writeStream, content, transportContext);
            }
        }

        private bool IsJsonpRequest(out string callback)
        {
            callback = null;

            if (HttpContext.Current.Request.HttpMethod != "GET")
                return false;

            callback = HttpContext.Current.Request.QueryString[CallbackQueryParameter];

            return !string.IsNullOrEmpty(callback);
        }
    }

Ось оновлена ​​версія з кількома вдосконаленнями, яка працює з RTM-версією веб-API.

• Вибирає правильне кодування на основі власних Accept-Encodingзаголовків запиту . У new StreamWriter()попередніх прикладах було б просто використовувати UTF-8. Заклик доbase.WriteToStreamAsync може використовувати інше кодування, що призводить до пошкодження виводу.
• Карти JSONP запитів до application/javascript Content-Typeзаголовка; попередній приклад виводить JSONP, але із application/jsonзаголовком. Ця робота виконується в вкладеному Mappingкласі (пор. Найкращий тип вмісту для обслуговування JSONP? )
• Відмовляється від побудови та промивання накладних даних StreamWriterта безпосередньо отримує байти і записує їх у вихідний потік.
• Замість того, щоб чекати завдання, використовуйте ContinueWithмеханізм Паралельної бібліотеки завдань, щоб зв’язати кілька завдань разом.

Код:

public class JsonpMediaTypeFormatter : JsonMediaTypeFormatter
{
  private string _callbackQueryParameter;

  public JsonpMediaTypeFormatter()
  {
    SupportedMediaTypes.Add(DefaultMediaType);
    SupportedMediaTypes.Add(new MediaTypeHeaderValue("application/javascript"));

    // need a lambda here so that it'll always get the 'live' value of CallbackQueryParameter.
    MediaTypeMappings.Add(new Mapping(() => CallbackQueryParameter, "application/javascript"));
  }

  public string CallbackQueryParameter
  {
    get { return _callbackQueryParameter ?? "callback"; }
    set { _callbackQueryParameter = value; }
  }

  public override Task WriteToStreamAsync(Type type, object value, Stream writeStream, HttpContent content,
                                          TransportContext transportContext)
  {
    var callback = GetCallbackName();

    if (!String.IsNullOrEmpty(callback))
    {
      // select the correct encoding to use.
      Encoding encoding = SelectCharacterEncoding(content.Headers);

      // write the callback and opening paren.
      return Task.Factory.StartNew(() =>
        {
          var bytes = encoding.GetBytes(callback + "(");
          writeStream.Write(bytes, 0, bytes.Length);
        })
      // then we do the actual JSON serialization...
      .ContinueWith(t => base.WriteToStreamAsync(type, value, writeStream, content, transportContext))

      // finally, we close the parens.
      .ContinueWith(t =>
        {
          var bytes = encoding.GetBytes(")");
          writeStream.Write(bytes, 0, bytes.Length);
        });
    }
    return base.WriteToStreamAsync(type, value, writeStream, content, transportContext);
  }

  private string GetCallbackName()
  {
    if (HttpContext.Current.Request.HttpMethod != "GET")
      return null;
    return HttpContext.Current.Request.QueryString[CallbackQueryParameter];
  }

  #region Nested type: Mapping

  private class Mapping : MediaTypeMapping
  {
    private readonly Func<string> _param; 

    public Mapping(Func<string> discriminator, string mediaType)
      : base(mediaType)
    {
      _param = discriminator;
    }

    public override double TryMatchMediaType(HttpRequestMessage request)
    {
      if (request.RequestUri.Query.Contains(_param() + "="))
        return 1.0;
      return 0.0;
    }
  }

  #endregion
}

Я знаю про "хакітність" Func<string>параметра в конструкторі внутрішнього класу, але це був найшвидший спосіб вирішити проблему, яку він вирішує - оскільки C # має лише статичні внутрішні класи, він не може бачити CallbackQueryParameterвластивість. Передача Funcв прив'язує властивість у лямбда, тому Mappingзможете отримати доступ до неї пізніше в TryMatchMediaType. Якщо у вас є більш елегантний спосіб, будь ласка, коментуйте!

На жаль, у мене недостатньо репутації для коментарів, тому я опублікую відповідь. @Justin порушив питання про запуск форматера WebApiContrib.Formatting.Jsonp поряд зі стандартним JsonFormatter. Це питання вирішено в останньому випуску (фактично випущеному деякий час тому). Крім того, він повинен працювати з останньою версією Web API.

johperl, Thomas. Відповідь, надана Пітером Мобергом вище, повинна бути правильною для RC-версії, оскільки JsonMediaTypeFormatter, який він успадковує з уже використовуваного серіалізатора NewtonSoft Json, і тому те, що він має, повинен працювати з будь-якими змінами.

Однак чому на землі люди все ще використовують параметри, коли ви могли просто зробити наступне

public override Task WriteToStreamAsync(Type type, object value, Stream stream, HttpContentHeaders contentHeaders, TransportContext transportContext)
        {
            var isJsonpRequest = IsJsonpRequest();

            if(isJsonpRequest.Item1)
            {
                return Task.Factory.StartNew(() =>
                {
                    var writer = new StreamWriter(stream);
                    writer.Write(isJsonpRequest.Item2 + "(");
                    writer.Flush();
                    base.WriteToStreamAsync(type, value, stream, contentHeaders, transportContext).Wait();
                    writer.Write(")");
                    writer.Flush();
                });
            }

            return base.WriteToStreamAsync(type, value, stream, contentHeaders, transportContext);
        }

        private Tuple<bool, string> IsJsonpRequest()
        {
            if(HttpContext.Current.Request.HttpMethod != "GET")
                return new Tuple<bool, string>(false, null);

            var callback = HttpContext.Current.Request.QueryString[CallbackQueryParameter];

            return new Tuple<bool, string>(!string.IsNullOrEmpty(callback), callback);
        }

Замість розміщення власної версії формату JSONP ви можете встановити пакет WebApiContrib.Formatting.Jsonp NuGet з уже реалізованим (виберіть версію, яка працює для вашого .NET Framework).

Додайте цей формат Application_Start:

GlobalConfiguration.Configuration.Formatters.Insert(0, new JsonpMediaTypeFormatter(new JsonMediaTypeFormatter()));

Для тих із вас, хто використовує HttpSelfHostServer, цей розділ коду не працює на HttpContext.Current, оскільки він не існує на самому сервері хоста.

private Tuple<bool, string> IsJsonpRequest()
{
if(HttpContext.Current.Request.HttpMethod != "GET")
 return new Tuple<bool, string>(false, null);
 var callback = HttpContext.Current.Request.QueryString[CallbackQueryParameter];
 return new Tuple<bool, string>(!string.IsNullOrEmpty(callback), callback);
 }

Однак ви можете перехопити "контекст" самовлаштування через це переопрацювання.

public override MediaTypeFormatter GetPerRequestFormatterInstance(Type type, HttpRequestMessage request, MediaTypeHeaderValue mediaType)
        {
            _method = request.Method;
            _callbackMethodName =
                request.GetQueryNameValuePairs()
                       .Where(x => x.Key == CallbackQueryParameter)
                       .Select(x => x.Value)
                       .FirstOrDefault();

            return base.GetPerRequestFormatterInstance(type, request, mediaType);
        }

Запит. Метод дасть вам "GET", "POST" тощо, і GetQueryNameValuePairs може отримати параметр "зворотний виклик". Таким чином мій переглянений код виглядає так:

private Tuple<bool, string> IsJsonpRequest()
 {
     if (_method.Method != "GET")
     return new Tuple<bool, string>(false, null);

     return new Tuple<bool, string>(!string.IsNullOrEmpty(_callbackMethodName), _callbackMethodName);
}

Сподіваюся, це допоможе комусь із вас. Таким чином, вам не обов’язково потрібна прошивка HttpContext.

C.

Перевірте це. Подивіться, чи допомагає це.

JSONP з веб-API

Якщо контекст - це Web Apiподяка та посилання на 010227leoвідповідь, ви повинні врахувати WebContext.Currentзначення, яке буде null.

Тому я оновив його код до цього:

public class JsonCallbackAttribute
    : ActionFilterAttribute
{
    private const string CallbackQueryParameter = "callback";

    public override void OnActionExecuted(HttpActionExecutedContext context)
    {
        var callback = context.Request.GetQueryNameValuePairs().Where(item => item.Key == CallbackQueryParameter).Select(item => item.Value).SingleOrDefault();

        if (!string.IsNullOrEmpty(callback))
        {
            var jsonBuilder = new StringBuilder(callback);

            jsonBuilder.AppendFormat("({0})", context.Response.Content.ReadAsStringAsync().Result);

            context.Response.Content = new StringContent(jsonBuilder.ToString());
        }

        base.OnActionExecuted(context);
    }
}

Ми можемо вирішити проблему CORS (перехресного походження ресурсів) двома способами,

1) Використання Jsonp 2) Увімкнення Корсів

1) Використовуючи Jsonp- щоб використовувати Jsonp, нам потрібно встановити пакунок нуля WebApiContrib.Formatting.Jsonp і потрібно додати JsonpFormmater в WebApiConfig.cs з посиланням скріншотів,

Код Jquery

2) Увімкнення Корсів -

щоб увімкнути диски, нам потрібно додати пакунок нульового пакета Microsoft.AspNet.WebApi.Cors і потрібно включити диски у скріншоті WebApiConfig.cs.

Для отримання додаткової довідки, ви можете посилатися на мій зразок репо на GitHub за наступним посиланням. https://github.com/mahesh353/Ninject.WebAPi/tree/develop