I am having a bit of trouble setting up my create-react-app application to proxy requests to my test hosting on Microsoft azure. I have set up the proxy in my app's package.json as follows:
"proxy":{
"/api/*":{
"target":"https://mytestbackend.azurewebsites.net",
"secure":false
}
}
I have set up an axios request to be sent to the backend server on azure. It is in a stand-alone .js which I call from one of my react application's events. It looks like this:
import axios from 'axios';
const login = async (username, password) => {
console.log("Username to send is:"+username);
console.log("password to send is:"+password);
let response = await axios.post('/api/user/login', {username:username,password:password});
console.log(response);
};
export {login};
The problem can't be in my react components, because those two console.log() call show that the values entered are being recieved. If I remove the "secure":false setting from package.json, request fails with Http Error: 500. But if I use the secure setting, it fails with a 404 page. Can someone please shed a little light on what am I doing wrong? Can I only use the proxy on "localhost"? The documentation suggests otherwise. Any help is greatly appreciated.
I have verified that CORS is enabled for the domain on which the dev server is running on the Azure Management Portal. And if I do the request by using the backend's URL directly (that is, not using the create-react-app proxy), it works. The problem must be something in the way the proxy is configured.
The response text for the HTTP Errpr 500 which happens when not using secure is :
Proxy error: Could not proxy request /api/user/login from localhost:3000 to https://mytestbackend.azurewebsites.net (undefined).
Additional info: I have also tested by running my Backend locally on my development machine. The error message occurs but the "undefined" in the parenthesis says "UNABLE_TO_VERIFY_LEAF_SIGNATURE". If using "secure: false, I can call the login endpoint successfully, but calls to other endpoints which require authentication fail because the cookie is not sent by axios.
Doing:
curl -v https://mytestbackend.azurewebsites.net/api/user/login
Has this output:
* SSLv3, TLS handshake, Client hello (1):
* SSLv3, TLS handshake, Server hello (2):
* SSLv3, TLS handshake, CERT (11):
* SSLv3, TLS alert, Server hello (2):
* SSL certificate problem: unable to get local issuer certificate
* Closing connection #0
curl: (60) SSL certificate problem: unable to get local issuer certificate
More details here: http://curl.haxx.se/docs/sslcerts.html
curl performs SSL certificate verification by default, using a "bundle"
of Certificate Authority (CA) public keys (CA certs). If the default
bundle file isn't adequate, you can specify an alternate file
using the --cacert option.
If this HTTPS server uses a certificate signed by a CA represented in
the bundle, the certificate verification probably failed due to a
problem with the certificate (it might be expired, or the name might
not match the domain name in the URL).
If you'd like to turn off curl's verification of the certificate, use
the -k (or --insecure) option.
create-react-app use WebPackDevServer which uses https://github.com/chimurai/http-proxy-middleware#options
So you can use all the options from the same
Now one key header that is import in such cases of externally hosted server is host. This at times can issues if not correct, see below example
Websocket works on EC2 url but not on ElasticBeanstalk URL
Next is the cookies might be associated with localhost, i checked and they should go without any modification. But you might want to use the cookieDomainRewrite: "" option as well
So the final config I would use is below
"proxy":{
"/api/*":{
"target":"https://mytestbackend.azurewebsites.net",
"secure":false,
"headers": {
"host": "mytestbackend.azurewebsites.net"
},
"cookieDomainRewrite": ""
}
}
Also on your client you want to use the withCredentials:true
let userinfo =await axios.get('/api/secured/userinfo',{withCredentials:true});
Create react app http-proxy-middleware, and should support the full set of options.
Some things I would try:
The path to match may be /api/** instead of /api/* if you want to nest multiple levels deep (eg. for /api/user/login)
You may need to add changeOrigin: true if you're proxying to something remotely (not on localhost)
You will likely want to keep secure: false as you aren't running localhost with https.
So in total, I would try
"proxy":{
"/api/**": {
"target": "https://mytestbackend.azurewebsites.net",
"secure": false,
"changeOrigin": true
}
}
After days of trying unsuccessfully to do this, I finally found a setup that works. Proxy is configured like this:
"proxy": {
"/api/user/login": {
"target": "https://localhost:44396",
"logLevel": "debug",
"secure": false
},
"/api/secured/userinfo": {
"target": "https://localhost:44396",
"secure": false,
"logLevel":"debug",
"secure":false
}
Request to both endpoints on the client have withCredientials:true
try {
await axios({
method:'post',
url:'/api/user/login',
withCredentials:true,
data:
{username:username,password:password}}
);
let userinfo =await axios.get('/api/secured/userinfo',{withCredentials:true});
return userinfo;
As you can see, I've moved to testing on my local dev machine. For whatever reason, this setup refuses to work on the azure-hosted backend. I would have preferred that it work as I originally intended, but at least now I can continue with my project.
So here is the deal. I have an ionic app with "satellizer" and "angular-jwt" which communicates with a Laravel5 backend with barryvdh/laravel-cors and tymondesigns/jwt-auth. Running this combo works fine in Homestead in combination witg ionic serve. An authentication token is created and stored in localStorage and validates with Laravel. This request looks as followed:
[IONIC SERVE] http://192.168.1.54:8100/#/auth
[POST] http://192.168.10.10/api/v1/authenticate?email=[email]&password=[password]
Returns [the_token]
[GET] http://192.168.10.10/api/v1/authenticate/user?token=[the_token]
Returns the user object from Laravel
As soon as I change the api url to my live server
[POST] http://domaintomyvps.com/api/v1/authenticate?email=[email]&password=[password]
Returns [the_token]
[GET] http://domaintomyvps.com/api/v1/authenticate/user?token=[the_token]
Returns {"error":"token_not_provided"}
The authentication works fine and a token got returned. But when sending the get request I get the error "token_not_provided".
Then the strange thing happens. When trying the same request from Chrome Postman the token validates and the user object is returned.
My homestead is running as a Vagrant in a VirtualBox and Nginx in Ubuntu. My production server is Debian with Apache on a VPS. The Laravel installations are identical regarding settings and keys. The database is exactly the same (mysqldump) and works due Postman creates a successful result.
Anyone who can guide me to the right direction or has had the same problem? Do you need any more information regarding setup or code?
This solved my problem.
Adding the following to my apache .htaccess disable apache to remove auth header from the request. I found this answer in the: following thread
RewriteCond %{HTTP:Authorization} ^(.*)
RewriteRule .* - [e=HTTP_AUTHORIZATION:%1]
I am having issues setting up a BOSH service for a webchat. As XMPP server I'm using OpenFire and I'm already able to connect to the server using the Pidgin client. What I've done is the following:
First of all I've enabled the proxy using a2enmod proxy proxy_http. Then I went to edit the proxy.conf and added these in the end
ProxyVia On
ProxyErrorOverride On
ProxyPass /http-bind http://localhost:7070/http-bind
ProxyPassReverse /http-bind http://localhost:7070/http-bind
However, when i try to reach http://example.com/http-bind I get the following:
HTTP ERROR: 400
Problem accessing /http-bind/. Reason:
Bad Request
Powered by Jetty://
What am I doing wrong?
No any error in fact.
While you see the result, which measn that all proxy settings of yours are correct, as the http-bind needs to accept the POST(xml format) data as its true request, it is why the openfire server return 404 to you.
from google.appengine.api import urlfetch
totango_url = "https://sdr.totango.com/pixel.png"
totango_url2 = "https://app.totango.com/images/accounts-users.png"
result = urlfetch.fetch(totango_url, validate_certificate=None )
print result.status_code
In production , request to totango_url logs indicate (with no error_detail) :
DownloadError: Unable to fetch URL: https://sdr.totango.com/pixel.gif
i ran this curl command. works fine from local setup , for both the https totango urls
curl -v "https://sdr.totango.com/pixel.gif"
curl -v "https://app.totango.com/images/accounts-users.png"
The ssl certificates are valid and same for both urls.
using the urlfetch.fetch on both urls also returns 200 from my (local) datastore console.
However , the urlfetch.fetch calls to https://sdr.totango.com/pixel.png fails with the above error
Also , i ran the same code in the google cloud playground tweaking the sample app-engine application and seem to get a 200 response for totango_url2 while it returns a 500 for totango_url. Both have the same ssl certificate , i think.
is there some ip whitelisting /firewall issue that app-engine in production that i need to take care of?
This sounds more like an issue on the remote side. If you're able to fetch that image from one place but not another, that speaks to the remote site doing some sort of filtering, possibly by IP address.
I am trying to upload some data to my local datastore in appengine.
The command I am using is the next one:
appcfg.py upload_data --config_file="C:\config.yml" --filename="C:\mycsv.csv" --url=http://localhost:8888/remote_api --kind=MyEntity
The problem is that I'm working behind my company proxy and I am getting the next ERROR even trying to connect to the localhost server:
Error Code: 502 Proxy Error. The ISA Server denied the specified Uniform Resource Locator (URL). (12202)
It seems the authentication is ok, but somehow the proxy tries to filter my connection to my own computer.
Some ideas about how can I solve this?
Thanks.
Remove/disable proxy settings of your network then try the above command.
I was facing the similar issue and this issue resolved when i disable my proxy settings.