解決dotnet-Angular的跨域(cors)問題

時間 2020-02-01

標籤解決 dotnet angular cors 問題欄目 AngularJS 简体版

原文原文鏈接

解決dotnet-Angular的跨域(cors)問題

前言

以前學了點 Angular ，打算用 dotnet core 作後端，以前沒接觸過這方面的東西，理所固然的遇到了跨域問題，以後也解決了，因此在此作個記錄後端

碰到的問題

在使用 dotnet cli 生成的 angular 模板中跨域

大概有一段代碼是這樣寫的 (若是 3.1 後面的版本沒改動的話)app

angular 和 dotnet 同時啓動，也必須同時結束cors

這個時候兩個項目運行在同一個"域"下，大概是 localhost:5000 這種的ide

這樣並不方便調試，dotnet 部分須要改動的時候，angular 也須要停掉visual-studio

因此 dotnet 相關文檔給出了一個解決方案ui

雖然方便了開發,可是以後大概就會出現一些跨域訪問失敗的問題了(反正不知怎麼的,我就碰到這問題了)spa

如何解決

主要修改 startup 中的代碼3d

ConfigureServices 中添加如下代碼調試

services.AddCors(options =>
{
    options.AddPolicy("隨便起個名字",
    builder => builder.AllowAnyOrigin()
    .AllowAnyHeader().AllowAnyMethod());
});

而後在 Configure 中添加

app.UseCors("上面隨便起的那個名字");

以後大概就能夠了

若是有不一樣的需求,能夠添加不一樣的跨域策略

services.AddCors(options =>
{
    options.AddPolicy("隨便起個名字",
    builder => builder.AllowAnyOrigin()
    .AllowAnyHeader().AllowAnyMethod())

    options.AddPolicy("隨便起個名字#2",
    builder => builder.AllowAnyMethod());
});

而後在使用的時候本身選擇就行了

補充

當使用 AllowAnyOrigin 的時候,容許全部域,若是但願可以指定域,可使用 WithOrigins

services.AddCors(options =>
{
    options.AddPolicy("angular",
    builder => builder.WithOrigins("http://localhost:4200","http://localhost:8080")
    .AllowAnyHeader().AllowAnyMethod());
});

因爲angular默認用4200端口

寫成這樣大概就行了