Header 'Access-Control-Allow-Origin' berisi beberapa nilai

104

Saya menggunakan AngularJS $ http di sisi klien untuk mengakses titik akhir aplikasi API Web ASP.NET di sisi server. Karena klien di-host di domain yang berbeda dengan server, saya memerlukan CORS. Ia bekerja untuk $ http.post (url, data). Tetapi segera setelah saya mengautentikasi pengguna dan membuat permintaan melalui $ http.get (url), saya mendapatkan pesannya

Header 'Access-Control-Allow-Origin' berisi beberapa nilai 'http://127.0.0.1:9000, http://127.0.0.1:9000', tetapi hanya satu yang diperbolehkan. Oleh karena itu, asal 'http://127.0.0.1:9000' tidak diizinkan akses.

Fiddler menunjukkan kepada saya bahwa memang ada dua entri header dalam permintaan get setelah permintaan opsi berhasil. Apa dan di mana saya melakukan sesuatu yang salah?

Memperbarui

Saat saya menggunakan jQuery $ .get dan bukan $ http.get, pesan kesalahan yang sama muncul. Jadi ini sepertinya tidak ada masalah dengan AngularJS. Tapi dimana salahnya?

Papa Mufflon
sumber
Nah, apa isi header tersebut?
eckes

Jawaban:

53

saya tambahkan

config.EnableCors(new EnableCorsAttribute(Properties.Settings.Default.Cors, "", ""))

sebaik

app.UseCors(CorsOptions.AllowAll);

di server. Ini menghasilkan dua entri header. Cukup gunakan yang terakhir dan berhasil.

Papa Mufflon
sumber
4
Sepertinya Anda membaca Properties.Settings.Default.Cors dari file pengaturan. Bisakah Anda memposting contoh? Dan di kelas apa UseCors berada?
Hoppe
"ReferenceError Tidak Tertangkap: EnableCorsAttribute tidak ditentukan" ??
sirkuit
@Hoppe, silakan lihat di msdn.microsoft.com/en-us/library/dn314597(v=vs.118).aspx . Ini menjelaskan, bahwa parameter pertama dari EnableCorsAttribute adalah asal yang diizinkan. Misalnya "*" untuk mengizinkan semua.
Papa Mufflon
1
@Hoppe, UseCors adalah metode ekstensi yang ditentukan dalam paket NuGet Microsoft.Owin.Cors. Sf katanaproject.codeplex.com/SourceControl/latest#src/… .
Papa Mufflon
7
config.EnableCors (enableCorsAttribute) biasanya dipanggil di WebApiConfig.cs - ini bagian dari paket Microsoft.AspNet.WebApi.Cors Nuget, yang penggunaannya dijelaskan di sini: asp.net/web-api/overview/security/… app .UseCors (CorsOptions.AllowAll) biasanya dipanggil di Startup.Auth.cs sebagai bagian dari konfigurasi penyedia identitas Anda (misalnya OAuth), dan merupakan bagian dari paket Microsoft.Owin.Cors Nuget.
Henry C
51

Kami mengalami masalah ini karena kami telah menyiapkan CORS sesuai dengan praktik terbaik (mis. Http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api ) DAN JUGA memiliki tajuk khusus <add name="Access-Control-Allow-Origin" value="*"/>di web.config.

Hapus entri web.config, dan semuanya baik-baik saja.

Bertentangan dengan jawaban @ mww, kami masih memiliki EnableCors()di WebApiConfig.cs DAN an EnableCorsAttributedi controller. Saat kami mengeluarkan salah satunya, kami mengalami masalah lain.

Brandon Kuczenski
sumber
11
Saya menghapus baris ini <add name = "Access-Control-Allow-Origin" value = "*" /> dan saya memiliki dua entri berikut di file web.config yang tidak saya hapus: <add name = "Access -Control-Allow-Headers "value =" Content-Type "/> <add name =" Access-Control-Allow-Methods "value =" GET, POST, PUT, DELETE, OPTIONS "/>
Siva Karthikeyan
2
Ini adalah kuncinya, Anda hanya boleh mengaktifkan CORS sekali, masalah saya adalah saya juga mengaktifkannya di web.config saya serta app.UseCors () ... Saya menghapus entri web.config dan baru saja menggunakan aplikasi. (Microsoft.Owin.Cors.CorsOptions.AllowAll); metode sebagai gantinya.
Mohammad Sepahvand
1
Garis di atas menyelamatkan hidupku! Pastikan Anda tidak mengaktifkan CORS lebih dari sekali, jika tidak ini akan terjadi dan Anda akan menjadi sangat frustasi.
TGarrett
menghapus <add name = "Access-Control-Allow-Headers" value = "Content-Type" /> dari web.config dan diperbaiki untuk saya
jbooker
1
"Ini adalah kuncinya, Anda hanya boleh mengaktifkan CORS sekali" <- INI @MohammadSepahvand THANKS. Kembali ke .NET dan sudah ketahuan kaget: D.
Tuan Jinn
42

Saya menggunakan Cors 5.1.0.0, setelah banyak sakit kepala, saya menemukan masalah tersebut adalah duplikat header Access-Control-Allow-Origin & Access-Control-Allow-Header dari server

Dihapus config.EnableCors()dari file WebApiConfig.cs dan hanya mengatur [EnableCors("*","*","*")]atribut pada kelas Controller

Lihat artikel ini untuk detail lebih lanjut.

mww
sumber
ini berfungsi untuk saya, pastikan Anda tidak menyetel yang lain seperti ini <add name = "Access-Control-Allow-Origin" value = "*" /> di web.config
Crismogram
12

Tambahkan ke Register WebApiConfig

var cors = new EnableCorsAttribute("*", "*", "*");
config.EnableCors(cors);

Atau web.config

<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Content-Type" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
<add name="Access-Control-Allow-Credentials" value="true" />
</customHeaders>  
</httpProtocol>

TAPI TIDAK KEDUA

tfa
sumber
2
Ini adalah solusi utama bagi saya, jangan lakukan keduanya.
robnick
8

Sebenarnya Anda tidak dapat menyetel banyak header Access-Control-Allow-Origin(atau setidaknya tidak akan berfungsi di semua browser). Sebagai gantinya Anda dapat menetapkan variabel lingkungan secara kondisional dan kemudian menggunakannya dalam Headerdirektif:

SetEnvIf Origin "^(https?://localhost|https://[a-z]+\.my\.base\.domain)$" ORIGIN_SUB_DOMAIN=$1
Header set Access-Control-Allow-Origin: "%{ORIGIN_SUB_DOMAIN}e" env=ORIGIN_SUB_DOMAIN

Jadi dalam contoh ini header respon akan ditambahkan hanya jika header permintaan Origincocok dengan RegExp: ^(https?://localhost|https://[a-z]+\.my\.base\.domain)$(pada dasarnya berarti localhost melalui HTTP atau HTTPS dan * .my.base.domain melalui HTTPS).

Ingatlah untuk mengaktifkan setenvifmodul.

Dokumen:

BTW. The }edalam %{ORIGIN_SUB_DOMAIN}etidak salah ketik. Begitulah cara Anda menggunakan variabel lingkungan dalam Headerdirektif.

Nux
sumber
1
Apakah Anda memiliki sumber untuk tidak menyetel beberapa header kontrol akses? Saya tidak dapat menemukan apa pun yang mengkonfirmasi ini.
Spencer
Solusi yang sangat cerdas dan bersih. Bekerja untuk saya.
Alex Kalmikov
@Spencer "Catatan: Dalam praktiknya, produksi origin-list-or-null lebih dibatasi. Daripada mengizinkan daftar asal yang dipisahkan spasi, ini bisa berupa asal tunggal atau string" null " ." w3.org/TR/cors/#access-control-allow-origin-response-header
Nux
8

Saya juga memiliki OWIN serta WebAPI saya yang keduanya tampaknya membutuhkan CORS diaktifkan secara terpisah yang pada gilirannya menciptakan 'Access-Control-Allow-Origin' header contains multiple valueskesalahan.

Saya akhirnya menghapus SEMUA kode yang mengaktifkan CORS dan kemudian menambahkan yang berikut ini ke system.webServernode Web.Config:

<httpProtocol>
  <customHeaders>
    <add name="Access-Control-Allow-Origin" value="https://stethio.azurewebsites.net" />
    <add name="Access-Control-Allow-Methods" value="GET, POST, OPTIONS, PUT, DELETE" />
    <add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept, Authorization" />
  </customHeaders>
</httpProtocol>

Melakukan ini memenuhi persyaratan CORS untuk OWIN (mengizinkan masuk) dan untuk WebAPI (mengizinkan panggilan API), tetapi itu menciptakan masalah baru: OPTIONSmetode tidak dapat ditemukan selama preflight untuk panggilan API saya. Perbaikan untuk itu sederhana - saya hanya perlu menghapus yang berikut ini dari handlersnode my Web.Config:

<remove name="OPTIONSVerbHandler" />

Semoga ini bisa membantu seseorang.

Matt Cashatt
sumber
7

Server Apache:

Saya menghabiskan biaya yang sama, tetapi itu karena saya tidak memiliki tanda kutip (") tanda bintang di file saya yang memberikan akses ke server, misalnya '.htaccess.':

Header add Access-Control-Allow-Origin: * 
Header add Access-Control-Allow-Origin "*" 

Anda mungkin juga memiliki file '.htaccess' dalam folder dengan keluar '.htaccess' lainnya, mis

/ 
- .htaccess 
- public_html / .htaccess (problem here)

Dalam kasus Anda, bukan tanda bintang '*' akan menjadi http://127.0.0.1:9000server ip ( ) yang Anda beri izin untuk menyajikan data.

ASP.NET:

Periksa apakah tidak ada duplikat 'Access-Control-Allow-Origin' di kode Anda.

Alat pengembang:

Dengan Chrome, Anda dapat memverifikasi header permintaan Anda. Tekan tombol F12 dan pergi ke tab 'Jaringan', sekarang jalankan permintaan AJAX dan akan muncul di daftar, klik dan berikan semua informasi yang ada.

Access-Control-Allow-Origin: *

Chofoteddy
sumber
Terkadang semudah itu ... Saat mencoba menjalankan layanan web yang membingungkan itu di IIS / Chrome, saya bermain-main dengan metode Application_BeginRequest, dan melupakannya ... duplikasi dalam kode saya sendiri! Terima kasih telah mengarahkan saya ke yang sudah jelas! :)
Juergen Riemer
2
Untuk mendapatkan header respons CORS, Anda juga harus mensimulasikan permintaan lintas-asal yang sebenarnya, jadi permintaan tersebut mungkin tidak muncul jika Anda hanya melihat tab jaringan di situs yang sedang berjalan. Namun, menggunakan sesuatu seperti DHC ( chrome.google.com/webstore/detail/dhc-resthttp-api-client/… ) untuk menjalankan permintaan AJAX Anda secara teknis akan memanggil dari domain yang berbeda, sehingga memicu CORS dan memungkinkan Anda untuk melihat header Access Control.
Henry C
4

Ini terjadi ketika Anda memiliki opsi Cors yang dikonfigurasi di beberapa lokasi. Dalam kasus saya, saya memilikinya di level pengontrol serta di Startup.Auth.cs / ConfigureAuth.

Pemahaman saya adalah jika Anda ingin aplikasinya luas maka cukup konfigurasikan di bawah Startup.Auth.cs / ConfigureAuth seperti ini ... Anda perlu referensi ke Microsoft.Owin.Cors

public void ConfigureAuth(IAppBuilder app)
        {
          app.UseCors(CorsOptions.AllowAll);

Jika Anda lebih suka menyimpannya di level pengontrol maka Anda dapat memasukkannya di level Pengontrol.

[EnableCors("http://localhost:24589", "*", "*")]
    public class ProductsController : ApiController
    {
        ProductRepository _prodRepo;
Nizar
sumber
Dalam kasus saya, saya mengaturnya di Web.Config dan di MyAppApiConfig.cs. Menghapusnya dari yang terakhir memecahkan masalah bagi saya.
Jim B
4

jika Anda berada di IIS Anda perlu mengaktifkan CORS di web.config, maka Anda tidak perlu mengaktifkannya di App_Start / WebApiConfig.cs metode Register

Solusi saya adalah, mengomentari baris di sini:

// Enable CORS
//EnableCorsAttribute cors = new EnableCorsAttribute("*", "*", "*");
//config.EnableCors(cors);

dan tulis di web.config:

<system.webServer>
  <httpProtocol>
  <customHeaders>
    <add name="Access-Control-Allow-Origin" value="*" />
  </customHeaders>
</httpProtocol>

freedeveloper
sumber
2

Ini juga dapat terjadi tentu saja jika Anda benar-benar menyetel Access-Control-Allow-Origintajuk Anda agar memiliki beberapa nilai - Misalnya, daftar nilai yang dipisahkan koma, yang semacam didukung di RFC tetapi sebenarnya tidak didukung oleh sebagian besar browser utama. Perhatikan bahwa RFC berbicara tentang cara mengizinkan lebih dari satu domain tanpa menggunakan '*' juga.

Misalnya, Anda bisa mendapatkan kesalahan itu di Chrome dengan menggunakan tajuk seperti ini:

Access-Control-Allow-Origin: http://test.mysite.com, http://test2.mysite.com

Ini masuk Chrome Version 64.0.3282.186 (Official Build) (64-bit)

Perhatikan bahwa jika Anda mempertimbangkan ini karena CDN, dan Anda menggunakan Akamai, Anda mungkin ingin mencatat bahwa Akamai tidak akan menyimpan cache di server jika Anda menggunakan Vary:Origin , cara yang disarankan banyak orang untuk mengatasi masalah ini.

Anda mungkin harus mengubah cara kunci cache Anda dibuat, menggunakan perilaku respons "Modifikasi ID Cache". Lebih detail tentang masalah ini dalam pertanyaan StackOverflow terkait ini

Brad Parks
sumber
Jadi pada dasarnya, Anda tidak bisa sekarang karena diragukan Anda ingin setiap domain di internet masuk ke url.
scottheckel
Tautan Akamai harus login.
Jean-François Savard
ya, itu tampaknya menjadi persyaratan akamai untuk dokumen tersebut ;-(
Brad Parks
Cara lain untuk mendapatkan kesalahan ini di Chrome adalah dengan daftar dipisahkan dengan spasi dari nilai-nilai: Access-Control-Allow-Origin: http://test.mysite.com http://test2.mysite.com. Itu akan menjadi cara yang benar, tetapi browser tidak mengikuti standar di sini ( sumber ).
tanius
2

Sangat bodoh dan sederhana:

Masalah ini terjadi pada saya ketika memiliki dua waktu Header always set Access-Control-Allow-Origin *di dalam file konfigurasi Apache saya. Sekali dengan VirtualHosttag dan sekali di dalam Limittag:

<VirtualHost localhost:80>
  ...
  Header set Access-Control-Allow-Origin: *
  ...
  <Limit OPTIONS>
    ...
    Header set Access-Control-Allow-Origin: *
    ...
  </Limit>
</VirtualHost>

Menghapus satu entri menyelesaikan masalah.

Saya kira di posting asli itu akan menjadi dua kali:

Header set Access-Control-Allow-Origin: "http://127.0.0.1:9000"
Melayu
sumber
1

baru saja mengalami masalah ini dengan server nodejs.

inilah cara saya memperbaikinya.
saya menjalankan server node saya melalui a nginx proxydan saya mengatur nginx dan nodekeduanya allow cross domain requestsdan tidak seperti itu jadi saya menghapusnya dari nginx dan meninggalkannya di node dan semuanya baik-baik saja.

James Harrington
sumber
Terima kasih atas jawaban ini! Ini memecahkan masalah yang tidak bisa saya selesaikan untuk waktu yang lama dengan pengaturan nginx + Rack (Ruby). Masalah yang sama, solusi yang sama: Matikan tambahan header di nginx, dan biarkan rack-corspermata menangani hal-hal CORS. Bam, diperbaiki.
Pistos
0

Saya menghadapi masalah yang sama dan inilah yang saya lakukan untuk mengatasinya:

Di layanan WebApi, di dalam Global.asax saya telah menulis kode berikut:

Sub Application_BeginRequest()
        Dim currentRequest = HttpContext.Current.Request
        Dim currentResponse = HttpContext.Current.Response

        Dim currentOriginValue As String = String.Empty
        Dim currentHostValue As String = String.Empty

        Dim currentRequestOrigin = currentRequest.Headers("Origin")
        Dim currentRequestHost = currentRequest.Headers("Host")

        Dim currentRequestHeaders = currentRequest.Headers("Access-Control-Request-Headers")
        Dim currentRequestMethod = currentRequest.Headers("Access-Control-Request-Method")

        If currentRequestOrigin IsNot Nothing Then
            currentOriginValue = currentRequestOrigin
        End If

        If currentRequest.Path.ToLower().IndexOf("token") > -1 Or Request.HttpMethod = "OPTIONS" Then
            currentResponse.Headers.Remove("Access-Control-Allow-Origin")
            currentResponse.AppendHeader("Access-Control-Allow-Origin", "*")
        End If

        For Each key In Request.Headers.AllKeys
            If key = "Origin" AndAlso Request.HttpMethod = "OPTIONS" Then
                currentResponse.AppendHeader("Access-Control-Allow-Credentials", "true")
                currentResponse.AppendHeader("Access-Control-Allow-Methods", currentRequestMethod)
                currentResponse.AppendHeader("Access-Control-Allow-Headers", If(currentRequestHeaders, "GET,POST,PUT,DELETE,OPTIONS"))
                currentResponse.StatusCode = 200
                currentResponse.End()
            End If
        Next

    End Sub

Di sini kode ini hanya mengizinkan pra-penerbangan dan permintaan token untuk menambahkan "Access-Control-Allow-Origin" dalam respons jika tidak, saya tidak akan menambahkannya.

Ini blog saya tentang implementasinya: https://ibhowmick.wordpress.com/2018/09/21/cross-domain-token-based-authentication-with-web-api2-and-jquery-angular-5-angular- 6 /

indranil bhowmick
sumber
0

bagi mereka yang menggunakan IIS dengan php, di IIS itu sisi server perbarui file web.config itu direktori root (wwwroot) dan tambahkan ini

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <directoryBrowse enabled="true" />
        <httpProtocol>
            <customHeaders>
                <add name="Control-Allow-Origin" value="*"/>
            </customHeaders>
        </httpProtocol>
    </system.webServer>
</configuration>

setelah itu restart server IIS, ketik IISReset di RUN dan enter

pengguna889030
sumber
0

Berikut contoh lain yang mirip dengan contoh di atas bahwa Anda hanya boleh memiliki satu file konfigurasi yang menentukan letak CORS: Ada dua file web.config di server IIS pada jalur di direktori yang berbeda, dan salah satunya disembunyikan di direktori virtual. Untuk mengatasinya saya menghapus file konfigurasi root level karena path tersebut menggunakan file config di direktori virtual. Harus memilih salah satu.

URL called:  'https://example.com/foo/bar'
                     ^              ^
      CORS config file in root      virtual directory with another CORS config file
          deleted this config             other sites using this

Cliff Coulter
sumber
0

Header 'Access-Control-Allow-Origin' berisi beberapa nilai

ketika saya menerima kesalahan ini saya menghabiskan banyak waktu mencari solusi untuk ini tetapi tidak ada yang berhasil, akhirnya saya menemukan solusi untuk masalah ini yang sangat sederhana. ketika header '' Access-Control-Allow-Origin 'ditambahkan lebih dari satu kali ke respons Anda, kesalahan ini terjadi, periksa apache.conf atau httpd.conf (server Apache), skrip sisi server, dan hapus header entri yang tidak diinginkan dari file-file ini .

Jiten Mhatre
sumber