Base solution for your next web application
Open Closed

Angular/Web Api Deployment Problem #5477


User avatar
0
nikkariman025 created

I'm deploying my Angular and Web application on production server using Ms IIS (windows server). Both web service (Angular and Web API) deploy on same server with different port but the Angular web app having problem to access the web service with this error:

" Failed to load <a class="postlink" href="http://sst01.abc.gov:22742/AbpUserConfiguration/GetAll">http://sst01.abc.gov:22742/AbpUserConfiguration/GetAll</a>: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header contains multiple values 'http://sst01.abc.gov, *', but only one is allowed. Origin 'http://sst01.abc.gov' is therefore not allowed access. "

Web.config setting at Angular Web App

<rewrite> <rules> <rule name="Angular Routes" stopProcessing="true"> <match url="." /> <conditions logicalGrouping="MatchAll"> <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" /> <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" /> <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" /> </conditions> <action type="Rewrite" url="/" /> </rule> </rules> </rewrite> <httpProtocol> <customHeaders> <add name="Access-Control-Allow-Headers" value="" /> <add name="Access-Control-Allow-Methods" value="" /> <add name="Access-Control-Allow-Origin" value="" /> </customHeaders> </httpProtocol>

appconfig.json config at angular

{ "remoteServiceBaseUrl": "http://sst01.abc.gov:22742",

"appBaseUrl": "http://sst01.abc.gov", "localeMappings": [ { "from": "pt-BR", "to": "pt" }, { "from": "zh-CN", "to": "zh" }, { "from": "he-IL", "to": "he" } ] }

Web.config setting at Web API

<httpProtocol> <customHeaders> <remove name="X-Powered-By" />

    &lt;add name=&quot;Access-Control-Allow-Headers&quot; value=&quot;*&quot; /&gt;
    &lt;add name=&quot;Access-Control-Allow-Methods&quot; value=&quot;*&quot; /&gt;
    &lt;add name=&quot;Access-Control-Allow-Origin&quot; value=&quot;*&quot; /&gt;
  &lt;/customHeaders&gt;
&lt;/httpProtocol&gt;

Appsettings.json at Web API

"App": { "ServerRootAddress": "http://sst01.abc.gov:22742/", "ClientRootAddress": "http://sst01.abc.gov/", "CorsOrigins": "http://sst01.abc.gov,http://*" }

Thanks Nik


1 Answer(s)
  • User Avatar
    0
    maliming created
    Support Team
    <add name="Access-Control-Allow-Headers" value="*" />
    <add name="Access-Control-Allow-Methods" value="*" />
    <add name="Access-Control-Allow-Origin" value="*" />
    

    Remove the Access-Control-Allow* setting for Web.config and try again?

    NET core Cors middleware has handled cross-domain requests. No need to repeat configuration.