Use local resources in WKWebview - uiwebview

How do I make WKWebview use local .js, .css and/or local image files, in place of remote files, in order to make the web page load faster.
Also, I noticed NSURLProtocol methods (when implemented through register class) do not get called when WKNavigationDelegate methods are implemented, any idea on why?

In iOS 9 API there is a new method for loading local resource
/*! #abstract Navigates to the requested file URL on the filesystem.
#param URL The file URL to which to navigate.
#param readAccessURL The URL to allow read access to.
#discussion If readAccessURL references a single file, only that file may be loaded by WebKit.
If readAccessURL references a directory, files inside that file may be loaded by WebKit.
#result A new navigation for the given file URL.
*/
#available(iOS 9.0, *)
func loadFileURL(URL: NSURL, allowingReadAccessToURL readAccessURL: NSURL) -> WKNavigation?

After going through a lot of documentation, I realized/learnt that I'll not be able to track URLs if I use WKWebviews. I have to resort to UIWebView for the moment.

Related

Non-english url path

In next.js that uses php-like approach - files in pages folder became url paths. Like /pages/reader.js will be loaded by url http://localhost/reader.
Problem is that i can't undersand how to use non-english url path in next.js?
Codesandbox example. (Update page to load from server)
Url example:
http://localhost/читатель
That changes internally by chrome to:
http://localhost/%D1%87%D0%B8%D1%82%D0%B0%D1%82%D0%B5%D0%BB%D1%8C
In next.js pages folder file named:
pages/читатель.tsx // not working
pages/%D1%87%D0%B8%D1%82%D0%B0%D1%82%D0%B5%D0%BB%D1%8C.tsx //working but i can't name files like that, i will not find what i need later.
Maybe php users resolved this somehow ;)
try to use encodeURI() of core javascript which can convert the specific characters to the required url form
const url=encodeURI('читатель.tsx');
console.log(url);//%D1%87%D0%B8%D1%82%D0%B0%D1%82%D0%B5%D0%BB%D1%8C.tsx
Then we can use this path to navigate

Programatically determine path to Chrome Extensions folder

Is there a way to programmatically determine the path to the Chrome Extensions folder? I want to make a call like the following:
xhr.open( 'GET', chrome.extension.getURL( '/' + msg.file ), true );
to consume the contents of a file I create with a native messaging host (so as to get past the 1MB pipe limitation for certain responses). I can see what my 'profiles' path is in chrome://version, but I cannot find anywhere where this might be exposed (was hoping, at the least, it could be exposed to extensions). Furthermore, there's a version subfolder that I do not know how it is constructed, e.g. I have the following subfolders for the Chrome Media Router extension:
5216.530.0.13_0
5216.530.0.14_0
5216.530.0.14_1
everything up to _ is the version from the manifest.json, but I don't know how/when the part after the _ comes into play (my guess is it is used to distinguish updates to the webstore when the version number is not changed).
so I really would most prefer an API function that would get me the full path for my extension from the extension.

node.js - secure image file upload

We had to implement an image uploader for a node.js project. As framework we are using express.js We did it like described here: http://howtonode.org/really-simple-file-uploads
But we are not sure how to secure this image uploader. What we did so far is:
checking the file size
checking extension and header
rename the file
file is only accessible over a special route and is not in the root folder
Is this enough? We don't feel very comfortable with the following line:
// CHECKING FOR FILESIZE, EXTENSION, HEADERS
fs.readFile(req.files.displayImage.path, function (err, data) {
...
...
...
// RENAMING FILE
// SAVE FILE
...
...
...
}
Is it save to read the image this way? We are afraid, there could be malicious code in req.files.displayImage.path. Do we need to add more checks or are our checks sufficient? What attack vectors do we offer an attacker if we use the code as described?
Thank you for your advices
Tschoartschi
If you are concerned for opening malicious images on client side as posted in your comments. Try opening third party scripts and untrusted files inside a sandboxed iframe this will protect your users.

Symfony 2 Static asset authorisations (.js behind firewall)

What is the procedure for securing static assets (javascript and css) behind the firewall?
I have an admin section which uses javascript heavily. I don't really want to expose the code to the public.
I currently compile all my javascript using assetic to files in /web/admin/js/xyz.js
Is there a simple way to do this that I'm overlooking?
You could use a controller to serve the static file and secure that controller. Something like:
/**
* Serves static javascript file.
* We have configured /secure to be secured by some firewall
*
* #Route("/secure/xyz.js", name="static_xyz")
*/
public function staticXyzAction()
{
$headers = array(
'Content-Type' => 'text/javascript',
);
return new Response(file_get_contents($this->get('kernel')
->getRootDir().'../web/admin/js/xyz.js'), 200, $headers);
}
This is just an example with the data you provided. Obviously in your final code the file being served should be located in some directory which is not directly accesible by the web server.
The obvious downside to this approach is performance. PHP is much slower for serving an static file than your web server but depending on your load this may not be an issue.
Why do you want to "hide" these admin js files? The js should not perform critical auth or check rights, but just converse with your Sf2 Apis / Controllers which do that, and should not be critical if read. This is a conception matter.
If you are afraid that a lambda user / hacker sees these js files, you could set a very complicated random js output in Assetic. The Symfony .htaccess allows user to access static files only if they know their exact url, they cannot list your repository where you store your builded assets, the firewall catch that.
And last security mesure, use yui-minifier with Assetic to minify and obfusacate your builded js files.

Get local file inside the extension folder in Chrome

I know that I can't get a local file from within the extension directory. It is possible to get a file that is inside the extension directory itself?
You can use chrome.runtime.getURL to get a fully-qualified URL to a resource.
// Outputs path to the file regardless if it exits
> chrome.runtime.getURL('assets/extension-icon.png');
"chrome-extension://kfcphocilcidmjolfgicbchdfjjlfkmh/assets/extension-icon.png"
The chrome-extension protocol plus the extension id, will be the address for the extension's root directory.
If you need something more powerful, you might also use HTML5's FileSystem API which can create, read, write and list files from a sandbox in the current user's local file system.
On Chrome 17 or later, for this to work you must include the web_accessible_resources section to allow an image packed within the extension to be injected into a web page. http://developer.chrome.com/extensions/manifest.html#web_accessible_resources
{...
"web_accessible_resources": [
"images/my-awesome-image1.png",
"images/my-amazing-icon1.png"
],...}
(courtesy of jhaury)

Resources