HTTP Authorization header not working

roopteja Source

I have the following angular code in which I had set the access_token also.

import { HttpClient } from '@angular/common/http';
import { Router } from '@angular/router';
import { HttpHeaders } from '@angular/common/http';
import { Headers, Response } from '@angular/http';


const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type': 'application/json',
    // tslint:disable-next-line:max-line-length
    'Authorization': 'bearer zhGMjEFn5SlPYPB4opK57CiPP02MuR-lk10rvYsGU0PcQUyo5U6JHaH5NgdmDpNHSfrkuDLZYIr3xAio_aG0WZbKWM28dgP9BN2i-ERS8PQ97_oXP93AVzHj60RivH5EsfImmEb3mPSSEw68lafAQHe4kQyEptkxTtYlfPczrdQR4hWVOkvA_Hk8JuxFQpUmj0ReRhP5xXfoJcsbOsLpSqcq2xj0GfapcGbvHiHR0hlXTXU9cELnGObXSgDVs1UDpM4pPcFb2CrG7aFCFoULYSe9yBpsn7RepYzomAIrF9hEo2_v_877x7HkVGAMBFd9Ij70jp5DbVumTkZuM9vRG8uDNwaOCsvbsEvZlBjpR4JO0b508vUyKPFctA5O6yzfLKMhpRtcj61HrvWrMqx3BehO-fSM-hmQUd1clH5dD_xX4P9wtR1oPZxNS7bVgUiNnUPkGocqMVS5p0SYyowzz7yKHu8tIpaTAQLPIbePcU6ewtGCBUSzUVZZB7jl5Vte'
  })
};
  this.Http.get<Teacher>(this.API_URL + 'Teacher/GetTeachers', { headers: this.header }).subscribe(data => {
      this.Results = data as Teacher;
      console.log('Results' + this.Results[0]);
      console.log(this.Results);
    });

After sending this request i am getting the following error.

The requested resource does not support http method 'OPTIONS' Can anyone please help me out.

c#angularasp.net-web-api2angular5angular-http

Answers

answered 7 months ago G_S #1

I had similar issue previously and I forgot Enabling cors at my server side.

public static void Register(HttpConfiguration config)
{
    // Forgot adding below line.
    config.EnableCors();
}

Is it something that you can check in your WebApiConfig.cs?

answered 7 months ago user1643799 #2

i had a similar issue when i was working on the back end of an application while a colleague was doing the front end in angular. i believe we were using basic authentication.

in the end what worked was adding Access-Control-Allow-Methods to the web.config.

<httpProtocol>
  <customHeaders>
    <add name="Access-Control-Allow-Origin" value="*" />
    <add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept, Cache-Control, Authorization, authorization" />
    <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
  </customHeaders>
</httpProtocol>

note: the above will allow prety much anything. you might want to limit the allow origin, and methods to what you need.

Edit: found the old code. i also made additions to Application_BeginRequest method in global.asax.cs

protected void Application_BeginRequest()
    {
        if (HttpContext.Current.Request.HttpMethod == "OPTIONS")
        {
            //These headers are handling the "pre-flight" OPTIONS call sent by the browser
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Content-Type, Accept, Authorization");
            HttpContext.Current.Response.AddHeader("Access-Control-Max-Age", "1728000");
            HttpContext.Current.Response.End();
        }
    }

hope it helps.

edit2: also found one more web.config change

<handlers>
  <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
  <remove name="OPTIONSVerbHandler" />
  <remove name="TRACEVerbHandler" />
  <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
</handlers>

comments powered by Disqus