How does one take an HTTP request and redirect it to proxy (on an ad-hoc basis, assuming browser is on no-proxy)?
For example: I want to access http://www.stackoverflow.com/questions.
In terms of the API, this request would look like this:
Method: Get
Url: http://www.stackoverflow.com/questions
Headers
Host: www.stackoverflow.com
More-Headers: More-Values
If I have to send the same request to proxy, I need to add a proxy authorization header. I also need to change the URL to http://www.myproxy.com. How do I specify the URL of the website that I want to visit?
In terms of actual coding:
In onBeforeRequest callBack- I change the URL by returning {redirectUrl: https://www.myproxy.com}
In onBeforeSendHeaders callBack- I add the proxy auth header. I leave the Host header as is.
Where and how do I mention the URL of the target website I need content from?
The webRequest API won't let you do what you're asking, you need the browser to handle the proxying. The proxy API is meant to provide a way to do this, it is implemented in Chrome and is currently (August 2016) being implemented in Firefox (tracking bug is https://bugzilla.mozilla.org/show_bug.cgi?id=1283639).
Related
I am doing post request to API via Azure ApiManagement.
If Origin header is present and its not one of specified in Cors policy even postman will return empty response.
As soon as I disable Origin header I can get response.
So problem is following for web based application we must enable cors,
<cors allow-credentials="true">
<allowed-origins>
${env:CorsOrigin}
</allowed-origins>
<allowed-methods>
<method>*</method>
</allowed-methods>
<allowed-headers>
<header>*</header>
</allowed-headers>
</cors>
But our cordova app is also calling same api, and by default cordova will append Origin: file:// Then Api management is doing strange things it will cut body. So response will be empty. If i do same request directly to azure function, I will get proper response back, and since cordova does not care (To a degree in our case is ok) about CORS I would expect api management not to cut response.
Also Api management will not allow me to enter *, because of allow-credentials="true" and also I can't set it to allow file://
APIM does not support origin with file scheme, only http and https. I'll see if we can fix it. But there the workaround for allow-origins=* and allow-credentials=true is to use expressions:
<allowed-origins>
<origin>#(context.Request.Headers.GetValueOrDefault("Origin", "*"))</origin>
</allowed-origins>
This way response will contain sent Origin header value in Access-Control-Allow-Origin and not just * which is not allowed.
I want to simulate a fake 404 status code from the backend to see how my website will behave.
I don't want to mock fake response status in the code I would like to use some tools.
Cause sometimes I want to test it on the production which has version x and I don't want to waste time downloading this code and checking if there it is working.
Just simply mock response header status code for some test value like 404 for the fast check.
I tried to use software like Requestly - chrome extension.
And configured it like :
Modify response for header status put value 404 for google.com site.
But when I open google.com site I got status 200:
Do you know how can I change the status code of the given request?
Maybe by using different soft?
Status is not an HTTP response header. Status Code is an HTTP response code and Chrome does not allow to modify the response code of a request. There are two possible ways to solve this using Requestly
1-Step solution using Requestly Desktop App (Reliable & Guaranteed to work)
You can use any MITM proxy to intercept the request and simulate the status code. However, given my experience with Requestly, I'd explain how you can do it with Requestly Desktop App
Install Requestly Desktop App,
Go to Rules Tab and Click on New Rule
Select Modify Response
Define the exact URL (or Pattern) and define the status code. That's it.
Screenshot
Demo
https://www.youtube.com/watch?v=nLcIZGmMAtQ&ab_channel=Requestly
Using Requestly Browser Extension (2-Step Process, Should Work in most sites but there could be some CORS Issues)
Install Requestly
Use Requestly Mock Server and create a new mock which serves 400 or 404
Use Requestly to set up a Redirect Rule which redirects your original request to the URL of your mock request
Here are a couple of examples using the extension
Simulate 500 in Twitter Create Tweet API
Simulate 404 in BlinkIt Search API
Footer Notes
Desktop App-based solution is more reliable and guaranteed to work while Extension-based solution has technical limitations and there may be some CORS Issues depending upon your backend So prefer to use Solution 1.
PS - I built Requestly (& still building it with lots of heart)
In DevTools on the Network panel, right click a resource and select Block Request URL or Block Request Domain.
Does that help in your use case?
Try using ModResponse: https://chrome.google.com/webstore/detail/modresponse/bbjcdpjihbfmkgikdkplcalfebgcjjpm. You can add "Replay response" on the URL that you want to replay, visit that URL, then open up ModResponse again to edit the HTTP status code. You can also use it to edit the HTTP response body and header as well.
I work in a corporate environment and found an issue I can't resolve.
It has to do with EventSource changing the URL param from HTTP to HTTPS.
const url = 'http://localhost:8080'; // <-- using HTTP not HTTPS
new window.EventSource(url);
Which results in the browser throwing this error:
GET https://localhost:8080 net::ERR_TUNNEL_CONNECTION_FAILED
I am developing on a website using HTTPS so maybe this is by design that it uses the same protocol. Anyone experienced this issue or know how to resolve it?
--- Update ---
Looks like it is by design. When attempting this on another HTTPS site I got this:
Mixed Content: The page at 'https://...' was loaded over HTTPS, but requested an insecure EventSource endpoint 'http://localhost...'. This request has been blocked; the content must be served over HTTPS.
The question still remains, how do I get around this?
Eventsource won't change between http and https. Are you using the HTTPS Everywhere plugin for Chrome, or something like that?
I think you are being hit by the same-origin policy. What this means is that the SSE connection must be to the same origin, which basically means the same hostname and domain, same scheme (i.e. either both http or both https) and same port.
You can use CORS to get around this. At the top of your SSE script you need to send back this header:
Access-Control-Allow-Origin: *
This says anyone, from anywhere, is allowed to connect and get the data stream. It has to be done on the server script, there is no way to do it from the client. (By design: the whole point of same-origin policy is to stop people using other people's content and making it look like their own, without permission.)
Shameless Plug: see my chapter 9 in my book (Data Push Apps with HTML5 SSE, O'Reilly) for finer control of allow-origin, and how it interacts with cookies and basic auth.
BTW, I notice I mention that Chrome won't work with self-signed https certificates. To be honest I'm not sure if that is still the case, but that might also be something to watch out for when using https and localhost.
I'm trying to use the "Save to drive" button that Google provides to make Drive uploads even easier, it looks like this:
<script src="https://apis.google.com/js/platform.js" async defer></script>
<div class="g-savetodrive"
data-src="//example.com/path/to/myfile.pdf"
data-filename="My Statement.pdf"
data-sitename="My Company Name">
</div>
My question is, since I am using Laravel and the php artisan serve command to serve my project, how am I supposed to write the path to my file? It's located at 'Project name'/storage/app/docs/, I've tried //storage/app/docs/{{ $file->path }} but it doesn't work, and using storage_path() didn't change anything. What am I missing here?
EDIT:
I tried using another file, one that was hosted somewhere else. So I enabled CORS on my project and, using Postman, I tested to see the headers I was using:
Access-Control-Allow-Headers →Content-Type, X-Auth-Token, Origin, Range
Access-Control-Allow-Methods →POST, GET, OPTIONS, PUT, DELETE
Access-Control-Allow-Origin →*
Access-Control-Expose-Headers →Cache-Control, Content-Encoding, Content-Range
According to the Google documentation, it should be working now, yet it's not.
This is the error that I'm getting in the console:
Response to preflight request doesn't pass access control check:
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://localhost:8000' is therefore not allowed access.
The response had HTTP status code 400.
And I'm oficially out of ideas.
As stated in the document - Troubleshooting,
If you get an XHR error when downloading your data-src URL, verify that the resource actually exists, and that you do not have a CORS issue.
If the Save to Drive button works with all browsers except Internet Explorer 9, you may need to configure your browser to enable CORS, which is disabled by default.
If large files are truncated to 2MB, it is likely that your server is not exposing Content-Range, likely a CORS issue.
Take note the answer on the related SO question - Save To Drive Button Doesn't Work and the documentation that:
The data-src URL can be served from another domain but the responses from the HTTP server needs to support HTTP OPTION requests and include the following special HTTP headers:
Access-Control-Allow-Origin: *
Access-Control-Allow-Headers: Range
Access-Control-Expose-Headers: Cache-Control, Content-Encoding, Content-Range
When you create a Chrome extension and want to use OAuth 2.0, you can use a https://<app-id>.chromiumapp.org/* URL and be therefore able to have remote servers hit your browser instance directly (answered before - for example https://stackoverflow.com/a/30613603/61239). Does anyone know, or is able to theorize on how this works? And are you able to target any request at your browser, or does this only work for OAuth 2.0?
This is handled by the WebAuthFlow class, whose purpose is the following:
Given a provider URL, load the URL and perform usual web navigation until it results in redirection to a valid extension redirect URL.
The provider can show any UI to the user if needed before redirecting to an appropriate URL.
When the server instructs the browser to redirect to a valid extension redirect URL, that URL is instead passed to the callback function provided to chrome.identity.launchWebAuthFlow.
The 'appropriate' URLs are hardcoded in web_auth_flow.cc:
static const char kChromeExtensionSchemeUrlPattern[] =
"chrome-extension://%s/";
static const char kChromiumDomainRedirectUrlPattern[] =
"https://%s.chromiumapp.org/";
So the special URL https://<app-id>.chromiumapp.org/* only works in the context of a WebAuthFlow of the chrome.identity API. Note that the mechanism is totally internal to Chrome. The URL is never requested.