00:00
那我们先大概的看一下，接下来我们还要做什么事情啊，大家可以看到我们本身定义了一个safe product对吧？那接下来其实就是把这个函数实现就可以了，大家看一下是怎么实现呢？我们会发现c product分成三步，哪三步呢？一步是把图像存到IPFS上。然后接下来存完了之后拿到这个ID，接下来再把我们的那个就是整个的那个描述对吧？我们的那个文件描述的产品描述传传到这个IPFS上，然后再拿到一个ID，最后把我们所有的数据连同就是之前的这个params，然后连同我们拿到的两个ID，这里所说的ID其实就是哈希对吧？把这些东西全部存到block chain上面，所以block chain这里大家就会发现这个比较熟悉了，就直接这个com store，然后deployed，对吧？然后去把它存，存的时候肯定就是ADD product to store了，所以这个流程还是比较顺的啊。另外大家可以看到我们在这个submit这里当时还少加了一点东西，对吧？最后是不是还要event点，呃，Prevent default，就是相当于把它默认的这个事件处理，要要要给它取消掉，对吧，我们自己定义了这种取消的方法的，所以不要再把它默认的这个表单提交到我们的后台。
01:22
好，所以大家可以看到就是呃，现在来说的话，简单就是这样的，另外大家可以看到我们还有一些事情没有做，什么事情呢？就是在我们真正要去保存这个IPFS上的这个事件的时候，那两个函数怎么去做呢？啊，大家看到这里是这个具体的实现，这两个实现可能稍微会就是大家可能可能会看着会稍微有一点麻烦，那我们等一下给大家详细来来讲，就是呃，这两个东西到底是怎么去做的啊好，那接下来我们就首先呃把这段代码先实现一下，对吧，Save product，好，呃，这个下面这个是store，这个是前面的这个函数，我们还是插在这个render的前面，然后放在这个呃render的后边，然后放在我们整个这个load事件的前面。
02:22
还放到所有的函数可以都放在这里，所以大家还记得我们那个函数名称叫什么来着，叫save save product是吧，这个不要写错啊，Save product，然后我们会传进来一个reader，还有一个deco，叫什么decoed的paragraphs，对吧？把这两个东西要传进来，好，那么接下来我们就会啊，大家就记得我们就是三步走对不对？一步先把那个呃，这个我我们的那个图像传到IPFS上，然后第二步再拿到我们的那呃，就是传上去之后就拿到一个哈希，我们叫做ID，然后我们再把那个文本的详情描述详情传到IPS上，也拿到一个ID，最后再把所有的东西存到区块链上来。
03:22
就想到首先我们得定义出来那两个ID对吧，Image ID，然后还有一个叫什么来着，Description ID对吧，ID好，那接下来我们会想到当时我们三步走这里又是抽象出来了，我们就还是直接用函数化的这种表达来来写，对吧？所以一开始是save image save image是什么来着。好，SAVE1位置on IP FS啊好，C1位置on IP FS，所以这是我们的第一步，那这一步呢，大家会想到我们。
04:04
这是一个异步的调用，对吧？跟IPFS那边要做交互，那么我们肯定要传进去一个东西，传什么呢？传的就是reader图像就在这个里边，对吧？都都已经放在这个reader它对应的那个a buffer里边了，对，接下来我们会想到这是一个异步的请求，我们把它的返回要包装成一个promise，后边我们就可以用链式调用了，对吧？点赞了就可以好，那么他点赞我们这里就应该有一个回调，对不对？那整个我们希望的这一个promise返回的。应该最终返回，就是假如成功的话，返回应该就是IPFS那边给我们返回那个哈希值对不对，我们这里就把那个哈希值叫成ID，那ID对吧？那我们的这个image ID就等于ID，然后接下来我们继续第二步，对不对，就是那同样save就是text吧，Text我们叫textlo，就是这个文本的这种实体的这种对象，对吧？呃，就是二进制的这种文本的文件，On IP FS一样的一个定义。第二步这个要传的就应该是decoded params了，对吧？呃，Decoded params这个里边我们真正要用的是哪个呢？我们不需要把所有的东西都传进去，对吧？那decoed para params它里边的东西是什么呢？那么大家就会想到那它里边的东西。
05:42
这其实就是我们从那个表单的参数里面解析出来的，对吧，那表单的参数他在给的时候会给到什么呢？啊，我们就会想到每一个这里对应的参数，是不是就应该是把它对应的这个name给回来啊，所以我们这里对应的那个实际的详情描述应该是在哪里呢？Description，对不对，对，所以是这个啊，Product description，所以我们这里啊，不是这里啊。
06:20
下边c product，我们这里是不是直接把product description这一个拿出来，对应的那个值传进去就可以了，对吧？所以我们要的其实就是这个啊，好，那么接下来我们同样把它包成一个promise，然后之后就可以点赞了，对吧，同样点赞的时候ID拿到定义一个回调，那同样我们这里就是description ID就等于ID对吧？好，那接下来最后一步，最后一步就是就是把它要存到我们区块链上了，是不是c product，呃，To Block Cha，好，这里的参数那应该是什么呢？就是我们前面的decoded paragraphms，然后还有我们的两个ID对不对，Image ID和description ID，好把这两个东西传进去，这样我们的整个流程就。
07:20
做完了那整个流程这个好想，那难点在什么地方呢？难点在我们怎么样实现具体的这几个函数，对不对？大家会想到我们最下面的这个save product To Block chain，这个我们好想，我们能够想到啊，那我们就先来实现这个吧，这个大家可能会，呃，对于大家来讲最熟悉对吧？好，那么我们先来实现它function save product To Block chain，它传进来的参数是decoded，呃，Parents，对吧，Decoded，然后image ID，然后description ID，好。
08:11
呃，那么在这个里边我们要去做什么样的事情呢？我们肯定就是要把这个以commerce store里边调用它的a product to store方法对吧？调用它的函数，那么这个里边还是我们习惯性的这个deploy的点the，我们会拿到它的合约实例，然后我们知道要去调用它的a product to store方法对不对？那大家会想到ADD product to store的时候，这个里边我们是不是会传入很多很多个参数啊啊，那大家首先想我们ADD product to的时候有哪些参数来着，首先是name，然后categy，然后两个两个link对吧？那这里边的name应该是什么？应该是不是在。
09:11
Decoded paragraphs里边啊，是不是这样，它里边的那个参数，那我们又得到这里来找了，对吧，我们放的离得近一点啊，Name叫什么叫product name就是这个ID对应的那个参数对不对？好在这里写过来，Product内这是我们的第一个参数，这个扣D的太长了，对吧？我们直接就叫S吧，等一会我们写不下了啊好，接下来我们看到第二个参数，是不是它的那个categy啊，是不是这样，所以大家应该能够想到，肯定就哎这个太长了，我直接从这边复制好了。大家可以看到是不是就是这样product name，然后product category，对吧？好，直接从这里复制过来啊呃，大家对应的关系知道应该是我们这里面存着的那些关系对吧？所以是从这里拿出来的，这个大家要清楚，不要直接抄就就算了，好那么接下来对应的我们要拿到的是image link和description link对吧？所以这里所谓的link其实就是我们这里的image ID和description ID，对吧？好，接下来我们继续看还缺什么东西，然后是起始时间，结束时间，还有它的这个起拍价格对吧？那大家会想到起始时间，结束时间，还有起拍价格，这几个东西应该放在哪里呢？
10:50
这几个东西我们是不是应该直接从里边也是从里边要拿出来，但是时间这个东西，大家可能前面会看到，我们这里边H5这里边传过来的这一个时间格式是不是有可能有问题啊，对，所以我们可能还要对它去做一个转码，对吧？所以大家注意一下这里的这个start time和这个，呃，大家看这里边是怎么做的啊，呃，大家看哦，我们前面要定义出来这个start time和an time，然后start time怎么去做呢？大家看啊，是date.pass。
11:28
要做一个date的转码里边的参数，把我们这个东西放进去对不对？Option start，然后date.pass pass出来的这个数，这就应该是按照毫秒数记的那个时间戳对吧？然后除以1000，就是我们要的这一个，就是options type，对吧？然后大家会看到下面我们的那个antime是什么呢？An time又奇奇葩一点，因为我们当时给的是你去选。在几天之后结束对不对，一天三天，五天七天，所以我们这里给的拿到的这个束呢，只能是1357这样的一个数，所以我们把它pass in，拿到这个数之后，这是天数，乘以24，这是小时数，再乘以60，乘以60是不是秒数啊，对，所以我们用前面的这个秒数加上这么多秒，就是它真正的undertime的那个时时刻，好，这个稍微有点绕啊，但是大家就是搞清楚他这个逻辑，到时候自己实现一下就好了，好，那么我们在这里用同样的方法去定义一下啊，Let，呃，我们就叫做option start time，它就等于等于什么呢？date.pass。
12:49
然后里边传着，传进来的是什么呢？里边那个本身应该就叫product，叫什么option start time对吧？看一眼啊，Option start option start，好，那么传进来之后的这个值做了date.pass之后得到就是一个时间戳，但是它以毫秒记的，我们除以1000就是幂，对吧？好，那接下来啊，大家知道，就是在这个JS里边，我们如果直接这么去除的话，大家可以看一眼啊。
13:29
呃，这个可能不太。可能不太好去直接看，等一下我们直接把它就是cons.log打出来吧，我们在这里，呃，这样啊，我们看到那个课件这边是不是一开始就consult.love这个了，我们也学一下啊，到时候大家好看一点，Consult love，然后parents，好，我们把它打印出来，Parents in save product，接下来我们已经定义好了start time，那大家就会想到option and time，它就等于option start time，然后再加上一个数，对不对，加的这个数是什么呢？啊，我们会要求就是拿出来的这个parents里边有一个参数叫做叫做什么呢？叫做product option and，但是这个是一个天。
14:33
对吧？我们把这个拿出来，那这个数我们拿出来，前端传过来的一般都是字符串，所以我们还要把它pass in对吧？这个类型大家注意一下啊，其实对于JJS而言，如果要是它这个数据类型合适的话，直接加也是可以的，但是加完了之后就变成字符串了，对吧？啊，大家知道它默认如果字符串跟数字相加，听起来相当于是字符串拼接，所以大家注意一下这一点，然后后边是要这是天数乘以24小时数乘以60分钟数乘以秒乘以60秒对吧？好，这就是我们定义的这个option start time和option and time，好，那么定义完了之后，我们就在这里写了，对吧？接下来option start time option and time，好，接下来我们再看一眼，除了这两个之外还有什么？还有一个start price对吧，然后接下来就是两个状态了，对不对。
15:33
啊，这两个相对来讲看起来就简单一点了，然后这个start price，这个应该是什么东西呢？我们还有一个参数叫product price，对不对，这个时候就派上用场了，但是这里我们要注意，呃，这个product price我们是不是本身是一个以太的数量啊啊，所以大家看到这里还用到了WEB3点突尾的这个参数，对不对？把以太再转成我们想要的这个尾数，这个数量好，所以我们这里就照着这个来写啊啊，这个就是一长串的这个参数，我们把它还是回车一下吧，回车一下可能稍微会看起来舒服一点，对吧？好，接下来WEB3点出轨heros啊，里边又是一个很麻烦的东西，我直接抄啊。
16:33
Product price，然后我们把它转成以态对吧？这就是我们的这个price，呃，然后接下来呢，大家会想到还有两个是我们的，呃，一个叫做product condition，一个叫做product，呃，Status，对吧，大家应该应该记得好，那么接下来我们看一下这个，这两个叫什么？好，大家会看到，诶，我们这里好像只传了一个，是不是，我们看一下这个合约里边定义的哦，在ADD product to store的时候，我们不需要传status，因为默认它就是上架状态，对吧？Status指的是open，你开始拍卖还是说已经卖完了对吧？那这个是不需要传的，需要传的是你是新品还是二手货这个对吧？所以我们直接传的就是一个condition，所以这里边我们就只有一个product condition传进来，然。
17:33
然后去做一个pass就可以了，对吧？所以是这样的一个过程啊，好，我们这里还是在回车一下pass parentss对应的这个放进来肯定是，然后呃就可以了，对吧？啊然后大家可以看到我们这里边其实还是就是非常注意的，就是给了这个我们的交易对象啊，这个就是在我们发送交易的过程当中，如果呃，大家想要去给定指定的这个GA，而且有可能大家注意就是我们这里边正常来讲的话，默认发送就应该是要COS0对吧，但是我们在这个web环境里边，呃，正常来讲发送一个交易是不是应该指定这个，那用谁去发送啊，我们这里边就应该是ma mask里边默认的那个钱包地址对吧？所以我们这里边还是照着这个去写出来，去给一个。
18:33
呃，参数from web3.1th.account啊，零这个guess的话，大家想给就给，不给的话其实我觉得也还好，对吧？呃，不给的话就用默认的这个guess好，那么这一部分就相当于把我们所有要用的这个参数就已经都列出来了，对吧？好，那么接下来大家会想到我们这个该整的这个东西都已经弄完了，前面的这个是对pass in啊，所以后边到这里对吧，那我们链式调用肯定就有点赞对不对，拿到它的这个处理的结果，那这个结果呢，我们就会想到还应该有一个最后的一个处理，对吧？啊，这个处理的过程大家应该怎么怎么去做呢？肯定就是要用JA query里边Dollar去更改一些信息。
19:33
了对吧，那那么这里的话大家可以想到就是如果我真正的把这个产品添加上去的话，好像我的页面上是没有什么需要更改的东西，那最多这里边就是更改一些message信息啊，所以这个我就我就不详细的写了，我们把这个抄过来好了，大家看到这是先把messagesger.show就是表示我要把这个message要显示出来了，那言下之意是不是这个messages默认应该是隐藏的呀，对，所以默认应该是黑状态，所以这里message.show然后message.html给一个描述说诶，你的产品已经成功的添加到了商店里面，对吧？所以这里边我们就把这个抄一下，添加到这就可以了，好，呃，那么我们这一部分就是保存到区块链，区块链上这部分就已经做完了，那接下来还有两个事情我没有做，就是一个。
20:33
叫做save image on IP FS，另外一个叫做save product，呃，Type blog on IP FS，那这两个大家注意我们定义的这个函数，它不光是要把这个东西传到IPFS上，对吧，他还要拿回IPFS上的那个返回的那个哈希，另外大家注意我们这里边的调用方式，直接用了点赞链式调用，所以我们这里边的这个异步相当于应该是一个promise返回，对不对啊，所以大家看一下啊，这里就给大家详细的讲一讲promise了。那我们。
21:13
也不能算详细啊，其实就是给大家看一个基本的例子对不对，Save image on IP FS，然后我们传进来的是一个reader对吧？好，那么大家注意，我们现在就要返回一个，大家看这个promise怎么样去去写啊，整个这个函数，如果要想返回一个promise的话。我们的写法就是直接return return什么呢？一个new promise。啊，这就是返回一个promise对吧？那返回的这个promise我们怎么定义呢？大家可能见过啊，就是promise里边有两个参数对，一个参数叫做resolve，一个参数叫做reject，这表示什么意思呢？这表示大家想象一下就是promise是什么含义，Promise是承诺的意思，对吧？对，所以承诺是什么意思呢？就是说。
22:17
我预计我承诺在之后对会发生一件事情，那之后会发生什么事情呢？我们往往就在他接下来的这个回调里面会去定义，那定义出来的resolve和reject，这就相当于是它之后要发生的事情的这个处理，所以在这个事件里边，我们就会想到它是就会去处理一个异步的调用，对不对，只有异步的调用才有可能是未来有可能去发生的事情，对吧？所以我们在promise里面。就会去处理发起一个异步调用，然后根据它返回来的状态，根据它返回来的事情，我们去调用这里定义的result和reject，那这里的result和reject就会作为我们promise返回的，对，可以调用的东西，我们点赞的时候其实就是调用了result，那当然这个reject什么时候调用的，我们之前其实用过，如果想看他的那个错误信息的时候，还可以点catch对吧？所以点catch的时候其实就是要调用reject，所以是这样的一个过程啊给大家顺起来说一说，好，那我们看一下里面的实现吧，实现的时候大家会看到接下来我们是不是就应该要去发起异步调用了，对，就应该要拿那个IPFS了，对吧？诶，我们前面定义过IPFS吗？然后定义过了IPFS等于IPFSAPI对吧，这个我们已经定义了。
23:56
啊，所以大家会看到我们的API是5001的端口启动的API调用是这个，所以大家如果要是阿里云上很多同学显示出来，就是在那个web UI上显示出来，说是API无法访问，或者说是没有正唱放，可能之后这个调用会有问题，所以说呃，大家可以等到就是把这个都实现完了之后，去把这一部分再好好去详细的看一看，如果说能正常调用的话，那可能就是web UI那边显示的问题，对吧，它访问比较慢一点，处理的这个显示会出现状况，如果这里我们发现这个API调用，那可能问题就会比较大，就得把这个再去解决一下，处理一下，好，这是题外话啊，我们先在这里来看一下我们怎么样去调用，大家肯定就会想到了，我们这里是不是就应该调用IPFS的？
24:46
爱的方法啊，就像我们在外边直接去，呃，就是ipsi的一个一个文件一样，对吧？大家能够想到是这样的状况，那这里边还的API调用也非常简单，直接IPFS.a那里边给的值是什么呢？啊，这里边给的值得是一个buffer，那大家就会想到我们的这个，呃，这个本身的reader本来就是一个A瑞buffer吗？那这里边还不是我们这里边直接要的这个buffer，要的是什么呢？
25:21
呃，Buffer等于大家看啊，就是要用全局的这个buffer对象，它点from，它的来源来自于哪里呢？转成这个buffer类型，对吧？怎么转，从哪里来的东西转成这个buffer呢？是reader.result是reader这个类型，它前面做了呃处理，我们这个把它转成这个buffer之后，它会存储在一个result它下面的一个子属性里面，我们现在从它的result里面把它拿出来，然后用调用buffer.from方法就能把它转换成一个IPFS这边真正要用到的二进制文件这样一个buffer类型。
26:07
好，那么这里我们就可以ADD buffer了，对吧？好，那么ADD buffer之后，大家就会想到IPFS的这个调用是不是应该是一个异步调用啊，对，所以在这里大家会会想到了它就可以点赞，好，我们就直接在后面写吧，点赞啊点赞的话，那么就会拿到它的一个返回，对不对，那这样的一个返回我们写在回调里边是什么样子呢？就应该是。我们调用的时候就把这一个返回作为我们的result参数去返回，所以大家看一下这个怎么写啊，就是我们IPFS这里爱的buffer，这样就把它上传了，对吧，然后这是IFS的这个方法是一个返回一个promise，他点赞这是成功了对吧，成功的时候就会把它的结果返回结果里边的。
27:14
零点哈希就是我们真正要的那个哈希啊，这是这个IPFS返回的这个结果啊，大家可以到时候我们在这里也可以就是pencil.log看一下这个东西到底是什么，对吧？把它打印出来，大家可以到时候看一眼它到底是什么，然后我们就知道它里边的第一个元素点哈希就是我们要的那个东西，那这个点哈希到底怎么用呢？我们要做的其实就很简单，就是resolve，它点哈西就可以了，所以这表示什么呢？就是表示当我们未来的这个异步事件完成的时候，在这种状态下，我承诺去调用这样一个resolve函数，对吧？然后它返回的这个promise里边点赞就可以直接执行这个函数，拿到我们当前这个函信，所以大家会看到that的这个ID，这是它的回调的传输参数，对吧？这个参数是什么呢？就是我们这里的哈信，对，所以大家可以看到这这里的这个result，就相当于是我们这里点赞对吧？好，那同样大家可以看到就是我们这里点赞了，那如果要是reject是什么情形呢？那当然就是应该是IPFS这里的调用。
28:46
是不是就挂了，它出现这个异常了对吧？出现错误了点catch，那点catch的时候肯定它的返回就应该是一个error了，对吧？那同样我们定义一个回调，这里都应该一样，对吧？我们可以conso点啊，这个就conso.error好了，我们直接把它输出对吧？啊，这个就不用再弄别的了，直接error，用错误的方式把它输出出来，然后我们就reject error对不对？所以就是说如果我们在外面也要catch.catch error的话，是不是就可以在外层再把这个error再catch一遍对吧？再拿出来，所以这里就是我们完整的一个promise实现。
我来说两句