分类
技术

通过jQuery Ajax使用FormData对象上传文件



$.ajax({
url: ‘/upload’,
type: ‘POST’,
cache: false,
data: new FormData($(‘#uploadForm’)[0]),
processData: false,
contentType: false
}).done(function(res) {
}).fail(function(res) {});

processData设置为false。因为data值是FormData对象,不需要对数据做处理。

标签添加enctype=”multipart/form-data”属性。

cache设置为false,上传文件不需要缓存。

contentType设置为false。因为是由

表单构造的FormData对象,且已经声明了属性enctype=”multipart/form-data”,所以这里设置为false。

上传后,服务器端代码需要使用从查询参数名为file获取文件输入流对象,因为中声明的是name=”file”。


var formData = new FormData();
formData.append(‘file’, $(‘#file’)[0].files[0]);
$.ajax({
url: ‘/upload’,
type: ‘POST’,
cache: false,
data: formData,
processData: false,
contentType: false
}).done(function(res) {
}).fail(function(res) {});

这里有几处不一样:

append()的第二个参数应是文件对象,即$(‘#file’)[0].files[0]。

contentType也要设置为‘false’。

从代码$(‘#file’)[0].files[0]中可以看到一个标签能够上传多个文件,
只需要在里添加multiple或multiple=”multiple”属性。

来源:https://www.jianshu.com/p/46e6e03a0d53

分类
技术

js中小数的格式化

因为精度问题,JS中小数运算经常结果会变的很长,不简洁,这个时候推荐toFixed();

具体例子
var numObj = 12345.6789;

numObj.toFixed(); // Returns ‘12346’: note rounding, no fractional part
numObj.toFixed(1); // Returns ‘12345.7’: note rounding
numObj.toFixed(6); // Returns ‘12345.678900’: note added zeros
(1.23e+20).toFixed(2); // Returns ‘123000000000000000000.00’
(1.23e-10).toFixed(2); // Returns ‘0.00’
2.34.toFixed(1); // Returns ‘2.3’
2.35.toFixed(1); // Returns ‘2.4’. Note it rounds up
2.55.toFixed(1); // Returns ‘2.5’. Note it rounds down – see warning above
-2.34.toFixed(1); // Returns -2.3 (due to operator precedence, negative number literals don’t return a string…)
(-2.34).toFixed(1); // Returns ‘-2.3’ (…unless you use parentheses)

分类
技术

chrome 如何优雅的截屏

F12 或 Ctrl + Shift + I 打开开发者工具,

按 Ctrl + Shift + P ,

在弹出的输入框里输入 full size screenshot (其实不需要输入完整,可以自动补全),

然后按回车即可

 

补充:在 Mac 下打开开发者工具的快捷键是 Cmd + Opt + I;Ctrl + Shift + P 对应的是 Cmd + Shift + P。

参考:https://www.zhihu.com/question/20075570

https://youtu.be/4mx1m7UbBR0?t=63

分类
前端开发环境

chrome 浏览器 解决跨域问题

版本号49之前的直接在后面加上--disable-web-security 就可以了。

重点是版本在49之后的。

chrome的版本升到49之后,跨域设置比以前严格了,在打开命令上加–disable-web-security之后还需要给出新的用户个人信息的目录。众所周知chrome是需要用gmail地址登录的浏览器,登录后就会生成一个存储个人信息的目录,保存用户的收藏、历史记录等个人信息。49版本之后,如果设置chrome浏览器为支持跨域模式,需要指定出一个个人信息目录,而不能使用默认的目录,估计是chrome浏览器怕用户勿使用跨域模式泄露自己的个人信息(主要是cookie,很多网站的登录token信息都是保存在cookie里)。

具体做法为:

1.在电脑上新建一个目录,例如:D:\ChromeDevUserData

2.在属性页面中的目标输入框里加上   --disable-web-security --user-data-dir=D:\ChromeDevUserData        ,--user-data-dir的值就是刚才新建的目录。

3.点击应用和确定后关闭属性页面,并打开chrome浏览器。

再次打开chrome,发现有“–disable-web-security”相关的提示,说明chrome又能正常跨域工作了。

参考:

http://www.spasvo.com/news/html/201634135708.html

https://segmentfault.com/q/1010000004609895

分类
技术

TypeScript中的数据类型

基础类型
布尔值
boolean
数字(浮点型)
number
字符串(单’双”都可以表示)
string
还可以使用模板字符串
被反引号包围( `),并且以${ expr }这种形式嵌入表达式
“`
let name: string = `Gene`;
let age: number = 37;
let sentence: string = `Hello, my name is ${ name }.

I’ll be ${ age + 1 } years old next month.`;
“`
也可以写成

“`
let sentence: string = “Hello, my name is ” + name + “.\n\n” +
“I’ll be ” + (age + 1) + ” years old next month.”;
“`
数组
[]
还可以使用
array<元素类型> = [1,2,3];

元组 Tuple
元组类型允许表示一个已知元素数量和类型的数组,各元素的类型不必相同。 比如,你可以定义一对值分别为 string和number类型的元组。

“`
// Declare a tuple type
let x: [string, number];
// Initialize it
x = [‘hello’, 10]; // OK
// Initialize it incorrectly
x = [10, ‘hello’]; // Error
“`
当访问一个已知索引的元素,会得到正确的类型:

“`
console.log(x[0].substr(1)); // OK
console.log(x[1].substr(1)); // Error, ‘number’ does not have ‘substr’
“`
当访问一个越界的元素,会使用联合类型替代:

“`
x[3] = ‘world’; // OK, 字符串可以赋值给(string | number)类型

console.log(x[5].toString()); // OK, ‘string’ 和 ‘number’ 都有 toString

x[6] = true; // Error, 布尔不是(string | number)类型
“`
枚举
enum类型是对JavaScript标准数据类型的一个补充。 像C#等其它语言一样,使用枚举类型可以为一组数值赋予友好的名字。

“`
enum Color {Red, Green, Blue}
let c: Color = Color.Green;
“`
默认情况下,从0开始为元素编号。 你也可以手动的指定成员的数值。 例如,我们将上面的例子改成从 1开始编号:

“`
enum Color {Red = 1, Green, Blue}
let c: Color = Color.Green;
“`
或者,全部都采用手动赋值:

“`
enum Color {Red = 1, Green = 2, Blue = 4}
let c: Color = Color.Green;
“`
枚举类型提供的一个便利是你可以由枚举的值得到它的名字。 例如,我们知道数值为2,但是不确定它映射到Color里的哪个名字,我们可以查找相应的名字:
“`
enum Color {Red = 1, Green, Blue}
let colorName: string = Color[2];

alert(colorName); // 显示’Green’因为上面代码里它的值是2
“`
any
有时候,我们会想要为那些在编程阶段还不清楚类型的变量指定一个类型。 这些值可能来自于动态的内容,比如来自用户输入或第三方代码库。 这种情况下,我们不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查。 那么我们可以使用 any类型来标记这些变量:

“`
let notSure: any = 4;
notSure = “maybe a string instead”;
notSure = false; // okay, definitely a boolean
“`
在对现有代码进行改写的时候,any类型是十分有用的,它允许你在编译时可选择地包含或移除类型检查。 你可能认为 Object有相似的作用,就像它在其它语言中那样。 但是 Object类型的变量只是允许你给它赋任意值 – 但是却不能够在它上面调用任意的方法,即便它真的有这些方法:

“`
let notSure: any = 4;
notSure.ifItExists(); // okay, ifItExists might exist at runtime
notSure.toFixed(); // okay, toFixed exists (but the compiler doesn’t check)

let prettySure: Object = 4;
prettySure.toFixed(); // Error: Property ‘toFixed’ doesn’t exist on type ‘Object’.
“`
void
某种程度上来说,void类型像是与any类型相反,它表示没有任何类型。 当一个函数没有返回值时,你通常会见到其返回值类型是 void:

“`
function warnUser(): void {
alert(“This is my warning message”);
}
“`
声明一个void类型的变量没有什么大用,因为你只能为它赋予undefined和null:

“`
let unusable: void = undefined;
“`
Null 和 Undefined
TypeScript里,undefined和null两者各自有自己的类型分别叫做undefined和null。 和 void相似,它们的本身的类型用处不是很大:
默认情况下null和undefined是所有类型的子类型。 就是说你可以把 null和undefined赋值给number类型的变量。
然而,当你指定了–strictNullChecks标记,null和undefined只能赋值给void和它们各自。 这能避免 很多常见的问题。 也许在某处你想传入一个 string或null或undefined,你可以使用联合类型string | null | undefined。 再次说明,稍后我们会介绍联合类型。
>注意:我们鼓励尽可能地使用–strictNullChecks,但在本手册里我们假设这个标记是关闭的。
Never
never类型表示的是那些永不存在的值的类型。 例如, never类型是那些总是会抛出异常或根本就不会有返回值的函数表达式或箭头函数表达式的返回值类型; 变量也可能是 never类型,当它们被永不为真的类型保护所约束时。

never类型是任何类型的子类型,也可以赋值给任何类型;然而,没有类型是never的子类型或可以赋值给never类型(除了never本身之外)。 即使 any也不可以赋值给never。

下面是一些返回never类型的函数:

“`
// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
throw new Error(message);
}

// 推断的返回值类型为never
function fail() {
return error(“Something failed”);
}

// 返回never的函数必须存在无法达到的终点
function infiniteLoop(): never {
while (true) {
}
}
“`
类型断言
有时候你会遇到这样的情况,你会比TypeScript更了解某个值的详细信息。 通常这会发生在你清楚地知道一个实体具有比它现有类型更确切的类型。

通过类型断言这种方式可以告诉编译器,“相信我,我知道自己在干什么”。 类型断言好比其它语言里的类型转换,但是不进行特殊的数据检查和解构。 它没有运行时的影响,只是在编译阶段起作用。 TypeScript会假设你,程序员,已经进行了必须的检查。

类型断言有两种形式。 其一是“尖括号”语法:

复制到剪切板
let someValue: any = “this is a string”;

let strLength: number = (someValue).length;
另一个为as语法:

let someValue: any = “this is a string”;

let strLength: number = (someValue as string).length;
两种形式是等价的。 至于使用哪个大多数情况下是凭个人喜好;然而,当你在TypeScript里使用JSX时,只有 as语法断言是被允许的。

关于let
你可能已经注意到了,我们使用let关键字来代替大家所熟悉的JavaScript关键字var。 let关键字是JavaScript的一个新概念,TypeScript实现了它。 我们会在以后详细介绍它,很多常见的问题都可以通过使用 let来解决,所以尽可能地使用let来代替var吧。

分类
技术

如何使用新浪微博做图床

大家一定都经历过照片放QQ空间被压缩的事情,作为一个有趣的人,我不能接受的。那么大家写文章的时候想插入图怎么办尼?

首先给大家科普下图床是干什么的,可以简单的理解为就是用来存放图片的服务器(目前本站没有钱来给大家提供图床)

今天给大家分享一种免费的方式,用新浪微博做图床。

首先打开新浪微博,登陆自己的账号,打开我的相册,选中自己要的图

右上角

查看原图,在图片上右键点击复制图片地址。

比如我这里就是(复制出来会自动识别成图片)

以上

新浪微博的图这样是不压缩的,质量取决于你上传的质量,并且单张最大20M,欢迎大家使用新浪微博的图。

 

 

分类
技术

wordpree配置邮件系统

很多主机空间都是关闭邮件的端口的,我也遇到了这种情况,网上主要推荐是使用插件,我来分享下我的成功经历。

这里使用的插件是 Easy WP SMTP。

直接安装,打开设置

From Email Address     就是你的电子邮件地址

From Name                   显示的名字

Reply-To Email Address    可选。此电子邮件地址将用于电子邮件的“回复到”字段中。让它空白,使用“从”电子邮件作为回复值。

SMTP Host         邮件服务商的主机地址   例如QQ smtp.qq.com 支持ssl  端口465

Type of Encryption          加密方式 不推荐明文 太危险了

SMTP Port         主机的端口

SMTP Authentication    SMTP认证 是否开启认证,推荐开启,可以减少被当成垃圾邮件的概率

SMTP username      邮件的全称包括 @qq.com

SMTP Password    邮件的密码 注意:现在很多的邮件服务商都提供了类似二次验证的功能,请注意区分这个和密码的不同

编辑完成别忘记保存。

最下方有个测试功能,给自己发一封吧。

以上