文档章节

gopherjs xhr 学习

electricface
 electricface
发布于 04/29 18:27
字数 583
阅读 12
收藏 0

gopherjs 生态里有 XMLHttpRequest 的包装 honnef.co/go/js/xhr 库(项目地址文档

XMLHttpReqeust 文档

例子

package main

import (
	"github.com/gopherjs/gopherjs/js"
	"honnef.co/go/js/xhr"
)

type Reply struct {
	*js.Object
	Headers map[string]string `js:"headers"`
}

func main() {
	req := xhr.NewRequest("GET", "http://httpbin.org/get")
	req.ResponseType = "json"
	err := req.Send(nil)
	if err != nil {
		println("err:", err)
		return
	}
	if req.Status != 200 {
		println("err:", req.StatusText)
		return
	}
	println(req.Response)
	reply := &Reply{Object: req.Response}

	ua := reply.Headers["User-Agent"]
	println("UA:", ua)
}

通过 xhr.NewRequest 创建出 *xhr.Request 对象,设置响应类型 ResponeType 为 "json",这样响应结果如果是 JSON 字符串就能被自动解析为 object。调用 Send 方法发送请求。

定义 Reply 结构,内嵌 *js.Object 字段,Header 字段加上 tag `js:"header"`, 再用 &Reply{Object: req.Response} 包装响应结果对象,这样就能用 go 的简洁语法访问内嵌的 js.Object。

更复杂些的例子

获取 http://httpbin.org/json 返回的 json 然后解析,当前返回的 json 是:

{
  "slideshow": {
    "author": "Yours Truly",
    "date": "date of publication",
    "slides": [
      {
        "title": "Wake up to WonderWidgets!",
        "type": "all"
      },
      {
        "items": [
          "Why <em>WonderWidgets</em> are great",
          "Who <em>buys</em> WonderWidgets"
        ],
        "title": "Overview",
        "type": "all"
      }
    ],
    "title": "Sample Slide Show"
  }
}

go 代码:

package main

import (
	"github.com/gopherjs/gopherjs/js"
	"honnef.co/go/js/xhr"
)

type SlideShow struct {
	*js.Object
	Author string   `js:"author"`
	Date   string   `js:"date"`
	Slides []*Slide `js:"slides"`
	Title  string   `js:"title"`
}

type Slide struct {
	*js.Object
	Title string   `js:"title"`
	Type  string   `js:"type"`
	Items []string `js:"items"`
}

func getJson() error {
	req := xhr.NewRequest("GET", "http://httpbin.org/json")
	req.ResponseType = "json"
	err := req.Send(nil)
	if err != nil {
		return err
	}
	println(req.Response)
	println(req.Status, req.StatusText)

	slideShow := &SlideShow{Object: req.Response.Get("slideshow")}
	println("author:", slideShow.Author)
	for i, slide := range slideShow.Slides {
		println(i, "title:", slide.Title)

		if slide.Get("items") != js.Undefined {
			for j, item := range slide.Items {
				println("    ", j, "item:", item)
			}
		}
	}
	return nil
}

func main() {
	err := getJson()
	if err != nil {
		println("err", err)
	}
}

同样是把 js 对象包装到 go 结构(SlideShow)中处理,特别指出 json 的 .slideshow.slides[0] 是没有 items 字段的,需要与 js.Undefined 相比来判断。

POST 方法发送 json 的例子

package main

import (
	"github.com/cathalgarvey/fmtless/encoding/json"
	"github.com/gopherjs/gopherjs/js"
	"honnef.co/go/js/xhr"
)

func callPostAnything() error {
	req := xhr.NewRequest("POST", "http://httpbin.org/anything")
	req.ResponseType = "json"
	req.SetRequestHeader("Content-Type", "application/json")
	data, err := json.Marshal(js.M{"a": 1, "b": 2})
	if err != nil {
		return err
	}
	err = req.Send(data)
	if err != nil {
		return err
	}

	println(req.Status)
	println(req.Response)
	return nil
}

func main() {
	err := callPostAnything()
	if err != nil {
		println("err", err)
	}
}

这里使用 fmtless 库提供的 json 包来把对象 js.M 序列化为 JSON 字符串,没有使用标准库的 fmt 包,这样可以减小 gopherjs 生成的 js 的体积。

调用 req.SetRequestHeader 方法设置请求头 Content-Type 为 application/json。

© 著作权归作者所有

electricface

electricface

粉丝 2
博文 37
码字总数 33242
作品 0
武汉
私信 提问
go 前端框架 vecty 学习

gopherjs 是把 go 编译为 js 的工具。vecty 是基于 gopherjs 的一种类似 React 的开发框架。 安装 gopherjs 和 vecty vecty 自带的例子在 example 目录,有 todomvc 和 markdown 编辑器。 简...

electricface
04/30
42
0
gopherjs 与 echo 配合

gopherjs 是把 go 转换为 js 的工具,echo 是 go 的 web 框架。 echo 官网: https://echo.labstack.com 使用 在 localhost:8080 开启服务,然后运行下面的 go代码,它使用 echo 框架在 loca...

electricface
04/29
13
0
GopherJS —— 将 Go 代码编译成 JavaScript

GopherJS 可以将 Go 代码编译成纯 JavaScript 代码。其主要目的是为了让你可以使用 Go 来编写前端代码,这些代码可执行在浏览器上运行。你可以通过这里尝试下 GopherJS: GopherJS Playgroun...

oschina
2014/10/15
76
0
WebAssembly 和 Go:对未来的观望

我反对学习 JavaScript 还有前端开发已经不是秘密了。事实上,在 CSS 出现前我就学会了 HTML,不过 JavaScript 是我做 Web 开发好久后的事情了。当看到现代 Web 的发展时,我感到不寒而栗。这...

oschina
2018/07/25
4K
8
WebAssembly 和 Go语言:对未来的观望

我反对学习 JavaScript 还有前端开发已经不是秘密了。事实上,在 CSS 出现前我就学会了 HTML,不过 JavaScript 是我做 Web 开发好久后的事情了。当看到现代 Web 的发展时,我感到不寒而栗。这...

程序师
2018/08/01
0
0

没有更多内容

加载失败,请刷新页面

加载更多

最好的重试是指数后退和抖动

1. 概述 在本教程中,我们将探讨如何使用两种不同的策略改进客户端重试:指数后退和抖动。 2. 重试 在分布式系统中,多个组件之间的网络通信随时可能发生故障。 客户端应用程序通过实现重试来...

liululee
23分钟前
3
0
聊一聊大厂内部的安全管理机制

工作了两个月了体会到了很多之前做外包小项目没有的东西,不得不说大厂的还是有自己一套的完善的体制,不会像B站那样泄露自己整个后台的源码这种事情发生。 电脑办公 比如说在使用电脑办公这...

gzc426
51分钟前
4
0
如何利用deeplearning4j中datavec对图像进行处理

NativeImageLoader Labelloader = new NativeImageLoader(112, 112, 3,new FlipImageTransform(-1)); 一、导读 众所周知图像是有红绿蓝三种颜色堆叠而成,利用deeplearning对图像处理,必须把...

冷血狂魔
52分钟前
8
0
1. Context - React跨组件访问数据的利器

《react-router-dom源码揭秘》系列 2. React-Router的基本使用 3. react-router-dom源码揭秘 - BrowserRouter Context提供了一种跨组件访问数据的方法。它无需在组件树间逐层传递属性,也可以...

前端老手
今天
6
0
Docker入门实战--开篇,为什么要使用Docker

前面Thrift文章中,我曾经介绍过我为什么要用Thrift。Docker的使用却是不一样的。纯属没事找事,因为我现在一个人的团队,项目只要一个project目录足够了! 那我何苦要用Docker呢 各位且听听...

后天的奇点
今天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部