-
ABP Framework version: v9.0.4
-
UI Type: Blazor Server
-
Database System: EF Core (SQL Server
-
Tiered (for MVC) or Auth Server Separated (for Angular): yes
-
Exception message and full stack trace:
-
Steps to reproduce the issue:
When we call our abp.io blazor server project in an html page or an Azure power apps page, we get an ERR_BLOCKED_BY_RESPONSE error. How can we fix this problem?
15 Answer(s)
-
0
If your Blazor Server app is hosted on a different domain than the embedding page (HTML/Azure Power Apps), the browser might block the request due to CORS (Cross-Origin Resource Sharing) restrictions.
So, you need to modify the cors configuration (and define the related CorsOrigin) - update your appsettings.json file -:
{ "App": { "CorsOrigins": "https://*.MyProjectName.com" } }Check https://abp.io/docs/9.0/solution-templates/layered-web-application/cors-configuration for more info.
-
0
Our project is structured in a tiered architecture, and the Blazor project redirects directly to the auth server upon startup. The user cannot access the Blazor screen without logging in.
Therefore, it redirects directly to the SSO site where we have deployed the auth server.
I have added the following configuration to the appsettings of both the auth server and the Blazor projects, but unfortunately, I am still encountering the same error.
"CorsOrigins": "https://.medicanamerkez.com,http://.sharepoint.com,https://*.sharepoint.com",
-
0
Our project is structured in a tiered architecture, and the Blazor project redirects directly to the auth server upon startup. The user cannot access the Blazor screen without logging in.
Therefore, it redirects directly to the SSO site where we have deployed the auth server.
I have added the following configuration to the appsettings of both the auth server and the Blazor projects, but unfortunately, I am still encountering the same error.
"CorsOrigins": "https://.medicanamerkez.com,http://.sharepoint.com,https://*.sharepoint.com",
Hi, can you check in your module class there is a method called
ConfigureCorsand the content of the method is as follow?context.Services.AddCors(options => { options.AddDefaultPolicy(builder => { builder .WithOrigins( configuration["App:CorsOrigins"]? .Split(",", StringSplitOptions.RemoveEmptyEntries) .Select(o => o.Trim().RemovePostFix("/")) .ToArray() ?? Array.Empty<string>() ) .WithAbpExposedHeaders() .SetIsOriginAllowedToAllowWildcardSubdomains() .AllowAnyHeader() .AllowAnyMethod() .AllowCredentials(); }); });Also, ensure you added the CorsOrigin under the App section in the appsettings.json file.
-
0
The ConfigureCors code is already present in the SSO project, but we are still getting an error when accessing SSO.
However, it was not present in the Blazor and API host projects. Do we need to add it to them as well?
-
0
I added ConfigureCors to blazor, api host and auth projects and released the version, but I still get the ERR_BLOCKED_BY_RESPONSE error in iframe.
-
0
It looks like you've correctly configured CORS in all necessary projects, but you're still facing the issue. Since you're embedding the Blazor app inside an iframe, the problem might not be just CORS-related—it could be due to X-Frame-Options or Content Security Policy (CSP) settings.
Things to check:
1-) X-Frame-Options Header
If your authentication server or Blazor app is sending
X-Frame-Options: DENYorX-Frame-Options: SAMEORIGIN, the browser will block embedding in an iframe.Solution: Allow your domain by setting
X-Frame-Options: ALLOW-FROM https://yourdomain.comor remove this header.2-) Content Security Policy (CSP)
Your app might have a CSP rule blocking framing. Look for a
Content-Security-Policyheader withframe-ancestors 'none'orframe-ancestors 'self', which prevents embedding.Solution: Modify it to allow the required domains:
Content-Security-Policy: frame-ancestors https://yourdomain.com https://*.sharepoint.com;You can refer to the following docs:
-
0
I will add this code in Auth server and blazor. Is it OK ?
Configure<AbpSecurityHeadersOptions>(options => { options.UseContentSecurityPolicyHeader = true; options.ContentSecurityPolicyValue = "default-src 'self' https://*.sharepoint.com; object-src 'none'; form-action 'self'; frame-ancestors 'none'"; }); -
0
I will add this code in Auth server and blazor. Is it OK ?
Configure<AbpSecurityHeadersOptions>(options => { options.UseContentSecurityPolicyHeader = true; options.ContentSecurityPolicyValue = "default-src 'self' https://*.sharepoint.com; object-src 'none'; form-action 'self'; frame-ancestors 'none'"; });If your cors configuration is correct, then this should fix your problem, yes. Can you try it and let me know if it fixes your problem?
Regards.
-
0
Unfortunately I still get the same error
-
0
Hi,
Can you check load-balancer or proxy server to make sure Headers are not modified.
Nginx or similar tools does not expose all the headers by default. If there is an option on azure please check or if you have access to configuration, you can check and ensure the headers are passed without any restrictions.Sometimes, your application does not determine the CORS policy but your proxy server does. If you use Cloudflare, please check it too
-
0
We do not use load balancer. We publish on iis 10.
-
0
I added this code to webconfig in Blazoır and Auth server Project.
ERR_BLOCKED_BY_RESPONSE error in iframe fixed. But when we login , we get 400 error.
<system.webServer> <httpProtocol> <customHeaders> <add name="Content-Security-Policy" value="frame-ancestors 'self' https://mydomain.sharepoint.com"/> <remove name="x-powered-by" /> </customHeaders> </httpProtocol> </system.webServer> -
0
I added this code to webconfig in Blazoır and Auth server Project.
ERR_BLOCKED_BY_RESPONSE error in iframe fixed. But when we login , we get 400 error.<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Content-Security-Policy" value="frame-ancestors 'self' https://mydomain.sharepoint.com"/>
<remove name="x-powered-by" />
</customHeaders>
</httpProtocol>
</system.webServer>The 400 error you're encountering after adding the Content-Security-Policy with frame-ancestors suggests a conflict between your authentication flow and the restrictions imposed by the CSP. Try to expand
frame-ancestorstemporarily to see if it resolves the 400 error:-
Replace 'self' https://mydomain.sharepoint.com with 'self' * to allow framing from any origin.
<system.webServer> <httpProtocol> <customHeaders> <add name="Content-Security-Policy" value="frame-ancestors 'self' *"/> <remove name="x-powered-by" /> </customHeaders> </httpProtocol> </system.webServer>If the error resolves then that confirms the original frame-ancestors policy was the cause.
-
-
0
Unfortunately I still get the 400 error
-
0
Unfortunately I still get the 400 error
Can you share the logs of the auth-server project? (Especially, the error part please)
