Detached mode viewer about mitmweb HOT 6 OPEN

Good that you mention it explicitly - I already marked all issues that require an active proxy as such. 😃

from mitmweb.

@MatthewShao will tackle this during his last GSoC weeks 😃. Here's a quick overview of what we need to implement:

• Add <script>MITMWEB_STATIC = true;</script> to index.html
• Add a new backend (next to the WebSocket backend) that is responsible for fetching all resources. So this is like the WebSocket backend, but without waiting for the WebSocket connection.
• Hide all interactive elements. Maybe we can create a <HideInStatic><Button/></HideInStatic> React component for this and use this where it makes sense. We can just use the global MITMWEB_STATIC variable here, no need to pass this down using props etc. At this point, we should already have a working static viewer, which is still powered by a mitmweb instance though.
• Write a flow -> static files converter (this part needs some more details/refinement)
• Think about how to best expose this functionality in mitmweb itself. 😃

from mitmweb.

@mhils I'm afraid we could not simply add <script>MITMWEB_STATIC=ture;</script> to index.html 😔 , because we have set the Content-Security-Policy here:https://github.com/mitmproxy/mitmproxy/blob/master/mitmproxy/tools/web/app.py#L124-L129, which prevent us from adding in-line scripts.

Correct me if I'm wrong: we want to have a global variable to tell whether the fronend is in static mode, this variable should be controlled by the backend server, for example, we can add a option --static to turn that js var on.
One possible solution is that we have two different index template, one for static mode and the other for the normal. The static mode template included one more .js file, maybe called static_var.js, containing all the static mode specified variables.
Then we can switch between these two template according to the --static option. Hope that I've made my idea clear, any other ideas are super welcome! 😀

from mitmweb.

I'm afraid we could not simply add <script>MITMWEB_STATIC=ture;</script> to index.html

Good catch. Let's do what you proposed, just create a static.js file that contains MITMWEB_STATIC=true; and include that. :)

we want to have a global variable to tell whether the fronend is in static mode

Exactly.

his variable should be controlled by the backend server, for example, we can add a option --static to turn that js var on.

I'm not sure if I'm following you here. In normal mitmweb operation mode, we never want this to be set. This should only be added by our flow -> static converter. For testing/development, we may of course want to include it in the template.

Does that make sense? :)

from mitmweb.

@mhils, so before we have the flow->static converter implementation, what should we do to turn the MITMWEB_STATIC variable on and off? or do we need to finish the converter before we start the frontend jobs?

from mitmweb.

We only need to turn it on for development, so we can just add static.js and include it in index.html 😃

from mitmweb.