I have a project built on top of Angular 5.
I want proxy websocket when running ng serve. There is a websocket server, i can connect to it using address wss://myserver/ws but can't setup proxy.
{
"/ws": {
"target": "wss://myserver",
"secure": false,
"ws" : true
}
}
That config doesn't work. I can proxy https request but can't do websockets
How to fix this?
Related
I have a request to a python FASTAPI on port 8000 using Laravel's HTTP client which is a wrapper for Guzzle's HTTP client. Anytime I send a request, it fails because it is sent to port 80. I tried several times to add options to the request but it still fails. Using the Guzzle HTTP client everything works fine. I am just wondering why the HTTP client only works for port 80
Below is the code we tried
$response = Http::withOptions([
'debug' => true,
//'proxy' => [
// 'https' => 'http://127.0.0.1:8088'
// ] // Use this proxy with "HTTP"
])->get('http://127.0.0.1:8088/getImage/1/200');
print($response->body());
return response()->download($response);
We set the proxy to force it to use the port but failed.
I'm trying to create a websocket connection using socket.io client.
My issue starts when my app is running inside an Iframe.
The browser does not send the Authorization cookie which is being set by the server.
There is no CORS issue since the iframe and the server are running on the same domain.
The cookie configurations are: HttpOnly = true, Secure = true, SameSite = Strict.
It does work when the app is running without an iframe.
Example of my code
this.socket = io(`/${namespace}`, {
transports: ['websocket'],
path: '/.../socket.io'
});
I'm developing 2 applications for backend and frontend (spring mvc and angular4), i host the spring app on tomcat server using the http port (8080) and my frontend using the http port (4200) , the communication between both of the apps is made using json.
To identify the user i'm using a session cookie.
The problem is that i came to a cross domain issue because i use different ports for both of the apps, the cookie is not send when i make a http post request.
the only solution i found until now :
When i put the angular app inside the /src/main/webapp of my spring project, following this documentation , i dont have the issue and the cookie are automatically set but it's painful to do the previous steps everytime when i want to test something.
I thought also about some workaround like jsonp during the development process but i don't think this would be productive plus later on i need to execute some e2e testing.
Did anyone have an idea/example about how to make this cross domain...
Communication can be established via proxy.
Add in package.json "start": "ng serve --proxy-config proxy.config.json" in "scripts".
In proxy.config.json add:
{
"/api/*": {
"target": "http://server.com:8080",
"secure": false,
"logLevel": "debug"
}
}
So after some researches i came out with this solution :
in term of security and scalability of my backend service the best way is to use CROS, any other solutions like JSONP, Proxy is just a workaround and this will bring nothing because of the same-origin-policy followed by browsers
Following this documentation the scenario that will happens :
1) the browser will send an OPTIONAL request
2) the server will response with the allowed origin
3) if the our domain(the frontend domain/ angular app in my case) is verified the cookies will be automatically send in another request
the implementation that i made :
in the spring app :
//Some logic before this
if ("OPTIONS".equals(request.getMethod())) {
response.setHeader("Access-Control-Allow-Origin", "http://localhost:4200");
response.setHeader("Access-Control-Allow-Credentials","true");
response.setHeader("Access-Control-Allow-Methods","POST");
response.setHeader("Access-Control-Allow-Headers","Content-Type");
response.setStatus(HttpServletResponse.SC_OK);
((HttpServletResponse) servletResponse).setHeader("Access-Control-Allow-Origin", "http://localhost:4200");
return ;
}
// some logic after this
in the front app we can send the request using xhr like it's described in the attached link.
I'm developing an app using Angular for client side and Django for server side. During development I'm running Django in port 8000 for managing all API requests, and serving my client app using Angular CLI running at port 4200.
Sending GET requests to Django work w/o problems but when I try to send a POST request that includes some cookies with session information, it fails as the cookies are not included in the header.
I know that the source of this "problem" is the CORS issue [read more here] and that it won't be a problem in production as both client and server apps will be running in the same server and port, however I wonder how can I fix this situation at least for development.
I've tried using the django-cors-headers module with the options CORS_ALLOW_CREDENTIALSand CORS_ORIGIN_ALLOW_ALL set to True but it didn't work.
Any ideas?
Finally I managed to make all work.
I thought it was a problem of Django so I installed django-cors-headers module, however the "problem" is in the browser (actually is not a problem, it is a security issue, see [here][1]).
Anyway, I solved the problem using a proxy rule for my Angular CLI, as follows:
First, instead of sending my requests to http://localhost:8000/api/..., I send them to /api/ (i.e. to my Angular server running at port 4200).
Then I added a file in my Angular project called "proxy.conf.json" with the following content:
{
"/api": {
"target": "http://localhost:8000",
"secure": false
}
}
Finally, I added the flag "--proxy-config" to the Angular CLI server:
ng serve --watch **--proxy-config proxy.conf.json**
Now, all API requests are sent to the port 4200 and Angular internally redirects them to Django, avoiding the CORS problem.
Note: With this solution I didn't need anymore the django-cors-headers module.
I downloaded ngrok so i can test my site for http and https requests (if someone is trying to get in my site specific url and it will be a simple http request, i will deny it),
first, my localhost is working in 8080 port
I start ngrok, it gives me the following:
both at the same port, it's a problem i think, because if i do such simple route configuration in laravel:
Route::filter('force.ssl', function()
{
if( ! Request::secure())
{
return 'unsecured';
}
});
and i have this route:
Route::get('survey/payment/secured', array('before' => 'force.ssl', function(){
return 'secured!';
}));
and i do the following request:
https://75fdaa96.ngrok.com/survey/payment/secured
it thinks it unsecured and returns 'unsecured', how can i fix this?
Request::secure() relies on $_SERVER['HTTPS']. As the HTTPS is being provided by the proxy, not your webserver, Laravel doesn't know it's being served as HTTPS.
ngrok does pass the X-Forwarded-Proto header, but Laravel doesn't trust it by default. You can use the trusted proxy middleware to trust it.