Opening Files from a Web Page

[TrippyLighting]

I am following the example provided in the user documentation for opening a .f3d file from a web page directly in Fusion 360.

For opening a local file that works perfectly, however, when trying to do this with a .f3d file stored on Dropbox or Google Drive Fusion. 360 responds with a variety of messages, depending of what I put in the href. The link below, when clicked downloads the a .f3d file directly from dropbox without any further interaction needed.

https://www.dropbox.com/s/4pcky3w16wgai9r/708744108081.f3d?dl=1

However, when using this link instead of a local directory Fusion 360 returns a message blow:

[Anonymous]

The .f3d file is actually a .zip with a different extension.

If you rename it with the .zip extension a standard zip/unzipper will open

it as a directory structure.

My guess if that dropbox /google drive are being "clever", and are

getting confused by not having a .zip .7z or other known extension.

As a test, rename to a .zip and try. If it works maybe you will have to

put .f3d files as .zip on the cloud and rename locally.

[KrisKaplan]

Are you sure you are properly encoding the 'file' argument value?  If I run the following command in a web browser's javascript console, it properly opens that file link for me.

window.location.href = 'fusion360://command=open&file=https%3A%2F%2Fwww.dropbox.com%2Fs%2F4pcky3w16wgai9r%2F708744108081.f3d%3Fdl%3D1'

Kris

[TrippyLighting]

@KrisKaplan @Anonymous Thanks for the help.

I ended up hosting the files on Shopify where our store front is located but ran into the same problem there. Howver, in essence what I did actually worked. Just not with Safari!

It works fine with Chrome (Mac & win) and IE and was confirmed by @prainsberry and @ekinsb. Thanks to you you guys as well for the quick help.

[KrisKaplan]

Looking at the links on your website, for example in the part 10mm-round-45-x-90-4-way-composite-connector, the fusion360 link is:

    fusion360://command=insert&file=https://cdn.shopify.com/s/files/1/2238/8321/files/708744108289.f3d?16195062404084869982

Notice that the URL in the 'file' argument is not properly encoded as required.  This link should be:

    fusion360://command=insert&file=https%3A%2F%2Fcdn.shopify.com%2Fs%2Ffiles%2F1%2F2238%2F8321%2Ffiles%2F708744108289.f3d%3F16195062404084869982

Different browsers can handle query parameters differently, especially if it is a main page navigation URL.  By having a query parameter value that is itself an unencoded URN, then parsing and handling of the query parameters can get confused, especially if the URL in the value itself has query parameters.

I can verify that in Safari, the first, unencoded value link will generate an error (as it gets mangled and mishandled), but using the properly encoded URL it downloads and opens fine.  Can you try URL encoding the URL for the 'file' query parameter value and see if that fixes your problems?

Kris

[TrippyLighting]

@KrisKaplan Thank you again for your continued help! As you've now discovered, proper HTML is not really my forte, I do what I can 😉

So how do I "properly encode" this "as required" ?

Are there good educational resources that you recommend ? 

[TrippyLighting]

So I guess this is what you are referring to. Are there good tools available that help me do that sort of thing without be having to do this manually ?

Edit: @KrisKaplan I played around with the encoding tool on the URL Encoding Reference and when using tha on one of our Shopify product pages it does actually work in Safari as well.

Awesome!

[KrisKaplan]

Yes.  As mentioned in the Opening Files from a Web Page:

"The “file” argument must be URI encoded (as with JavaScript's encodeURIComponent). The encodeURIComponent function replaces certain characters with their equivalent escape sequences...."

You wouldn't likely need to re-implement this encoding (there are many existing implementations out there).  So if you are building this link in Javascript, it would just mean doing something like:

var fileUrl = ...;
var link = 'fusion360://command=open&file=' + encodeURIComponent(fileUrl);

If you are building the link from some other language, they all either have direct URI encoding functions, or have common frameworks available that include this (normally part of a URI/URL/URN building/parsing utility).  If you have a language I can suggest an encoding function to look at.

Kris

[TrippyLighting]

No, this page is not actually builtin any language other than HTML, at least not accessible by a user.

In Shopify you build your product pages using some form of editor that usually keeps you away from using HTML.

Unless of course you want to do the stuff discussed here 😉

The <> brackets allow you to switch to HTML code  view.

There I'd have insert the specific code to allow our customers to download files directly into Fusion.

There might be more advanced editing features available from Shopify but I've not looked into that.

[KrisKaplan · Accepted solution]

OK.  If you aren't building the links in the code and they are just hard coded into the page, then you can just generate the links by hand.  You just need to encode the value yourself.  I might just use the developer tools javascript console in any browser (like Chrome) and call encodeURIComponent interactively in the console to get the encoded value.  Or there are plenty of online encoders/decoders that do the same with a GUI to make it a bit friendlier.  For example, you could use http://www.url-encode-decode.com/.

Kris  

[TrippyLighting]

I looked with a little more sense at the documentation page for this feature and find that the little tool at the end works well as it also allows me to integrate the ID into the link.

This has served the purpose well!

Thanks!