Fireworks的JSON在线存取服务

之前介绍过《纯前端的在线JSON存储服务》,然后就尝试看能不能在Fireworks里读取和写入数据,结果很遗憾,从jsonstore.io等服务读数据是没有问题的,但写入时却报错误: 400,Bad Request,进行了多次尝试后依旧无果,最后只能放弃,猜测问题可能是因为FWXHR发送的数据格式不匹配所致。

Fireworks的未来由WaveF守护!秉着对Fireworks不离不弃的责任和态度,我又搬出了已经停掉的JsonPen.com网站源码,坚决要为Fireworks打通在线存取JSON功能,不要问我为什么,因为Fireworks是世界上最好的UI软件

FWXHR

这是JohnDurnning大神多年前写的一款插件,使用Flex发起网络请求,与Fireworks进行交互,由于当时Adobe的面板插件都是使用Flash开发的,所以交换数据上没有问题,但是由于核心SWF没有开源,所以工作只能在FWXHR基础上展开。

FWXHR的使用非常简单,只需在写脚本时将其作为模块导入,然后调用对应的方法即可:

导入模块

try { dojo.require; } catch (e) { fw.runScript(fw.currentScriptDir + "/lib/lib.js"); }
dojo.require("fwlib.io");

POST请求

var response = fwlib.io.request(
    "http://your-domain.com/api",  {
		    method: 'POST',
				headers: { "Content-Type": "application/xml; charset=utf-8" },
        data: { foo: 'bar' }, //数据传输
        fileData: { pageImage: tempPath } //文件传输
    }
);

GET请求

var response = fwlib.io.request( "http://your-domain.com/api" );

打印数据

需先开启Fireworks Console控制台面板

console.log(response);

JSONPEN

其实FWXHR已经足够简单,但为了配合jsonpenCURD操作,有必要再进行一层封装。

服务端

Create(创建)

通过/create创建新的数据,并返回可存取json的id,异同返回的还有一个名为origin的原始索引值,这个值只会在创建时显示一次,用于日后删除json数据,需要用户自行保存。

Update(更新)

通过/update?<json_id>更新json数据,实际上为了操作的简化(tōu lǎn)这里采用的是覆盖写入,最终会返回执行结果到客户端。

Read(读取)

通过/read?<json_id>读取json数据,并返回到客户端。

Delete(删除)

通过/delete?<origin_id>删除json数据,并返回执行结果到客户端。

Fireworks(客户端)

为FWXHR的dojo模块新增一个jsonpen()函数,使用new dojo.jsonpen()使其实例化,可以使用其中对FWXHR进行二次封装的CURD方法。

 
获取相关插件/源码

.setId(pen_id)

记住对json进行读写时所使用的id,这样就不用每次都作为参数传递了。

.create(callback)

向服务器请求一个新的json数据仓位,通过回调(可选)获取仓位的id、origin以及执行结果。

jsonpen.create(function(res){console.log(res);});
//{ id: "<pen_id>", origin: "<origin_id>", url: "<request_url>", info: { responseText: "<response>", status: 200, statusText: "OK" } }

.update(json, callback)

将json数据存储到服务器上,在回调(可选)中可查看执行结果。

jsonpen.update(json, function(res){console.log(res);});
//{ responseText: "<response>", status: 200, statusText: "OK" }

.read(callback)

从服务器读取json数据,此处通过回调(必须)获取数据。

jsonpen.read(function(res){var data = dojo.fromJson(result.data); console.log(res, data);});
//{ data: "<json>", info: { responseText: "<response>", status: 200, statusText: "OK" } }

.del(origin, callback)

删除服务器上的json数据,origin是必填参数,同样回调(可选)用于查看执行结果的。

jsonpen.del(function(res){console.log(res);});
//{ responseText: "Data deleted successfully.", status: 200, statusText: "OK" }

.setFile(filePath)

为了离线状态下也能存取本地备份的json数据,就增加了相关方法,这里和setId()的作用相仿,是用来记住本地json文件副本的路径的,方便后面的save和load,注意如果要将文件保存在某些敏感路径下的时候,需要以管理员身份运行Fireworks。

.save(json)

将json数据写入通过setFile指定路径下的文件。

.load()

setFile指定的文件中读取json数据。

.help()

为了在Fireworks里方便查看说明文档而添加的方法,会以alert形式显示。

注意事项

如果要在Fireworks的jsf脚本里使用中文汉字,那需要使用GB2312对这个jsf文件进行编码,否则存取json时会出现乱码。