I am creating an application using Vue.js with Vite for client-side and express.js for the server-side on docker. The server side sends the cookie as a response to Axios request front client, and I can see Set-cookie in the response-header. However, this cookie is not set to the browser. I opened the Application tab and checked the cookie, but nothing was there.
Client URL: http://localhost:3000/
Server URL: http://localhost:15173/
Both of the are running on separate Docker containers.
Environment is
Front: vue3 with vite
Sererside: nodejs with express.js
connection: Using axios
Probably, this is caused by CORS, but I don't know how to deal with that. I'm tring to solve this question fixing proxy, but so far no luck.
if anyone can help me out, that would be great. Thank you!
I tried vite.config proxy setting, but it didn't solve the situation.
Related
I have a keycloak server running in localhost:8080 and a web app server written in ASP.NET MVC 4.7 running in https:localhost:44337,
the application uses the keycloak to authenticate and login, and after succesful login it should redirect to https:localhost:44337/home,
from dev tools i see that Sessions are passed correctly but it is blocked because "This cookie was blocked because its path was not an exact match for or a superdirectory of the request url's path".
Is this maybe because I am testing in localhost with different port? is this samesite issue?
How can I resolve this while developing locally and I dont have a domain?
It seems like by googling this error does not come out.
I'm using Swagger UI using its docker version. The Try it out button is not working as expected from the Web UI because there's a problem with cors. I'm running the UI from localhost and doing requests to another domain. I have read this other question How to avoid CORS errors ("Failed to fetch" or "Server not found or an error occurred") when making requests from Swagger Editor? but I cannot do any of the solutions it says.
I'm not sure if it's posible to setup a proxy on the docker container as SwaggerHub does, like, instead of the Try it out request be resolved on the browser, resolve it on the docker container.
Do you know if that is posible?
first time using docker and nginx reverse proxy.
Setup
Dockerized front with Vuejs behind localhost:4200
Dockerized back with Symfony behind a dockerized nginx on localhost:80
Trouble
Every time I add a cookie to the response, the Set-Cookie get ignored by the front.
Telling me:
This Set-Cookie was blocked because its Domain attribute was invalid with regards to the current host url.
What I tried
Add different domain to the cookie config.
Add a new header within nginx.
As I said, I m new with this setup, can't figure if the problem come from nginx or the cookie config.
Edit: It actually work fine with postman.
I have a backend server (powered by Rails), whose APIs are used by a HTML5 frontend that runs on a Node simple development server.
Both are on the same host: my machine.
When I login from the frontend to the backend, rails sent me the session cookie. I can see it in the response headers, the problem is that browsers do not save it.
Policies are right, If I serve the same frontend directly from the rails app cookies are set right.
The only difference I can see is that when the frontend run on Node server, It runs on the port 8080 and rails is on the port 3000. I knew that cookies are not supposed to be port specific, so I am missing what is happening here.
Any thoughts? solutions?
(I need to be able to keep the setup this way, so to have the frontend served from Node and the backend on rails on different ports)
You're correct that cookies are port agnostic, and that the browser will send the same cookies to myapp.local:3000 as myapp.local:8080--except not through XMLHttpRequest (XHR, a.k.a., AJAX) when doing a cross-site request (CORS).
Solution: The request can be told to include cookies and auth headers by setting withCredentials to true on any XMLHttpRequest object. See: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/withCredentials
Or if using the Fetch API, set the option credentials: 'include'. See: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
Alternative: since you tagged webpack-dev-server in your question, you might be interested in proxying requests to your Rails API through the webpack-dev-server to avoid any CORS issues in the first place. This is done in your weback.config:
proxy: {
'/some/path': {
target: 'https://other-server.example.com',
secure: false
}
}
See: https://webpack.js.org/configuration/dev-server/#devserverproxy
I'm working on an app the requires a log-in by using oauth mechanisms from LinkedIn, Twitter, Google.
On the common meteor server this authentication method works fine.
However, I recently deployed the meteor server on my own server, and I get an authentication error when I try to log in. I tried linkedin and twitter and receive the same error, so I guess something is wrong on my server.
The error is in a browser window:
The requested URL /_oauth/linkedin was not found on this server.
Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.
Apache/2.2.22 (Ubuntu) Server at exomodal.com Port 80
The meteor server is at port 3000.
Any ideas how to resolve this issue?
Thanks in advance
As far as I know, in Google, it asks for a redirect url and an origin url. During development, you registered these as localhost:3000/. But when you deploy, you are not using localhost anymore. Update these URLs in your "API console" (That's what they call it in Google) if any exists. As far as I know, Google and Facebook requires some sort of url registered.
Also, API configurations (client/consumer id and secret) are usually stored in the DB. Upon deploy, you don't usually ship your development DB, leaving behind the configurations which were on your development machine. What we did was to hard-code these into the server code, so that every time the server is restarted or redeployed to a "clean server", it inserts those configs to the DB.