I had created a gRPC service using Servicestack and was able to consume from the console application.
When I a trying to call it from angular 12, i was getting the CORS issue I fixed by adding below code
services.AddCors(o => o.AddPolicy("AllowAll", builder =>
{
builder.AllowAnyOrigin()
.AllowAnyMethod()
.AllowAnyHeader()
.WithExposedHeaders("Grpc-Status", "Grpc-Message", "Grpc-Encoding", "Grpc-
Accept-Encoding", "Grpc-Web-Text");
}));
Now the CORS issue resolved However I am getting the below issue from angular
Grpc.AspNetCore.Server.ServerCallHandler[2]
Request content-type of 'application/grpc-web-text' is not supported.
Related
I am in the process of integrating Piranha CMS (v8.4) into an existing ASP .NET Core 3.1 project. I've gotten Piranha working, but I get an exception indicating CORS is not set up properly.
I've managed to track the source of the problem down to the configuration of the Piranha middleware. The line options.UseManager() is what causes the problem and when options.UseManager() line is commented out, the CORS middleware functions as expected.
app.UsePiranha(options =>
{
options.UseManager();
options.UseTinyMCE();
options.UseIdentity();
});
InvalidOperationException: Endpoint contains CORS metadata, but a middleware was not found that supports CORS. Configure your application startup by adding app.UseCors() inside the call to Configure(..) in the application startup code. The call to app.UseAuthorization() must appear between app.UseRouting() and app.UseEndpoints(...).
My CORS policy is configured like this. Calling before or after UsePiranha makes no difference:
// global cors policy
app.UseCors(x => x
.AllowAnyMethod()
.AllowAnyHeader()
.SetIsOriginAllowed(origin => env.IsDevelopment()) //any origin in dev
.AllowCredentials());
`
The problem is that the call to UseManager calls UseRouting. Per the exception, UseCors needs to be configured BEFORE UseRouting. The solution is to configure CORS between the calls to UseIdentity and UseManager.
app.UsePiranha(options =>
{
options.UseTinyMCE();
options.UseIdentity();
app.UseCors(x => x
.AllowAnyMethod()
.AllowAnyHeader()
.SetIsOriginAllowed(origin => env.IsDevelopment()) //any origin in dev
.AllowCredentials());
options.UseManager();
});
This looks to be pretty obvious but I've been trying to figure it out for a couple of days now and still can't get it to work. Please, can someone point out what I'm missing.
I'm trying to make an axios call to my cloud run service from my firebase hosted SPA. To isolate the issue I followed the steps outlined in the [firebase tutorial for cloud run] (https://firebase.google.com/docs/hosting/cloud-run#node.js)
Step 4 of the tutorial talks about setting up rewrite to use the firebase domain as a proxy to your cloud run service. It says that the helloworld service would be reachable via
Your Firebase subdomains:
projectID.web.app/helloworld and projectID.firebaseapp.com/helloworld
So I follow the steps and deploy the service. Then I try to make an axios call to the service from the SPA like below
testHelloWorld () {
axios.get(`https://myProjectId.firebaseapp.com/helloworld`)
.then((data) => {
console.log(data)
})
.catch(ex => {
console.error(ex)
})
})
}
But then I get the CORS error
Access to XMLHttpRequest at 'https://myProjectId.firebaseapp.com/helloworld' from origin 'https://myFirabaseApp.firebaseapp.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
This answer states that this should be possible so I'm not sure what I'm doing wrong.
N.B:
While debugging, I updated the node app from the tutorial to add cors support like below. Still didnt work.
const express = require('express');
const app = express();
const cors = require('cors'); //Imported and added this
app.use(cors()); // Used here
app.get('/', (req, res) => {
console.log('Hello world received a request.');
const target = process.env.TARGET || 'World';
res.send(`Hello ${target}!`);
});
const port = process.env.PORT || 8080;
app.listen(port, () => {
console.log('Hello world listening on port', port);
});
So the question here is, how do I make an Axios/AJAX call to my cloud run service using the firebase rewrite rule?
Please check if you have installed cors: npm install cors.
Please check if the 2 following options can solve your issue:
1= Use the following code :
app.use(cors({origin:true,credentials: true}));
2) If the previous didn't work, please use the following code:
app.get('/', (req, res) => {
res.setHeader('Access-Control-Allow-Origin', '*');
console.log('Hello world received a request.');
}
Please let me know if it works for you.
Here is my CORS configuration:
services.AddCors(options =>
{
options.AddPolicy(name: "AllowedOrigins",
policyBuilder =>
{
var urls = Configuration.GetSection("Host:AllowedOrigins").Get<List<string>>();
policyBuilder.WithOrigins(urls.ToArray())
.AllowAnyMethod()
.AllowAnyHeader()
.SetIsOriginAllowed((host) => true)
.AllowCredentials();
});
});
And in Configure method:
app.UseRouting();
app.UseCors("AllowedOrigins");
app.UseAuthentication();
app.UseAuthorization();
app.UseEndpoints(endpoints =>
{
endpoints.MapControllers();
});
For internal server error, there are no access-control-* headers in the response. As far as I know, this issue should be fixed since ASP.NET Core 2.2.
I created an issue for ASP.NET Core 3.1 and you can track the issue.
You need to explicitly call app.UseExceptionHandler(...) in your startup.
If you do not, then unhandled exceptions bubble up the call stack all the way to Kestrel. And Kestrel does not call the delegates hooked up to HttpContext.Response.OnStarting(...). CorsMiddleware (and many other middleware) use OnStarting to hook into adding information to the response.
Same problem in .Net 5 WebAPI project, so I guess it was not really solved by MS by the 2022..
The issue with the default behavior in my case, was that AXIOS (front-end library) does not provide any error response details unless CORS headers are present. Not sure if it's browser issue or the library issue but regardless the solution was to include CORS in response. This also got rid of the warning in console, which might have confused people, because despite warning - the status code is still 500 (it confused me also :) ).
Anyway, after following #TylerOhlsen 's answer, here what seems to have helped:
app.UseExceptionHandler(exceptionHandlerApp =>
{
exceptionHandlerApp.Run(async context =>
{
context.Response.StatusCode = StatusCodes.Status500InternalServerError;
});
});
app.UseCors(...);
You might want to do something like:
if (!env.IsProduction())
{
app.UseDeveloperExceptionPage();
}
else
{
app.UseExceptionHandler(exceptionHandlerApp =>
{
exceptionHandlerApp.Run(async context =>
{
context.Response.StatusCode = StatusCodes.Status500InternalServerError;
});
});
}
Some details about the UseExceptionHandler are here: https://learn.microsoft.com/en-us/aspnet/core/fundamentals/error-handling?view=aspnetcore-6.0
For the practical explanation why this solution even works see the answer above/below. Thank you Tyler.
Ran into an error after testing the Firebase authentication with Google on ElectronJS.
Authentication used to work before, even though I haven't made any significant changes in my code that would affect the Google authentication part.
Authentication still works correctly when I am running my project in the browser (npm run serve). In Electron I can see the
TypeError: Cannot create property 'href' on string 'about:blank' when clicking on the Google authentication button.
TypeError: Cannot create property 'href' on string 'about:blank'
My code that is being executed on click -
googleLogin() {
fb.auth
.signInWithPopup(fb.googleProvider)
.then(credential => {
this.$store.commit("setCurrentUser", credential.user)
fb.usersCollection.doc(credential.user.uid).set({
}).then(() => {
this.$store.dispatch("fetchUserProfile")
this.updateGmailData()
this.$router.push("/dashboard")
}).catch(err => {
console.log(err)
})
}).catch(err => {
console.log(err);
});
},
On second click on the button, I can see another typeError -
TypeError: Cannot create property 'href' on string ''
Why does the authentication work on browser but not in Electron?
What is the cause of this issue?
see this issue https://github.com/firebase/firebase-js-sdk/issues/1334.
Electron is not officially supported by Firebase Auth. Since Electron is a combination of a browser and Node.js server environment, some features may not work as expected, such as signInWithPopup.
But #diggabyte (thx to him) seems to have found a way to handle it:
I was able to get it to work via signInWithRedirect + getRedirectResult
https://github.com/firebase/firebase-js-sdk/issues/1334#issuecomment-434094783
I've got a problem with my ionic app. I try to get a json object from my iis (asp.NET) server. But the request doesn't even come into my controller. Everytime, i get the same error:
http failure response for (unknown url) 0 unknown error
At first, I thought it was just a cors problem so i fixed it but now, it works with chrome and internet explorer 11 but not with edge and, more important, it doesn't work on device.
I don't think the problem is with my typescript code since there is no problem with a Google request... But, just in case, there is my code:
this.http.get('http://localhost:60196', {withCredentials : true}).subscribe(data => {
this.testData = JSON.stringify(data);
}, err => {
this.testData = JSON.stringify(err);
});
For the record: my iis server use windows impersonation and my app must run on windows devices (i didn't try my code with android or ios devices).
Thank you very much.
it doesn't work on device
this.http.get('http://localhost:60196', {withCredentials : true}).subscribe(data => {
this.testData = JSON.stringify(data);
}, err => {
this.testData = JSON.stringify(err);
});
Get request is rerencing to localhost. Here should be some Api endpoint when testing it on device...