AllowAnyOrigin Cors不工作Axios Vuejs

时间:2017-11-14 19:52:42

标签: asp.net-core vue.js cors vuejs2 axios

我有一台服务器,我已经设置,在生产中运行,我们有大量的应用程序调用此Web服务器。下面的代码是为了证明它允许任何原始请求。

 public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)
        {
        loggerFactory.AddConsole(Configuration.GetSection("Logging"));
        loggerFactory.AddDebug();

        app.UseExceptionHandler("/Home/Error");

        app.UseStaticFiles();

        app.UseCors(builder =>
        {
            builder.AllowAnyOrigin()
                    .AllowAnyMethod()
                    .AllowAnyHeader();
        });

这适用于当前设置的所有服务器。它位于我们的内部网络上,其他服务器将在内部使用此服务。

我正在创建一个概念验证,使用Vue来缓慢地尝试使应用程序现代化。除了axios这个请求出错之外。调用此方法的其他服务器也使用.net,但它应该构建相同的请求。

这是错误。

  

无法加载https:// {server} / api / application / 36626:请求的资源上没有“Access-Control-Allow-Origin”标头。因此,不允许原点“http://localhost:8080”访问。

这显然是axios的疯狂谈话。我允许任何出身。我无法想象我们只想使用“简单请求”,因此简单请求的w3标准可能无效。我想也许这可能是一个不正确的错误,因为这是从服务器返回的octet-stream。代码如下。

<script>
import axios from 'axios'

export default {
  name: 'AppList',
  data () {
    return {
      applist: [],
      errors: []
    }
  },
  created: function() {
    axios.get('https://{server}/api/application/36626')
      .then(r => { console.log(response); })
      .catch(ex => {
        this.errors.push(ex);
      })
  }
}
</script>

编辑我对此计算机拥有完全的权限,我已经确认我可以使用本地计算机上的Postman GET请求,没有任何问题。

编辑2 工作卷曲命令curl -X GET --header 'Accept: application/octet-stream' 'https://{server}/api/Application/36626'

2 个答案:

答案 0 :(得分:4)

事实证明.Net核心服务器设置不正确,直到我尝试在本地计算机上使用浏览器时才出现CORS问题。

我不确定CORS实施是否发生了变化而且我不知道,或者我是否从一开始就没有做到这一点,但我确信我遵循了指南。

我改变的第一件事是确保在配置应用程序以使用MVC之前添加了Cors Policy。

我做的第二件事,我怀疑这是可选的,但最佳做法是,我还将策略逻辑移至ConfigureServices方法。

我的最终代码如下所示。我保持尽可能多的保持秩序。

 public void ConfigureServices(IServiceCollection services)
        {
            // Add framework services.
            services.AddCors(options =>
            {
                options.AddPolicy("CorsPolicy",
                    builder => builder.AllowAnyOrigin()
                    .AllowAnyMethod()
                    .AllowAnyHeader()
                    .AllowCredentials());
            });
            services.AddOptions();
            services.AddSwaggerGen();
            ///Authentication configuration went here.
            services.AddSingleton<IConfiguration>(Configuration);
            services.AddMvc();

        }

    // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
    public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)
    {
        loggerFactory.AddConsole(Configuration.GetSection("Logging"));
        loggerFactory.AddDebug();

        app.UseExceptionHandler("/Home/Error");
        app.UseStaticFiles();
        app.UseCors("CorsPolicy");

        app.UseMvc(routes =>
        {
            routes.MapRoute(
                name: "default",
                template: "{controller=Home}/{action=Index}/{id?}");
        });

        app.UseSwagger((httpRequest, swaggerDoc) =>
        {
            swaggerDoc.Host = httpRequest.Host.Value;

        });
        app.UseSwaggerUi(swaggerUrl: "/{appname}/swagger/v1/swagger.json");

答案 1 :(得分:0)

对于PUT和DELETE方法,激活cors对我不起作用,我要做的是在web.config文件中添加一些配置行以删除WebDav模块。

我在web.config文件中现有标签system.webServer标记中使用了

<modules runAllManagedModulesForAllRequests="false">
    <remove name="WebDAVModule" />
</modules>

我在此站点中找到了以下行:

修改web.config https://hovercraft.ie/asp-net-core-web-api-put-delete-methods-not-allowed-405-error/

希望这会有所帮助。