Files sync problem?

[Southside]

Background: I’m trying to build a shopping site using Vue - free lessons all next week - BTW and also explore the idea of a CDN on SAFE - tough I have yet to work out the economic fesibility of that…

So I have the guts of the beginner tutorial from Vue Mastery and tried to adapt it for SAFE.
I uploaded a bunch of files to safe://vue-shop and also to safe://cdn, made a few edits to try make the SAFE site look a bit like the clearnet tutorial shown here with a box that uses css from the cdn.

FWIW this works locally to an extent, roll over the color picker and the socks chnge from green to blue, click on the cart button and the cart indicator topright increments. THe ugly box bottom right is getting its css from another local site NOT from safe://cdn of course despite what it says there. I ran into some problems editing and it seems to me that the sync command is not working correctly - or I have misunder stood it Anyway - heres a transcript covering form about 0200 this morning until 0400 ish…

willie@gagarin:~/projects/maidsafe/local_sites$ safe files put vue/  --recursive
FilesContainer created at: "safe://hnyynyip71nxtucqtz6xj3pp9h5syan1t1xidno574nrium9hq8k6frkocbnc"
+  vue/assets/images/vm-Socks-blue.png   safe://hbwynyd6qcmodk68dqfw4zis5ntgtrrhtjshqpfzdg66u9t3hiniebf45m 
+  vue/assets/images/vm-Socks-green.png  safe://hbwynydtzkcrmhwyduemg1oct9dq1peawgakz5pgoxofzguzqksqyx5atu 
+  vue/css/style.css                     safe://hbhyyyntwr3u1au7tszhuo4g336pjjheoecnbb3wp4617tdfohb5oqkwtc 
+  vue/index.html                        safe://hbhybynxb61mxyd1r7ycszi44odceteu195zoiit8kt8cenzyca7ekmsi6 
+  vue/js/main.js                        safe://hbkygyn7fziir7377iaqtbx4a589kqe1qtshpc5gqayutri8ss5s1pz364 
+  vue/js/vue.min.js                     safe://hbkygydq15k9ghwiwhp9fuhf3ea1yu9xoahxewsticc7xqcp4cuni1m1fw 
+  vue/shop.html                         safe://hbhybynjweocxs5ioa6qbhdgjgdogbcnpw7ti669ybmp9aj7qhubgzrepu 
willie@gagarin:~/projects/maidsafe/local_sites$ safe nrs create vue-shop --link safe://hnyynyip71nxtucqtz6xj3pp9h5syan1t1xidno574nrium9hq8k6frkocbnc
[2020-04-10T02:07:00Z ERROR safe] safe-cli error: [Error] InvalidInput - The linked content (FilesContainer) is versionable, therefore NRS requires the link to specify a version: "safe://hnyynyip71nxtucqtz6xj3pp9h5syan1t1xidno574nrium9hq8k6frkocbnc"
willie@gagarin:~/projects/maidsafe/local_sites$ safe nrs create vue-shop --link safe://hnyynyip71nxtucqtz6xj3pp9h5syan1t1xidno574nrium9hq8k6frkocbnc?v=0
New NRS Map for "safe://vue-shop" created at: "safe://hnyydywk4r9ua5sa69s57abrs96rdt1nhpqgoabfnhc3p1rxg9m67rbuuobqh"
+  vue-shop  safe://hnyynyip71nxtucqtz6xj3pp9h5syan1t1xidno574nrium9hq8k6frkocbnc?v=0 
willie@gagarin:~/projects/maidsafe/local_sites$ safe files sync vue/ safe://vue-shop --recursive
FilesContainer synced up (version 1): "safe://vue-shop"
*  vue/index.html  safe://hbhybynw6nhkyf1zqfgkqtzn3ohqt1448oh1ppfmshjgh5iu8mcpxdy3z3 
willie@gagarin:~/projects/maidsafe/local_sites$ safe files sync vue/ safe://vue-shop --recursive
FilesContainer synced up (version 2): "safe://vue-shop"
*  vue/shop.html  safe://hbhybyng16dkiu4748mbz6f4peweksh5xzgwt7nzkwaymza8e7kksu8hec 
willie@gagarin:~/projects/maidsafe/local_sites$ safe files sync vue/ safe://vue-shop --recursive
No changes were required, source location is already in sync with FilesContainer (version 2) at: "safe://vue-shop"
willie@gagarin:~/projects/maidsafe/local_sites$ safe files sync vue/ safe://vue-shop --recursive
FilesContainer synced up (version 3): "safe://vue-shop"
*  vue/shop.html  safe://hbhybynztowmfx67sc4jq34cx1t5phyiten33ak1stthw3ykgetnhijmkc 
willie@gagarin:~/projects/maidsafe/local_sites$ safe files sync vue/ safe://vue-shop --recursive
FilesContainer synced up (version 4): "safe://vue-shop"
*  vue/index.html  safe://hbhybydn4ugsj46xooqzmnr6ms6t7bpawi3rqn3rjbdnrttmc631o8k1zh 
willie@gagarin:~/projects/maidsafe/local_sites$ safe files tree safe://vue-shop
safe://vue-shop
├── assets
│   └── images
│       ├── vm-Socks-blue.png
│       └── vm-Socks-green.png
├── css
│   └── style.css
├── index.html
├── js
│   ├── main.js
│   └── vue.min.js
└── shop.html

4 directories, 7 files
willie@gagarin:~/projects/maidsafe/local_sites$ safe cat safe://vue-shop
Files of FilesContainer (version 0) at "safe://vue-shop":
+-----------------------------------+--------+----------------------+----------------------+-------------------------------------------------------------------+
| Name                              | Size   | Created              | Modified             | Link                                                              |
+-----------------------------------+--------+----------------------+----------------------+-------------------------------------------------------------------+
| /assets/images/vm-Socks-blue.png  | 754163 | 2020-04-10T02:06:05Z | 2020-04-10T02:06:05Z | safe://hbwynyd6qcmodk68dqfw4zis5ntgtrrhtjshqpfzdg66u9t3hiniebf45m |
+-----------------------------------+--------+----------------------+----------------------+-------------------------------------------------------------------+
| /assets/images/vm-Socks-green.png | 126195 | 2020-04-10T02:06:05Z | 2020-04-10T02:06:05Z | safe://hbwynydtzkcrmhwyduemg1oct9dq1peawgakz5pgoxofzguzqksqyx5atu |
+-----------------------------------+--------+----------------------+----------------------+-------------------------------------------------------------------+
| /css/style.css                    | 1321   | 2020-04-10T02:06:05Z | 2020-04-10T02:06:05Z | safe://hbhyyyntwr3u1au7tszhuo4g336pjjheoecnbb3wp4617tdfohb5oqkwtc |
+-----------------------------------+--------+----------------------+----------------------+-------------------------------------------------------------------+
| /index.html                       | 1147   | 2020-04-10T02:06:05Z | 2020-04-10T02:06:05Z | safe://hbhybynxb61mxyd1r7ycszi44odceteu195zoiit8kt8cenzyca7ekmsi6 |
+-----------------------------------+--------+----------------------+----------------------+-------------------------------------------------------------------+
| /js/main.js                       | 2296   | 2020-04-10T02:06:05Z | 2020-04-10T02:06:05Z | safe://hbkygyn7fziir7377iaqtbx4a589kqe1qtshpc5gqayutri8ss5s1pz364 |
+-----------------------------------+--------+----------------------+----------------------+-------------------------------------------------------------------+
| /js/vue.min.js                    | 93670  | 2020-04-10T02:06:05Z | 2020-04-10T02:06:05Z | safe://hbkygydq15k9ghwiwhp9fuhf3ea1yu9xoahxewsticc7xqcp4cuni1m1fw |
+-----------------------------------+--------+----------------------+----------------------+-------------------------------------------------------------------+
| /shop.html                        | 1063   | 2020-04-10T02:06:05Z | 2020-04-10T02:06:05Z | safe://hbhybynjweocxs5ioa6qbhdgjgdogbcnpw7ti669ybmp9aj7qhubgzrepu |
+-----------------------------------+--------+----------------------+----------------------+-------------------------------------------------------------------+
willie@gagarin:~/projects/maidsafe/local_sites$ safe cat  safe://hbhybynxb61mxyd1r7ycszi44odceteu195zoiit8kt8cenzyca7ekmsi6 
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vue Playground for SAFE</title>
    <!-- <link rel="stylesheet" type="text/css" href="css/style.css" />
    -->
    <link
      rel="stylesheet"
      type="text/css"
      href="safe://hbhyyyd4worx61icfaaow7c5dzb7q16gh1pj6ak91tm3zktu8hrtqu976f"
    />
  </head>
  <body>
    <div class="nav-bar">
      <p class="pageTitle">Shop SAFEly</p>
    </div>

    <div id="app">
      <div class="cart">
        <p>Cart({{ cart.length }})</p>
      </div>
      <product :premium="premium" @add-to-cart="updateCart"></product>
    </div>

    <div class="external">
      <h1>It came from Outside!!!</h1>
      <h3>style linked from safe://cdn/css/southside.css</h3>
      <h4>Or did it? Shop <a href="shop.html">here</a></h4>
    </div>

    <!-- 
      <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
      -->
    <script src="js/vue.min.js"></script>
    <!-- <script src="safe://cdn/js/vue.min.js"></script>-->

    <script src="js/main.js"></script>
  </body>
</html>
willie@gagarin:~/projects/maidsafe/local_sites$ cat vue/index.html 
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vue Shop for SAFE</title>
    <link 
      rel="stylesheet"
      type="text/css"
      href="css/style.css" />

    <link
      rel="stylesheet"
      type="text/css"
      href="safe://cdn/css/southside.css"
    />
  </head>
  <body>
    <div class="nav-bar">
      <p class="pageTitle">Shop SAFEly</p>
    </div>

    <div id="app">
      <div class="cart">
        <p>Cart({{ cart.length }})</p>
      </div>
      <product :premium="premium" @add-to-cart="updateCart"></product>
    </div>

    <div class="external">
      <h1>It came from Outside!!!</h1>
      <h3>style linked from safe://cdn/css/southside.css</h3>
      <h4>Or did it? Shop <a href="shop.html">here</a></h4>
    </div>

    <!-- 
      <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
      -->
    <script src="js/vue.min.js"></script>
    <!-- <script src="safe://cdn/js/vue.min.js"></script>-->

    <script src="js/main.js"></script>
  </body>
</html>

Note the file modification times shown in the safe cat safe://vue-shop command. the previous few comands were run around 0345.

Notte the difference between catting the index file on the shared section with the same command on my local site - But I had just sync’e them a few seconds beforehand…

I know its late but can someone cast an eye over this and see if it is just a silly mistake on my part please?

The CDN bit seems to work OK at least

[bochaco]

I think you are just missing the --update-nrs flag in your files sync commands.

What happens is that an NRS URL in a mutation command is by default used only to resolve the location of the target content, but the NRS link itself is not updated with the new version of the targeted content, thus the --update-nrs is what tells the command to also perform such an update.

However, you are not alone with this one, there are suggestions to change this behavior and make an NRS update the default with perhaps an optional --no-nrs-update flag: https://github.com/maidsafe/safe-api/issues/492

This can be confirmed with the following command, you can see your vue-shop NRS name is linked to version 0 of the FilesContainer:

$ safe dog safe://vue-shop/index.html
Native data type: ImmutableData (published)
XOR name: 0x3c3e92de01c89d032d7aeb501b11144e5fdde15ac4ea89d8815c0cc750a5dabe
XOR-URL: safe://hbhybynxb61mxyd1r7ycszi44odceteu195zoiit8kt8cenzyca7ekmsi6
Media type: text/html

Resolved using NRS Map:
PublicName: "vue-shop"
Container XOR-URL: safe://hnyydywk4r9ua5sa69s57abrs96rdt1nhpqgoabfnhc3p1rxg9m67rbuuobqh
Native data type: PublishedSeqAppendOnlyData
Type tag: 1500
XOR name: 0x15a27e78ddb1efdb7dc0496ff8838c85c6b8d0c04a2e332d911e6fafdd206738
Version: 0
+------------------+----------------------+----------------------+--------------------------------------------------------------------------+
| NRS name/subname | Created              | Modified             | Link                                                                     |
+------------------+----------------------+----------------------+--------------------------------------------------------------------------+
| vue-shop         | 2020-04-10T02:07:08Z | 2020-04-10T02:07:08Z | safe://hnyynyip71nxtucqtz6xj3pp9h5syan1t1xidno574nrium9hq8k6frkocbnc?v=0 |
+------------------+----------------------+----------------------+--------------------------------------------------------------------------+

You can fix it with safe nrs add vue-shop --link safe://hnyynyip71nxtucqtz6xj3pp9h5syan1t1xidno574nrium9hq8k6frkocbnc?v=4

[Southside]

Thank you. I will do as you suggest later. More kip now zzzzz

[Southside]

@bochaco

vue-shop NRS name is linked to version 0 of the FilesContainer

Yeah that was the bit that really confused me.

[Sascha]

@Southside

I’m trying to build a shopping site

Very nice! This is a bit off topic, but I’m interested in what kind of search mechanisms you have looked at and what is available. I’m talking about something like what these sites use.

Smoking Pipes & Tobacco Pipes – TobaccoPipes.com

Riflescopes, Optical aiming devices, Telescopic sights, Pointing scopes -...

Air Guns | Buy Air Rifles & Air Pistols | Pyramyd AIR

American shopping sites seem to be pretty good for searching, whereas the Finnish sites are all terrible. There might even be a business opportunity here. Please start a new thread if you find this interesting but too much off this topic.

[tfa]

I have just noticed this excerpt from OP:

    <link
      rel="stylesheet"
      type="text/css"
      href="safe://cdn/css/southside.css"
    />

@maidsafe, a link without version number shouldn’t work because it breaks Perpetual Web principle. I mentioned this a long time ago and I thought this was agreed. I hope this is just a bug that is yet to be corrected.

[davidpbrown]

@tfa

a link without version number shouldn’t work because it breaks Perpetual Web principle

First I’ve seen of this…
… has that been thought through… seems like a pina for updating a simple site.

If I change a css file, do I have to update all the files that use it??

… surely the default is latest version; and sites that want to be deliberate and perpetual use the xorurl??

Surely the option to support perpetual content, is rooted in linking deliberately as safe://foo/bar.html?v=1 if you choose to do that.

offtopic

[happybeing]

The perpetual web can work without versions for relative links, but not for absolute links to local content.

For example, if your home page links to /biography.html and you flip to an earlier version of the site which has the same link, it will I think always link to the corresponding version of the file (i.e. in the same container).

But if you provide absolute links (links which start with safe://) these should include a version for the perpetual web to work as expected.

In many cases you will want to link to the latest version of an external link so I don’t think we can force them to have a version @tfa.

So we will need some guidelines such as:

• always use relative links where available
• if you use an absolute link, include the version unless you want to link to the latest version of its content and before you omit the version, consider what will happen if an older version of your site is viewed but points to later versions of the absolute link.

[Southside]

Thanks @tfa the code I posted was VERY rough, large parts of it are not expected to work. Now that I can see a good reason for not seeing the results of my changes in the browser, - thanks again @bochaco - I hope to get the functionality I want soon and get it all tidied up

All this really came from frustration with Svelte - sorry @happybeing and then seeing the magnificent work on Phantom by @Shane using Vue. The beginner tutorial is a shopping site so it was an easy decision to make to try make this work.

@happybeing

But if you provide absolute links (links which start with safe:// ) these should include a version for the perpetual web to work as expected.

This could be a right PITA for a CDN as any links to it will become stale anytime content is added to the CDN, yes?

[davidpbrown]

So, for relative links, can I check the basic… if we have relative fileset like ./index.html and ./style.css and then reupload just index.html, that will work or is the expectation that both are reuploaded?

I wonder this is the same query @Southside is asking??

[Southside]

AIUI, that should work OK. ./style.css (./css/style.css please) hasn’t changed and is relative so will be OK

[davidpbrown]

@Southside

./css/style.css please

Medicine for your OCD

[Southside]

You start building a site of any complexity and you will be VERY grateful for a wee dose of OCD. The root of a site with dozens of .html and.css with similar names is a most uncomfortable place to be

[tfa]

@happybeing

In many cases you will want to link to the latest version of an external link so I don’t think we can force them to have a version @tfa.

I don’t agree with that because what it is displayed by a safe site could change without increasing its version number and this goes against PWEB principle.

I don’t find the link, but I remembered that someone at @maidsafe agreed with this.

An added advantage of versioning external references is the stability and safety of your site: no risk of breakage by an unfortunate uncontrolled external change.

Edit: I found the link:

@joshuef

Aha. Yeh. You’re right. We’ve a fix in place for this for resources from the same domain ( ie. Unspecified version of IMG/whatever.jpg will now resolve to the current version of the NRS map).

What you’re describing (as I understand) is that we should be blocking resources X domain wise, when no version is specified.

This should be pretty easy to get in atop the other fix. Though I wonder what the http response for this should be (as we need to be sending http in the end.) Perhaps just 403 forbidden for now. And the browser can log xdomain unspecified version or some such…

[Southside]

@tfa Thank you again, that simple change

means safe://vue-shop looks more like it should.

As an aside, still got the partial upload of images problem but the increment cart code works, as does the rollover for colours

[Sascha]

@Southside

a wee dose of OCD

OCD FTW!!!

[davidpbrown]

Oh wow the forum has OCD problem!

Posting 012356789. gets