Question

我使用另一个站点的Angular 6和API。

我遇到了这个错误

Failed to load https://dashboard.revain.org/api/v1/projects?perPage=100&period=1d&page=1&sort=rank&direction=DESC: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://beta-rev.azurewebsites.net' is therefore not allowed access.

此扩展“ Allow-Control-Allow-Origin：*”一切都很好但是我需要每个人都看得到我所看到的。

所以我用这个属性搜索并制作了web.config

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
 <modules runAllManagedModulesForAllRequests="true" />
      <httpProtocol>
        <customHeaders>
            <add name="Access-Control-Allow-Origin" value="*" />
            <add name="Access-Control-Allow-Methods" value="GET,PUT,POST,PATCH,DELETE,OPTIONS"/>
            <add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept"/>
        </customHeaders>
      </httpProtocol>
</system.webServer>
<system.webServer>
    <staticContent>
    <clientCache cacheControlMaxAge="30.00:00:00" cacheControlMode="UseMaxAge"/>
      <!-- use utf-8 encoding for anything served text/plain or text/html -->
      <!-- in the case of .html files; if you AJAX load html files (i.e. in angular) then remove these two lines. -->
      <remove fileExtension=".html"/>
      <mimeMap fileExtension=".html" mimeType="text/html; charset=UTF-8"/>
      <remove fileExtension=".css"/>
      <mimeMap fileExtension=".css" mimeType="text/css"/>
      <remove fileExtension=".js"/>
      <mimeMap fileExtension=".js" mimeType="text/javascript"/>
      <remove fileExtension=".json"/>
      <mimeMap fileExtension=".json" mimeType="application/json"/>
      <remove fileExtension=".rss"/>
      <mimeMap fileExtension=".rss" mimeType="application/rss+xml; charset=UTF-8"/>
      <remove fileExtension=".xml"/>
      <mimeMap fileExtension=".xml" mimeType="application/xml; charset=UTF-8"/>
      <remove fileExtension=".ico"/>
      <mimeMap fileExtension=".ico" mimeType="image/x-icon"/>
      <remove fileExtension=".webp"/>
      <mimeMap fileExtension=".webp" mimeType="image/webp"/>
      <remove fileExtension=".htc"/>
      <mimeMap fileExtension=".htc" mimeType="text/x-component"/>
      <remove fileExtension=".vcf"/>
      <mimeMap fileExtension=".vcf" mimeType="text/x-vcard"/>
      <remove fileExtension=".torrent"/>
      <mimeMap fileExtension=".torrent" mimeType="application/x-bittorrent"/>
      <remove fileExtension=".cur"/>
      <mimeMap fileExtension=".cur" mimeType="image/x-icon"/>
      <remove fileExtension=".webapp"/>
      <mimeMap fileExtension=".webapp" mimeType="application/x-web-app-manifest+json; charset=UTF-8"/>
    </staticContent>
</system.webServer>
<system.webServer>
    <rewrite>
      <rules>
        <rule name="Main Rule" stopProcessing="true">
                <match url=".*" />
                <conditions logicalGrouping="MatchAll">
                    <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                    <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                </conditions>
                <action type="Rewrite" url="./index.html" />
            </rule>
        </rules>
    </rewrite>
</system.webServer>
</configuration>

但是它显示了相同的错误。

Answer 1

您正试图从提供第一个资源的域（beta-rev.azurewebsites.net）之外的另一个域（dashboard.revain.org）请求资源。进一步了解Cross-Origin Resource Sharing。

要解决您的问题，您必须在beta-rev.azurewebsites.net域的 revain.org 上启用CORS。您无法在您的网络应用上执行此操作。

在Angular中使用CORS

1 个答案: