aim:

首先咱们把 broswer 和自己的api 连接起来（要显示出来自己的本地ipfs id）

my bugs

CROS

How to do cross-origin requests on IPFS

https://github.com/INFURA/tutorials/wiki/IPFS-and-CORS

参考： No 'Access-Control-Allow-Origin' header is present on the requested resource.'Ajax跨域访问解决方案

https://blog.csdn.net/zhoucheng05_13/article/details/53580683

No 'Access-Control-Allow-Origin' header is present on the requested resource.

当使用ajax访问远程服务器时，请求失败，浏览器报如上错误。这是出于安全的考虑，默认禁止跨域访问导致的。

在A网站中，我们希望使用Ajax来获得B网站中的特定内容。如果A网站与B网站不在同一个域中，那么就出现了跨域访问问题。你可以理解为两个域名之间不能跨过域名来发送请求或者请求数据，否则就是不安全的。跨域访问违反了同源策略，同源策略的详细信息可以点击如下链接：Same-origin_policy；

总而言之，同源策略规定，浏览器的ajax只能访问跟它的HTML页面同源（相同域名或IP）的资源。

解决ipfs 的 cros 问题的方法

ctrl- c退出ipfs

ipfs config --json API.HTTPHeaders.Access-Control-Allow-Methods '["PUT", "GET", "POST", "OPTIONS"]'

ipfs config --json API.HTTPHeaders.Access-Control-Allow-Origin '["*"]'

result

final code for c1

<!DOCTYPE html>

<html lang="en">

<head>

	<meta charset="UTF-8">

	<meta name="viewport" content="width=device-width, initial-scale=1.0">

	<meta http-equiv="X-UA-Compatible" content="ie=edge">

	<title>Course C Exercise</title>

	<link href="../assets/style.css" rel="stylesheet" />

</head>

<body>

	<header>

		<h1><a href="../index.html">IPFS Camp 2019: Course C</a></h1>

	</header>

	<div id="exercises" class="grid">

		<div id="exercise-1" class="exercise">

			<h2>Exercise #1: Talking to remote HTTP API from JS</h2>

			<p>1. Initialize API instance under <code>ipfs</code> variable</p>

			<p>2. Execute <code>ipfs.id()</code> to see what is on the other end</p>

			<p>3. If it works, you will see returned output below:</p>

			<p>

				<pre id="ipfsId">(result of "ipfs id" will appear here)</pre>

			</p>

		</div>

	</div>

	<div id="peerBoard-container"></div>

    <!-- TODO: Add a script tag loading the http-client browser bundle -->

    <!-- https://github.com/ipfs/js-ipfs-http-client#in-a-web-browser -->

    <script src="https://unpkg.com/ipfs-http-client/dist/index.min.js"></script>

    <script>

        // TODO: Create a ipfs-http-client instance and connect it to a remote daemon

        // https://github.com/ipfs/js-ipfs-http-client#in-a-web-browser

        const ipfs = window.IpfsHttpClient('/ip4/127.0.0.1/tcp/5001')

        const ipfsId = document.querySelector('#ipfsId')

        // ipfsId.textContent = JSON.stringify(id, null, 2)

        // TODO: use the http client to find the remote daemon ID

        // https://github.com/ipfs/interface-js-ipfs-core/blob/master/SPEC/MISCELLANEOUS.md#ipfsidcallback

        ipfs.id().then(id => ipfsId.textContent = JSON.stringify(id, null, 2))

    </script>

</body>

</html>

ipfs camp course c demo exercise 1的更多相关文章

Java设计模式--观察者模式到监听器
观察者模式是对象的行为模式.又叫做发布-订阅模式.模型-视图模式.源-监听器模式. 抽象主题角色:主题角色将所有对观察者对象的引用到保存在一个集合里,每个主题都可以拥有任意数量的观察者.抽象主题提供一 ...
Java数组倒置
Java数组之 -- 数组倒置方法一 : package mytest; public class test2 { public static void main(String[] args ...
Java数组最大值和最小值
package com.mybatis.demo.exercise; /** * @author yinsenxin */ public class ArrayMaxAndMin { public s ...
Conway's Game of Life: An Exercise in WPF, MVVM and C#
This blog post was written for the Lockheed Martin Insight blog, sharing here for the external audie ...
BZOJ1695 : [Usaco2007 Demo]Walk the Talk
观察单词表可以发现: 对于长度为3的单词,前两个字母相同的单词不超过7个对于长度为4的单词,前两个字母相同的单词不超过35个于是首先$O(26*26*nm)$预处理出 s1[x][i][j]表示( ...
Modelsim的demo入门教程
写在前面的话学过MCU设计的朋友都知道,系统调试是多么的重要.而对于FPGA设计来说,仿真确实最重要的.一个完整的项目,必须有完整的仿真平台.有朋友说,按键仿真模型没法搞. 我只能说,你并不了解硬件及 ...
IPFS星际文件系统
IPFS星际文件系统(InterPlanetary File System)是去中心化文件系统,本文介绍IPFS节点软件系统安装,环境搭建等简介入门教程,及学习如何使用ipfs-api和Node.js ...
如何在基于Bytom开发过程中集成IPFS
本文介绍了基于Bytom开发过程中集成IPFS. step1: 搭建bytom节点比原相关资料:https://github.com/Bytom-Community/Bytom_Docs 搭建byt ...
使用ipns 解决ipfs 内容更新的问题
ipds 可以使用dnslink 解决域名访问的问题,但是内容变更我们就会有新的hashid 解决方法我们可以使用ipns ,同时解决dnslink 解决域名的问题环境准备 docker-compo ...

随机推荐

calloc函数的使用和对内存free的认识
#include<stdlib.h> void *calloc(size_t n, size_t size): free(); 目前的理解: n是多少个这样的size,这样的使用类似有f ...
c#逐行读取文件到数组
/// <summary> /// 逐行读取文件到泛型数组 /// </summary> /// <param name="FilePath"> ...
Demo：基于 Flink SQL 构建流式应用
Flink 1.10.0 于近期刚发布,释放了许多令人激动的新特性.尤其是 Flink SQL 模块,发展速度非常快,因此本文特意从实践的角度出发,带领大家一起探索使用 Flink SQL 如何快速构 ...
Bugku-CTF之前女友(SKCTF)
Day35 前女友(SKCTF) http://123.206.31.85:49162/ flag格式:SKCTF{xxxxxxxxxxxxxxxxxx}
github，gitlab的区别
链接:https://blog.csdn.net/Xiamen_XiaoHong/article/details/83655447 总而言之:gitlab最优
【PAT甲级】1108 Finding Average (20分)
题意: 输入一个正整数N(<=100),接着输入一行N组字符串,表示一个数字,如果这个数字大于1000或者小于1000或者小数点后超过两位或者压根不是数字均为非法,计算合法数字的平均数. tri ...
win api 音频可视化
暂时记录,改天有时间再完善...其实写好好久了,但以前的代码丢了,重新写一遍.. 原理和 python 的一样,获取输入设备,然后把数据读取到 buffer 中,在绘制出来. 这里要注意两点: 1. ...
shell脚本自学之路
阿里云大学教学https://edu.aliyun.com/course/155/ 运行 chmod +x xx.sh ./xx.sh 基本语法:echo 输出 $赋值特殊变量: $* 变量的使 ...
December 31st, Week 53rd Tuesday, 2019
Nothing comes from nothing. 天下没有免费的午餐. Nothing comes from nothing, and in some cases, even something ...
吴裕雄 python 神经网络——TensorFlow实现搭建基础神经网络
import numpy as np import tensorflow as tf import matplotlib.pyplot as plt def add_layer(inputs, in_ ...

ipfs camp course c demo exercise 1