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 ...

随机推荐

EQ实现
原理参考: https://www.cnblogs.com/fellow1988/p/9189338.html https://www.cnblogs.com/fellow1988/p/9136346 ...
js对象冒充实现的继承
//人类 function Person(name) { this.name = name; this.showName = function () { console.log("my na ...
6_13古代象形符号（UVa1103）<图的连通块的应用>
给出一幅黑白图像,每行相邻的四个点压缩成一个十六进制的字符.然后还有题中图示的6中古老的字符,按字母表顺序输出这些字符的标号. 输出说明:For each test case, display its ...
JQuery/JS插件 jsTree加载树，预先加载，初始化时加载前三级节点，当展开第三级节点时就加载该节点下的所有子节点
jsTree加载树, 初始化时加载前三级节点, 当展开第三级节点时就加载该节点下的所有子节点 html: <!DOCTYPE html> <html> <head&g ...
Jmeter注册100个账户的三个方法
Jmeter注册账户比如注册成千上万个账户,如何快速实现呢? 三种方法分别举例注册5个账户 1)添加CSV data config_txt 2)添加CSV data config_csv 3)函数助手 ...
第一篇：thinkPHP学习目的
公司找人开发了一套程序,用的是thinkphp,我一直都是做前端的,后端对PHP也有一些了解,能看懂代码,但是不能写,因为公司不想再招人,嘱托我来维护. 翻看了thinkphp的官方文档,也去看了一下 ...
前端——语言——Core JS——《The good part》读书笔记——第五章节(Inheritance)
本章题目是继承,实质上介绍JS如何实现面向对象的三大特性,封装,继承,多态.本章的最后一个小节介绍事件. 与Java语言对比,虽然名称同样称为类,对象,但是显然它们的含义存在一些细微的差异,而且实现三 ...
Mac 配置cron
请参考:https://www.cnblogs.com/EasonJim/p/7819635.html 查看 crontab 是否启动 sudo launchctl list | grep cron ...
RAID 0实验：mdadm
*独立冗余磁盘阵列---RAID0* RAID0: 把多块物理硬盘设备(至少两块)通过硬件或软件的方式串联在一起, 组成一个大的卷组,并将数据依次写入到各个物理硬盘中.任意一块硬盘发生故障将导致整 ...
dk7和jdk8的一些新特性
本文是我学习了解了j 的一些资料,有兴趣的大家可以浏览下下面的内容. 官方文档:http://www.oracle.com/technetwork/java/javase/jdk7-relnotes- ...

ipfs camp course c demo exercise 1